#subWrap { position:relative; }
#subWrap #sv { position:relative; background-color:#fff; height:637px; overflow:hidden; }
#subWrap #sv:after { content:""; display:block; opacity:0.2; position:absolute; right:-52px; bottom:40px; width:377px; height:412px; background:url(/img/common/subTop_bg.svg) right center no-repeat; }
#subWrap #sv > div { height:100%; }
#subWrap #sv .sub-titleBox { position:absolute; bottom:105px; left:0; z-index:1; }
#subWrap #sv .sub-titleBox h2 { color:#111; font-size:95px; font-weight:700; line-height:1.2 }
#subWrap #sv .sub-titleBox h2 span { font-weight:700; }
#subWrap #sv .sub-titleBox h3.stit,
#subWrap #sv .sub-titleBox h3.stit-10 { position:relative; color:#111; font-size:25px; font-weight:300; margin-top:25px; padding-left:13px; display:inline-block; }
#subWrap #sv .sub-titleBox h3.stit:after,
#subWrap #sv .sub-titleBox h3.stit-10:after { content:""; display:block; position:absolute; left:0; top:10px; width:4px; height:4px; border-radius:4px; background:#ff7b0f; }
#subWrap #sv .location { position:absolute; bottom:105px; right:0; z-index:1; }
#subWrap #sv .location dl { display:flex; align-items:center; }
#subWrap #sv .location dt { width:13px; height:12px; overflow:hidden; margin-right:8px; text-indent:-9999em; background:url(/img/common/home_icon.png) right center no-repeat; }
#subWrap #sv .location dd { color:#666; font-size:14px; font-weight:300; display:flex; align-items:center; }
#subWrap #sv .location dd span,
#subWrap #sv .location dd strong { font-weight:400; white-space:nowrap; }
#subWrap #sv .location dd span { display:inline-block; margin:0 8px; }
#subWrap #sv .location dd strong { display:inline-block; margin-left:10px; }
@media screen and (max-width:1640px){
	#subWrap #sv .sub-titleBox { padding:0 80px; }
    #subWrap #sv .location { right:80px; }
}
@media screen and (max-width:1280px){
    #subWrap #sv { height:520px; }
    #subWrap #sv:after { right:-33px; bottom:40px; width:280px; height:307px; }
    #subWrap #sv .sub-titleBox { bottom:90px; }
    #subWrap #sv .sub-titleBox h2 { font-size:65px; }
    #subWrap #sv .sub-titleBox h3.stit,
    #subWrap #sv .sub-titleBox h3.stit-10{ font-size:22px; margin-top:22px; }
    #subWrap #sv .sub-titleBox h3.stit:after,
    #subWrap #sv .sub-titleBox h3.stit-10:after{ top:10px; width:4px; height:4px; }
    #subWrap #sv .location { bottom:90px; }
}
@media screen and (max-width:1024px){
    #subWrap #sv { height:460px; }
    #subWrap #sv:after { left:50%; right:unset; transform:translate(-50%); bottom:80px; width:220px; height:240px; }
	#subWrap #sv .sub-titleBox { padding:0 60px; width:100%; bottom:100px; text-align:center; }
    #subWrap #sv .sub-titleBox h2 { font-size:55px; }
    #subWrap #sv .sub-titleBox h3.stit,
    #subWrap #sv .sub-titleBox h3.stit-10{ font-size:22px; margin-top:22px; }
    #subWrap #sv .sub-titleBox h3.stit:after,
    #subWrap #sv .sub-titleBox h3.stit-10:after{ top:10px; width:4px; height:4px; }
    #subWrap #sv .location { display:none; left:50%; right:unset; transform:translate(-50%); bottom:40px; }
}
@media screen and (max-width:640px){
    #subWrap #sv { height:380px; }
    #subWrap #sv:after { bottom:60px; width:180px; height:197px; }
	#subWrap #sv .sub-titleBox { padding:0 20px; bottom:85px; }
    #subWrap #sv .sub-titleBox h2 { font-size:34px; }
    #subWrap #sv .sub-titleBox h3.stit,
    #subWrap #sv .sub-titleBox h3.stit-10{ font-size:18px; margin-top:18px; }
    #subWrap #sv .sub-titleBox h3.stit:after,
    #subWrap #sv .sub-titleBox h3.stit-10:after{ top:8px; width:3px; height:3px; }
    #subWrap #sv .location dd span { margin:0 6px; }
    #subWrap #sv .location dd strong { margin-left:8px; }
}


/* animation */
#subWrap #sv .sub-titleBox h2 span { display:block; overflow:hidden; }
#subWrap #sv .sub-titleBox h2 span > span { opacity:0; display:inline-block; min-width:20px; }
#subWrap #sv .sub-titleBox h2 span > span { animation:ani_3 .8s 0.5s; animation-fill-mode:both; }
#subWrap #sv:after { animation:ani_2-1 1.5s 0.3s; animation-fill-mode:both; }
@media screen and (max-width:1024px){
    #subWrap #sv:after { animation:ani_5-1 1.5s 0.3s; animation-fill-mode:both; }
}


#lnb { margin-top:65px; }
#lnb > ul { display:flex; }
#lnb > ul > li:not(last-child) { margin-right:10px; }
#lnb > ul > li a { display:flex; align-items:center; justify-content:center; height:58px; padding:0 30px; border:1px solid #d9d9d9; color:#666; font-size:15px; font-weight:400; border-radius:50px; }
#lnb > ul > li.on a { border:1px solid #ff7b0f; color:#fff; font-weight:700; background-color:#ff7b0f; }
@media screen and (max-width:1280px){
    #lnb { margin-top:50px; }
    #lnb > ul > li a { height:50px; padding:0 30px; font-size:15px; }
}
@media screen and (max-width:1024px){
    #lnb { margin-top:30px; }
    #lnb > ul { justify-content:center; }
    #lnb > ul > li a { height:45px; padding:0 25px; font-size:14px; }
}
@media screen and (max-width:640px){
    #lnb { margin-top:25px; }
    #lnb > ul > li:not(last-child) { margin-right:7px; }
    #lnb > ul > li a { height:40px; padding:0 20px; }
}

.sub-visual { position:relative; }
.sub-visual .imgbox { position:relative; overflow:hidden; }
.sub-visual .imgbox:before {content:""; display:block; padding-bottom:30.75%; }
.sub-visual .imgbox img { position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover; -o-object-fit:cover; }
@media screen and (max-width:640px){
    .sub-visual .imgbox:before { padding-bottom:45%; }
}
/* animation */
.sub-visual:after { content:""; display:block; width:100%; height:100%; background:#fff; position:absolute; right:0; top:0; }
.sub-visual:after { animation:ani_w50 1.2s 0.8s; animation-fill-mode:both; }
.sub-visual .imgbox:after { content:""; display:block; width:100%; height:100%; background:#fff; position:absolute; left:0; top:0; }
.sub-visual .imgbox:after { animation:ani_w50 1.2s 0.8s; animation-fill-mode:both; }
@media screen and (max-width:640px){
    .sub-visual:after,
    .sub-visual .imgbox:after { display:none; }
    .sub-visual { overflow:hidden } 
    .sub-visual .imgbox { transform:scale(1.15); }
    .sub-visual .imgbox { animation:bgs5 0.8s 0.1s; animation-fill-mode:both; }
}

.subTitle-box { text-align:center; }
.subTitle-box h3 { font-size:60px; font-weight:700; color:#111; line-height:1.2 }
.subTitle-box h3 span { font-weight:700; }
.subTitle-box .txt { margin-top:35px; font-size:20px; font-weight:300; color:#333; line-height:1.4; }
@media screen and (max-width:1280px){
    .subTitle-box h3 { font-size:45px; }
    .subTitle-box .txt { margin-top:30px; font-size:19px; }
}
@media screen and (max-width:1024px){
    .subTitle-box h3 { font-size:36px; }
    .subTitle-box .txt { margin-top:20px; font-size:18px; }
}
@media screen and (max-width:640px){
    .subTitle-box h3 { font-size:28px; }
    .subTitle-box .txt { margin-top:15px; font-size:16px; }
}
/* animation */
.subTitle-box h3 { overflow:hidden }
.subTitle-box h3 span { display:block; animation:ani_3 .8s 0.5s; animation-fill-mode:both; }
.subTitle-box .txt { display:block; animation:ani_5 .8s 1.0s; animation-fill-mode:both; }

#subCont { padding-top:75px; margin-bottom:190px; }
@media screen and (max-width:1024px){
    #subCont { padding-top:50px; margin-bottom:140px; }
}
@media screen and (max-width:640px){
    #subCont { padding-top:40px; margin-bottom:100px; }
}

#subCont .btnbox { margin-top:65px; text-align:center; }
#subCont .btnbox a,
#subCont .btnbox button { display:inline-block; text-align:center; border:none; outline:none; background:none; margin:0 8px;  }
#subCont .btnbox a span,
#subCont .btnbox button span { margin:0 auto; justify-content:center; align-items:center; display:flex; position:relative; text-align:center; border:none; outline:none; background-color:#ff7b0f; min-width:162px; height:66px; color:#fff; font-size:17px; font-weight:500; border-radius:60px; }
#subCont .btnbox a span { border:1px solid #d6d6d6; background:none; color:#666; }
#subCont .btnbox a.bg_o span { border:1px solid #ff7b0f; background:#ff7b0f; color:#fff; }
@media screen and (max-width:1024px){	
	#subCont .btnbox a span,
	#subCont .btnbox button span { height:60px; font-size:16px; }
}
@media screen and (max-width:640px){	
    #subCont .btnbox { margin-top:40px; }
    #subCont .btnbox a,
    #subCont .btnbox button { margin:0 3px; }
	#subCont .btnbox a span,
	#subCont .btnbox button span { height:55px; }
}

/* tabmenu */
.tabmenu { margin-top:85px; }
.tabmenu > ul { text-align:center; display:flex; flex-wrap:wrap; justify-content:center; gap:0 55px; }
.tabmenu > ul > li a { position:relative; color:#999; font-size:20px; font-weight:300; transition:all 0.3s }
.tabmenu > ul > li a:after { content:""; display:block; position:absolute; left:50%; top:-20px; transform:translateX(-50%); width:6px; height:6px; border-radius:6px; background:#ff7b0f; opacity:0; transition:all 0.3s }
.tabmenu > ul > li.active a { color:#ff7b0f; font-weight:700; }
.tabmenu > ul > li.active a:after { opacity:1;}
@media screen and (max-width:1024px){	
    .tabmenu { margin-top:60px; }
    .tabmenu > ul { gap:30px 40px; }
    .tabmenu > ul > li a { font-size:18px; }
    .tabmenu > ul > li a:after { top:-18px; width:6px; height:6px; }
}
@media screen and (max-width:640px){	
    .tabmenu { margin-top:40px; }
    .tabmenu > ul { gap:30px 22px; }
    .tabmenu > ul > li a { font-size:16px; }
    .tabmenu > ul > li a:after { top:-13px; width:5px; height:5px; }
}

/* overview-box */
.overview-box .overview-top { margin-top:125px; text-align:center; }
.overview-box .overview-top .txt-1 { font-size:62px; font-weight:700; color:#111; line-height:1.4; }
.overview-box .overview-top .txt-1 span { font-weight:700; color:#ff7b0f; }
.overview-box .overview-top .txt-2 { margin-top:55px; font-size:20px; font-weight:400; color:#333; line-height:1.5; }
.overview-box .overview-info { margin-top:80px; }
.overview-box .overview-info .top-box > ul { display:flex; flex-wrap:wrap; align-items:center; padding:40px 0; background-color:#f7f7f7; }
.overview-box .overview-info .top-box > ul > li { width:50%; display:flex; align-items:center; }
.overview-box .overview-info .top-box > ul > li:first-child { padding-left:80px; }
.overview-box .overview-info .top-box > ul > li .img-box { width:27%; }
.overview-box .overview-info .top-box > ul > li .icon-box { width:100px; height:100px; background-color:#ff7b0f; border-radius:100px; display:flex; align-items:center; justify-content:center; }
.overview-box .overview-info .top-box > ul > li .info-box { width:calc(100% - 27%); }
.overview-box .overview-info .top-box > ul > li .info-box ul { display:flex; flex-wrap:wrap; gap:22px 0; }
.overview-box .overview-info .top-box > ul > li .info-box li { width:50%; color:#333; font-weight:300; font-size:18px; line-height:1.4; }
.overview-box .overview-info .top-box > ul > li .info-box li strong { color:#ff7b0f; font-weight:700; }
.overview-box .overview-info .listbox { position:relative; margin-top:195px; }
.overview-box .overview-info .listbox:after { content:""; display:block; position:absolute; left:50%; top:-130px; transform:translateX(-50%); width:34px; height:34px; background:url(/img/sub/overview_info_arr1.png) center center no-repeat; }
.overview-box .overview-info .listbox ul { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:0 42px; }
.overview-box .overview-info .listbox li { width:calc((100% - 84px) / 3); height:312px; display:flex; align-items:center; justify-content:center; text-align:center;  box-shadow:20px 20px 25px rgba(0,0,0,0.05); }
.overview-box .overview-info .listbox li dt { min-height:35px; }
.overview-box .overview-info .listbox li dd { position:relative; margin-top:60px; min-height:60px; color:#333; line-height:2.0; font-weight:300; }
.overview-box .overview-info .listbox li dd:after { content:""; display:block; position:absolute; left:50%; top:-35px; transform:translateX(-50%); width:14px; height:8px; background:url(/img/sub/overview_info_arr2.png) center center no-repeat; }
.overview-box .vision-box { margin-top:200px; display:flex; flex-wrap:wrap; align-items:center; }
.overview-box .vision-box > div { width:50%; }
.overview-box .vision-box .imgbox { position:relative; overflow:hidden; }
.overview-box .vision-box .imgbox:before {content:""; display:block; padding-bottom:75%; }
.overview-box .vision-box .imgbox img { position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover; -o-object-fit:cover; }
.overview-box .vision-box .txtbox { padding-left:120px; }
.overview-box .vision-box .txtbox dt h4 { margin-top:60px; color:#111; font-size:62px; font-weight:700; }
.overview-box .vision-box .txtbox dd { margin-top:40px; color:#333; font-size:20px; font-weight:300; line-height:1.8; }
.overview-box .core-value { padding:145px 0 190px; margin-top:154px; background-color:#f7f7f7; }
.overview-box .core-value h4.tit { text-align:center; color:#111; font-size:50px; font-weight:700; }
.overview-box .core-value .listbox { margin-top:70px; }
.overview-box .core-value .listbox > ul { display:flex; flex-wrap:wrap; gap:0 34px; text-align:center; }
.overview-box .core-value .listbox > ul > li { width:calc((100% - 102px) / 4); height:410px; background-color:#fff; display:flex; align-items:center; justify-content:center; text-align:center; }
.overview-box .core-value .listbox > ul > li .icon { width:158px; height:158px; background-color:#ff7b0f; border-radius:200px; display:flex; align-items:center; justify-content:center; margin:0 auto }
.overview-box .core-value .listbox > ul > li dl { margin-top:40px; }
.overview-box .core-value .listbox > ul > li dt { color:#111; font-size:24px; font-weight:700; }
.overview-box .core-value .listbox > ul > li dt strong { color:#ff7b0f; font-size:42px; }
.overview-box .core-value .listbox > ul > li dd { margin-top:27px; min-height:48px; line-height:1.8; color:#333; font-size:16px; font-weight:300; padding:0 20px; }
@media screen and (max-width:1640px){
    .overview-box .vision-box .txtbox dd br { display:none }
}
@media screen and (max-width:1280px){
    .overview-box .overview-top .txt-1 { font-size:45px; }
    .overview-box .overview-top .txt-2 { margin-top:45px; font-size:19px; }
    .overview-box .overview-info { margin-top:60px; }
    .overview-box .overview-info .top-box > ul { padding:40px 0; gap:30px 0 }
    .overview-box .overview-info .top-box > ul > li:first-child { padding-left:50px; }
    .overview-box .overview-info .top-box > ul > li .img-box { width:27%; }
    .overview-box .overview-info .top-box > ul > li .info-box { width:calc(100% - 27%); }
    .overview-box .overview-info .top-box > ul > li .info-box ul { gap:20px 0; }
    .overview-box .overview-info .top-box > ul > li .info-box li { font-size:18px; }
    .overview-box .overview-info .listbox { margin-top:195px; }
    .overview-box .overview-info .listbox:after { top:-130px; width:34px; height:34px; }
    .overview-box .overview-info .listbox ul { gap:0 42px; }
    .overview-box .overview-info .listbox li { width:calc((100% - 84px) / 3); height:312px; }
    .overview-box .overview-info .listbox li dt { min-height:35px; }
    .overview-box .overview-info .listbox li dd { margin-top:60px; min-height:60px; }
    .overview-box .overview-info .listbox li dd:after { left:50%; top:-35px; width:14px; height:8px; }
    .overview-box .vision-box { margin-top:150px; }
    .overview-box .vision-box .txtbox { padding-left:90px; }
    .overview-box .vision-box .txtbox dt h4 { margin-top:50px; font-size:45px; }
    .overview-box .vision-box .txtbox dd { margin-top:40px; font-size:19px; }
    .overview-box .core-value { padding:120px 0 150px; margin-top:120px; }
    .overview-box .core-value h4.tit { font-size:38px; }
    .overview-box .core-value .listbox { margin-top:55px; }
    .overview-box .core-value .listbox > ul { gap:0 20px;}
    .overview-box .core-value .listbox > ul > li { width:calc((100% - 102px) / 4); height:380px; }
    .overview-box .core-value .listbox > ul > li .icon { width:120px; height:120px; }
    .overview-box .core-value .listbox > ul > li dl { margin-top:35px; }
    .overview-box .core-value .listbox > ul > li dt { font-size:20px; }
    .overview-box .core-value .listbox > ul > li dt strong { font-size:35px; }
    .overview-box .core-value .listbox > ul > li dd { margin-top:22px; min-height:44px; font-size:15px; }
    .overview-box .core-value .listbox > ul > li dd br { display:none }
}
@media screen and (max-width:1024px){
    .overview-box .overview-top { margin-top:90px; }
    .overview-box .overview-top .txt-1 { font-size:35px; }
    .overview-box .overview-top .txt-2 { margin-top:35px; font-size:18px; }
    .overview-box .overview-info { margin-top:50px; }
    .overview-box .overview-info .top-box > ul { padding:30px 0; }
    .overview-box .overview-info .top-box > ul > li,
    .overview-box .overview-info .top-box > ul > li:first-child { width:100%; padding-left:20px; }
    .overview-box .overview-info .top-box > ul > li .img-box { width:130px; }
    .overview-box .overview-info .top-box > ul > li .info-box { width:calc(100% - 130px); }
    .overview-box .overview-info .top-box > ul > li .info-box ul { gap:20px 0; }
    .overview-box .overview-info .top-box > ul > li .info-box li { font-size:17px; }
    .overview-box .overview-info .listbox { margin-top:150px; }
    .overview-box .overview-info .listbox:after { top:-90px; }
    .overview-box .overview-info .listbox ul { gap:30px 20px; }
    .overview-box .overview-info .listbox li { width:calc((100% - 40px) / 2); height:312px; }
    .overview-box .overview-info .listbox li dt { min-height:35px; padding:0 20px; }
    .overview-box .overview-info .listbox li dt img { max-width:100%; }
    .overview-box .overview-info .listbox li dd { margin-top:60px; min-height:60px; }
    .overview-box .vision-box { margin-top:120px; }
    .overview-box .vision-box > div { width:100%; }
    .overview-box .vision-box .imgbox:before { padding-bottom:40%; }
    .overview-box .vision-box .txtbox { padding:30px 20px; }
    .overview-box .vision-box .txtbox .icon img { width:35px; }
    .overview-box .vision-box .txtbox dt h4 { margin-top:40px; font-size:35px; }
    .overview-box .vision-box .txtbox dd { margin-top:30px; font-size:18px; }
    .overview-box .core-value { padding:100px 0 120px; margin-top:100px; }
    .overview-box .core-value h4.tit { font-size:30px; }
    .overview-box .core-value .listbox { margin-top:55px; }
    .overview-box .core-value .listbox > ul { gap:20px 20px;}
    .overview-box .core-value .listbox > ul > li { width:calc((100% - 40px) / 2); height:360px; }
    .overview-box .core-value .listbox > ul > li .icon { width:120px; height:120px; }
    .overview-box .core-value .listbox > ul > li dl { margin-top:30px; }
    .overview-box .core-value .listbox > ul > li dt { font-size:19px; padding:0 10px; }
    .overview-box .core-value .listbox > ul > li dt strong { font-size:30px; }
    .overview-box .core-value .listbox > ul > li dd { margin-top:20px; min-height:42px; font-size:15px; padding:0 10px; }
}
@media screen and (max-width:640px){
    .overview-box .overview-top { margin-top:50px; }
    .overview-box .overview-top .txt-1 { font-size:22px; }
    .overview-box .overview-top .txt-2 { margin-top:22px; font-size:16px; }
    .overview-box .overview-info { margin-top:40px; }
    .overview-box .overview-info .top-box > ul { padding:25px 0; }
    .overview-box .overview-info .top-box > ul > li .info-box ul { gap:5px 0; }
    .overview-box .overview-info .top-box > ul > li .info-box li { width:100%; font-size:16px; }
    .overview-box .overview-info .listbox { margin-top:150px; }
    .overview-box .overview-info .listbox:after { top:-90px; }
    .overview-box .overview-info .listbox ul { gap:20px 0; }
    .overview-box .overview-info .listbox li { width:100%; height:250px; }
    .overview-box .overview-info .listbox li dt { min-height:35px;}
    .overview-box .overview-info .listbox li dd { margin-top:40px; min-height:auto; }
    .overview-box .overview-info .listbox li dd:after { top:-25px; }
    .overview-box .vision-box { margin-top:80px; }
    .overview-box .vision-box .imgbox:before { padding-bottom:40%; }
    .overview-box .vision-box .txtbox { padding:30px 20px; }
    .overview-box .vision-box .txtbox .icon img { width:30px; }
    .overview-box .vision-box .txtbox dt h4 { margin-top:30px; font-size:22px; }
    .overview-box .vision-box .txtbox dd { margin-top:20px; font-size:16px; }
    .overview-box .core-value { padding:80px 0 100px; margin-top:80px; }
    .overview-box .core-value h4.tit { font-size:20px; }
    .overview-box .core-value .listbox { margin-top:30px; }
    .overview-box .core-value .listbox > ul { gap:10px 10px;}
    .overview-box .core-value .listbox > ul > li { width:calc((100% - 20px) / 2); height:auto; padding:20px 0 30px; align-items:flex-start; }
    .overview-box .core-value .listbox > ul > li .icon { width:110px; height:110px; }
    .overview-box .core-value .listbox > ul > li dl { margin-top:20px; }
    .overview-box .core-value .listbox > ul > li dt { font-size:18px; }
    .overview-box .core-value .listbox > ul > li dt strong { font-size:26px; }
    .overview-box .core-value .listbox > ul > li dd { margin-top:15px; }
}

/* animation */
.overview-box .overview-top .txt-1,
.overview-box .overview-top .txt-2 { opacity:0; }
.overview-box .overview-top.subOn .txt-1 { animation:ani_4 .8s 0.5s; animation-fill-mode:both; }
.overview-box .overview-top.subOn .txt-2 { animation:ani_4 .8s 0.7s; animation-fill-mode:both; }
.overview-box .overview-info .top-box > ul > li { opacity:0; }
.overview-box .overview-info .top-box.subOn > ul > li:nth-child(1) { animation:ani_2 .8s 0.7s; animation-fill-mode:both; }
.overview-box .overview-info .top-box.subOn > ul > li:nth-child(2) { animation:ani_1 .8s 0.7s; animation-fill-mode:both; }
.overview-box .overview-info .listbox li { opacity:0; }
.overview-box .overview-info .listbox.subOn li:nth-child(1) { animation:ani_3 .8s 0.2s; animation-fill-mode:both; }
.overview-box .overview-info .listbox.subOn li:nth-child(2) { animation:ani_3 .8s 0.4s; animation-fill-mode:both; }
.overview-box .overview-info .listbox.subOn li:nth-child(3) { animation:ani_3 .8s 0.6s; animation-fill-mode:both; }
.overview-box .overview-info .listbox.subOn li:nth-child(4) { animation:ani_3 .8s 0.8s; animation-fill-mode:both; }
.overview-box .vision-box .imgbox:after { content:""; display:block; width:100%; height:100%; background:#fff; position:absolute; left:0; top:0; }
.overview-box .vision-box.subOn .imgbox:after { animation:ani_w 1.0s 0.5s; animation-fill-mode:both; }
.overview-box .vision-box .txtbox .icon img,
.overview-box .vision-box .txtbox dt h4,
.overview-box .vision-box .txtbox dd { opacity:0; }
.overview-box .vision-box.subOn .txtbox .icon img { animation:bgs4 0.8s 0.1s; animation-fill-mode:both; }
.overview-box .vision-box.subOn .txtbox dt h4 { animation:ani_3 0.8s 0.4s; animation-fill-mode:both; }
.overview-box .vision-box.subOn .txtbox dd { animation:ani_3 0.8s 0.7s; animation-fill-mode:both; }
.overview-box .core-value h4.tit,
.overview-box .core-value .listbox > ul > li { opacity:0; }
.overview-box .core-value.subOn h4.tit { animation:ani_4 0.8s 0.4s; animation-fill-mode:both; }
.overview-box .core-value.subOn .listbox > ul > li:nth-child(1) { animation:ani_3 .8s 0.2s; animation-fill-mode:both; }
.overview-box .core-value.subOn .listbox > ul > li:nth-child(2) { animation:ani_3 .8s 0.4s; animation-fill-mode:both; }
.overview-box .core-value.subOn .listbox > ul > li:nth-child(3) { animation:ani_3 .8s 0.6s; animation-fill-mode:both; }
.overview-box .core-value.subOn .listbox > ul > li:nth-child(4) { animation:ani_3 .8s 0.8s; animation-fill-mode:both; }

/* history-box */
.history-box > div { display:flex; flex-wrap:wrap; }
.history-box > div > div { position:relative; width:50%; }
.history-box .nav-box { position:sticky; top:100px; max-height:620px; }
.history-box .nav-box > ul > li dt h3 > span { cursor:pointer; }
.history-box .nav-box > ul > li:not(last-child) { margin-bottom:10px; }
.history-box .nav-box > ul > li dt h3 { color:#bfbfbf; font-size:18px; font-weight:300; transition:all 0.3s; }
.history-box .nav-box > ul > li.on dt h3 { display:block; color:#111; font-size:70px; font-weight:700; }
.history-box .nav-box > ul > li.on dt h3 span { font-weight:700; }
.history-box .nav-box > ul > li dd { display:none; margin-top:20px; }
.history-box .nav-box > ul > li dd .txtbox p { color:#111; font-size:30px; font-weight:400; line-height:1.5; }
.history-box .nav-box > ul > li dd .imgbox { margin:45px 0; position:relative; overflow:hidden; max-width:445px; }
.history-box .nav-box > ul > li dd .imgbox:before {content:""; display:block; padding-bottom:68.5%; }
.history-box .nav-box > ul > li dd .imgbox img { position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover; -o-object-fit:cover; }
.history-box .nav-box > ul > li.on dd { display:block; }
.history-box .history-list > div > ul:not(:last-child) { margin-bottom:65px; border-bottom:1px solid #d6d6d6; }
.history-box .history-list > div > ul > li { padding-bottom:65px; }
.history-box .history-list > div > ul > li:not(:last-child) { margin-bottom:65px; border-bottom:1px solid #d6d6d6; }
.history-box .history-list > div > ul > li > dl { display:flex; flex-wrap:wrap; }
.history-box .history-list > div > ul > li > dl > dt { width:120px; color:#111; font-size:30px; font-weight:700; }
.history-box .history-list > div > ul > li > dl > dd { width:calc(100% - 120px); }
.history-box .history-list > div > ul > li > dl > dd li:not(:last-child) { margin-bottom:35px; }
.history-box .history-list > div > ul > li > dl > dd li h4 { color:#ff7b0f; font-size:20px; font-weight:700; margin:5px 0 14px; }
.history-box .history-list > div > ul > li > dl > dd li p { position:relative; padding-left:13px; color:#111; font-size:18px; font-weight:400; line-height:1.4 }
.history-box .history-list > div > ul > li > dl > dd li p:not(:last-child) { margin-bottom:12px; }
.history-box .history-list > div > ul > li > dl > dd li p:after { content:""; display:block; position:absolute; left:0; top:12px; width:3px; height:3px; border-radius:4px; background:#ff7b0f; }
.history-box .history-list .h-mCont { display:none }
@media screen and (max-width:1280px){
    .history-box .nav-box { max-height:580px; }
    .history-box .nav-box > ul > li dt h3 { font-size:17px; }
    .history-box .nav-box > ul > li.on dt h3 { font-size:55px; }
    .history-box .nav-box > ul > li dd { margin-top:15px; }
    .history-box .nav-box > ul > li dd .txtbox p { font-size:24px; }
    .history-box .nav-box > ul > li dd .imgbox { margin:35px 0; max-width:400px; }
}
@media screen and (max-width:1100px){
    .history-box .nav-box { max-height:620px; }
    .history-box .nav-box > ul > li dt h3 { font-size:16px; }
    .history-box .nav-box > ul > li.on dt h3 { font-size:40px; }
    .history-box .nav-box > ul > li dd { margin-top:15px; }
    .history-box .nav-box > ul > li dd .txtbox p { font-size:24px; }
    .history-box .nav-box > ul > li dd .imgbox { margin:30px 0; max-width:400px; }
    .history-box .history-list > div > ul:not(:last-child) { margin-bottom:40px; }
    .history-box .history-list > div > ul > li { padding-bottom:40px; }
    .history-box .history-list > div > ul > li:not(:last-child) { margin-bottom:40px; }
    .history-box .history-list > div > ul > li > dl > dt { font-size:24px; }
    .history-box .history-list > div > ul > li > dl > dd li:not(:last-child) { margin-bottom:20px; }
    .history-box .history-list > div > ul > li > dl > dd li h4 { font-size:17px; margin:5px 0 14px; }
    .history-box .history-list > div > ul > li > dl > dd li p { font-size:16px; }
    .history-box .history-list > div > ul > li > dl > dd li p:not(:last-child) { margin-bottom:10px; }
}
@media screen and (max-width:960px){
    .history-box { overflow:hidden }
    .history-box .nav-box { display:none }
    .history-box .history-list { width:100%; margin-top:-50px; }
    .history-box .history-list .h-mCont { display:block }
    .history-box .h-mCont { margin-top:50px; }
    .history-box .h-mCont dt h3 { color:#111; font-size:40px; font-weight:700; }
    .history-box .h-mCont dt h3 span { font-weight:700; }
    .history-box .h-mCont dd { margin-top:20px; }
    .history-box .h-mCont dd .txtbox p { color:#111; font-size:20px; font-weight:400; line-height:1.5; }
    .history-box .h-mCont dd .imgbox { margin:20px 0 50px; position:relative; overflow:hidden; max-width:100%; }
    .history-box .h-mCont dd .imgbox:before {content:""; display:block; padding-bottom:45%; }
    .history-box .h-mCont dd .imgbox img { position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover; -o-object-fit:cover; }
}
@media screen and (max-width:640px){
    .history-box .history-list { margin-top:-40px; }
    .history-box .h-mCont { margin-top:40px; }
    .history-box .h-mCont dt h3 { font-size:30px;}
    .history-box .h-mCont dt h3 span { font-weight:700; }
    .history-box .h-mCont dd { margin-top:15px; }
    .history-box .h-mCont dd .txtbox p { font-size:17px; }
    .history-box .h-mCont dd .imgbox { margin:20px 0 40px; }
    .history-box .h-mCont dd .imgbox:before { padding-bottom:50%; }

    .history-box .history-list > div > ul:not(:last-child) { margin-bottom:30px; }
    .history-box .history-list > div > ul > li { padding-bottom:30px; }
    .history-box .history-list > div > ul > li:not(:last-child) { margin-bottom:30px; }
    .history-box .history-list > div > ul > li > dl > dt { font-size:22px; width:80px; }
    .history-box .history-list > div > ul > li > dl > dd { width:calc(100% - 80px))}
    .history-box .history-list > div > ul > li > dl > dd li:not(:last-child) { margin-bottom:20px; }
    .history-box .history-list > div > ul > li > dl > dd li h4 { font-size:16px; margin:5px 0 14px; }
    .history-box .history-list > div > ul > li > dl > dd li p { font-size:15px; }
    .history-box .history-list > div > ul > li > dl > dd li p:not(:last-child) { margin-bottom:10px; }
}

/* animation */
.history-box .nav-box > ul > li dt h3 > span { display:block; overflow:hidden; }
.history-box .nav-box > ul > li.on dt h3 > span span { animation:ani_3 0.5s 0.3s; animation-fill-mode:both; }
.history-box .nav-box > ul > li.on dd .txtbox p { animation:ani_2 0.5s 0.5s; animation-fill-mode:both; }
.history-box .nav-box > ul > li dd .imgbox:after { content:""; display:block; width:100%; height:100%; background:#fff; position:absolute; right:0; top:0; }
.history-box .nav-box > ul > li.on dd .imgbox:after { animation:ani_w 1.0s 0.5s; animation-fill-mode:both; }
@media screen and (max-width:960px){
    .history-box .h-mCont dt h3 > span { display:block; overflow:hidden; }
    .history-box .h-mCont dt h3 > span span,
    .history-box .h-mCont dd .txtbox p{ opacity:0; }
    .history-box .h-mCont.subOn dt h3 > span span { animation:ani_3 0.5s 0.3s; animation-fill-mode:both; }
    .history-box .h-mCont.subOn dd .txtbox p { animation:ani_2 0.5s 0.5s; animation-fill-mode:both; }
    .history-box .h-mCont dd .imgbox:after { content:""; display:block; width:100%; height:100%; background:#fff; position:absolute; right:0; top:0; }
    .history-box .h-mCont.subOn dd .imgbox:after { animation:ani_w 1.0s 0.5s; animation-fill-mode:both; }
}
@media screen and (max-width:640px){
    .history-box .h-mCont dd .imgbox:after { display:none; }
    .history-box .h-mCont dd .imgbox { overflow:hidden }
    .history-box .h-mCont dd .imgbox img { transform:scale(1.15); }
    .history-box .h-mCont.subOn dd .imgbox img { animation:bgs5 0.8s 0.1s; animation-fill-mode:both; }
}

/* friends-box */
.friends-box { overflow:hidden }
.friends-box .img-k { width:165px; }
.friends-box .img-f { width:120px; }
.friends-box .img-m { width:340px; }
.friends-box .img-s { width:174px; }
.friends-box .img-r { width:126px; }
.friends-box .character { position:relative; z-index:5 }
.friends-box .character img { position:relative; z-index:5 }
.friends-box .character:after { content:""; display:block; width:145px; height:40px; background:rgba(0,0,0,0.1); position:absolute; left:50%; bottom:-20px; transform:translateX(-50%); border-radius:100% }
.friends-box .img-f:after { width:104px; height:30px; bottom:-15px; }
.friends-box .img-m:after { width:248px; height:55px; bottom:-27px; }
.friends-box .img-s:after { width:140px; height:42px; bottom:-21px; }
.friends-box .img-r:after { width:120px; height:35px; bottom:-17px; }
.friends-box .character-box { position:relative; margin-top:65px; background-color:#f7f7f7; padding:125px 0; }
.friends-box .character-box > div { position:relative; height:540px; }
.friends-box .character-box > div:before { content:""; display:block; width:100%; height:1px; position:absolute; left:0; bottom:25%; border-top:1px dashed #cbcbcb; }
.friends-box .character-box .bg-line { position:relative; width:100%; height:100%; }
.friends-box .character-box .bg-line:after { content:""; display:block; width:100%; height:1px; position:absolute; left:0; bottom:75%; border-top:1px dashed #cbcbcb; }
.friends-box .character-box .bg-line:before { content:""; display:block; width:100%; height:1px; position:absolute; left:0; bottom:50%; border-top:1px dashed #cbcbcb; }
.friends-box .character-box .listbox { position:relative; width:100%; height:100%; }
.friends-box .character-box .listbox:after { content:""; display:block; width:100%; height:1px; position:absolute; left:0; bottom:100%; border-top:1px dashed #cbcbcb; }
.friends-box .character-box .listbox:before { content:""; display:block; width:100%; height:1px; position:absolute; left:0; bottom:0; border-top:1px dashed #cbcbcb; }
.friends-box .character-box .listbox ul { position:absolute; left:0; bottom:0; width:100%; display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:center; gap:0 120px; }
.friends-box .character-box .listbox li:nth-child(4) { margin:0 -50px; }
.friends-box .character-box .listbox li .img-s { padding-bottom:330px; }
.friends-box .character-box .listbox li { position:relative; }
.friends-box .character-introduce { margin-top:125px; }
.friends-box .character-introduce h4 { text-align:center; color:#111; font-size:50px; font-weight:700; }
.friends-box .character-introduce .listbox > ul > li { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; margin-top:130px; }
.friends-box .character-introduce .listbox > ul > li > div { width:50%; }
.friends-box .character-introduce .listbox > ul > li .imgbox { display:flex; }
.friends-box .character-introduce .listbox > ul > li .imgbox .c-box { width:690px; text-align:center; }
.friends-box .character-introduce .listbox > ul > li .imgbox .c-box > div { margin:0 auto; }
.friends-box .character-introduce .listbox > ul > li .txtbox dt { font-weight:700; font-size:20px; color:#ff7b0f; }
.friends-box .character-introduce .listbox > ul > li .txtbox dt span { font-weight:700; }
.friends-box .character-introduce .listbox > ul > li .txtbox dt strong { font-weight:700; font-size:40px; color:#111; display:block; margin-bottom:13px; }
.friends-box .character-introduce .listbox > ul > li .txtbox dd { margin-top:30px; font-weight:300; font-size:18px; color:#333; line-height:1.8; }
.friends-box .character-introduce .listbox > ul > li:nth-child(2n) { flex-direction:row-reverse; }
.friends-box .character-introduce .listbox > ul > li:nth-child(2n) .imgbox { justify-content:flex-end; }
.friends-box .character-introduce .listbox > ul > li .character:after { background:rgba(0,0,0,0.2); }
.friends-box .character-introduce .listbox > ul > li:nth-child(1) .imgbox .c-box { height:495px; padding-top:47px; background:url(/img/sub/friends_bg_c1.png) center top no-repeat; }
.friends-box .character-introduce .listbox > ul > li:nth-child(2) .imgbox .c-box { height:574px; padding-top:86px; background:url(/img/sub/friends_bg_c2.png) center top no-repeat; }
.friends-box .character-introduce .listbox > ul > li:nth-child(3) .imgbox .c-box { height:603px; padding-top:10px; background:url(/img/sub/friends_bg_c3.png) center top no-repeat; }
.friends-box .character-introduce .listbox > ul > li:nth-child(4) .imgbox .c-box { height:574px; padding-top:212px; background:url(/img/sub/friends_bg_c4.png) center top no-repeat; }
.friends-box .character-introduce .listbox > ul > li:nth-child(5) .imgbox .c-box { height:444px; padding-top:210px; background:url(/img/sub/friends_bg_c5.png) center top no-repeat; }
.friends-box .character-introduce .listbox > ul > li .img-s { padding-bottom:220px; }
.friends-box .character-introduce .listbox > ul > li .img-s:after { width:130px; height:34px; bottom:-17px; }
.friends-box .character-introduce .listbox > ul > li .img-f:after { width:98px; height:25px; bottom:-14px; }
.friends-box .character-introduce .listbox > ul > li .img-m:after { width:240px; height:60px; bottom:-30px; }
.friends-box .character-introduce .listbox > ul > li .img-s:after { width:128px; height:25px; bottom:-14px; }
.friends-box .character-introduce .listbox > ul > li .img-r:after { width:129px; height:33px; bottom:-14px; }
@media screen and (max-width:1600px){
    .friends-box .img-k { width:135px; }
    .friends-box .img-f { width:100px; }
    .friends-box .img-m { width:280px; }
    .friends-box .img-s { width:124px; }
    .friends-box .img-r { width:96px; }
    .friends-box .character-box { margin-top:65px; padding:120px 0; }
    .friends-box .character-box > div { height:446px; }
    .friends-box .character-box .listbox ul { gap:0 90px; }
    .friends-box .character-box .listbox li:nth-child(4) { margin:0 -40px; }
    .friends-box .character-box .listbox li .img-s { padding-bottom:280px; }
    .friends-box .character-introduce .listbox > ul > li .txtbox dd br { display:none }
    .friends-box .character-introduce .listbox > ul > li .txtbox dd .m_br { display:block }
    .friends-box .character-introduce .listbox > ul > li .imgbox .c-box { width:550px; }
    .friends-box .character-introduce .listbox > ul > li .imgbox .c-box { background-size:100% auto !important; }
    .friends-box .character-introduce .listbox > ul > li:nth-child(1) .imgbox .c-box { height:405px; padding-top:35px; }
    .friends-box .character-introduce .listbox > ul > li:nth-child(2) .imgbox .c-box { height:484px; padding-top:76px; }
    .friends-box .character-introduce .listbox > ul > li:nth-child(3) .imgbox .c-box { height:513px; padding-top:5px; }
    .friends-box .character-introduce .listbox > ul > li:nth-child(4) .imgbox .c-box { height:480px; padding-top:170px; }
    .friends-box .character-introduce .listbox > ul > li:nth-child(5) .imgbox .c-box { height:364px; padding-top:160px; }
    .friends-box .character-introduce .listbox > ul > li .img-s { padding-bottom:180px; }
}
@media screen and (max-width:1280px){
    .friends-box .img-k { width:100px; }
    .friends-box .img-f { width:75px; }
    .friends-box .img-m { width:210px; }
    .friends-box .img-s { width:90px; }
    .friends-box .img-r { width:75px; }
    .friends-box .character:after { width:95px; height:30px; bottom:-15px; }
    .friends-box .img-f:after { width:70px; height:25px; bottom:-12px; }
    .friends-box .img-m:after { width:180px; height:48px; bottom:-24px; }
    .friends-box .img-s:after { width:85px; height:30px; bottom:-15px; }
    .friends-box .img-r:after { width:80px; height:28px; bottom:-14px; }
    .friends-box .character-box { margin-top:50px; padding:100px 0; }
    .friends-box .character-box > div { height:326px; }
    .friends-box .character-box .listbox ul { gap:0 70px; }
    .friends-box .character-box .listbox li:nth-child(4) { margin:0 -40px; }
    .friends-box .character-box .listbox li .img-s { padding-bottom:210px; }
    .friends-box .character-introduce .listbox > ul > li .imgbox .c-box { width:440px; }
    .friends-box .character-introduce .listbox > ul > li .imgbox .c-box { background-size:100% auto !important; }
    .friends-box .character-introduce .listbox > ul > li:nth-child(1) .imgbox .c-box { height:300px; padding-top:35px; }
    .friends-box .character-introduce .listbox > ul > li:nth-child(2) .imgbox .c-box { height:384px; padding-top:76px; }
    .friends-box .character-introduce .listbox > ul > li:nth-child(3) .imgbox .c-box { height:413px; padding-top:5px; }
    .friends-box .character-introduce .listbox > ul > li:nth-child(4) .imgbox .c-box { height:370px; padding-top:130px; }
    .friends-box .character-introduce .listbox > ul > li:nth-child(5) .imgbox .c-box { height:290px; padding-top:100px; }
    .friends-box .character-introduce .listbox > ul > li .character:after { width:85px; height:24px; bottom:-12px; }
    .friends-box .character-introduce .listbox > ul > li .img-f:after { width:65px; height:22px; bottom:-11px; }
    .friends-box .character-introduce .listbox > ul > li .img-m:after { width:160px; height:50px; bottom:-25px; }
    .friends-box .character-introduce .listbox > ul > li .img-s:after { width:80px; height:22px; bottom:-11px; }
    .friends-box .character-introduce .listbox > ul > li .img-r:after { width:76px; height:20px; bottom:-10px; }
    .friends-box .character-introduce .listbox > ul > li .img-s { padding-bottom:160px; }
}
@media screen and (max-width:1024px){
    .friends-box .character-box { margin-top:50px; padding:80px 0; }
    .friends-box .character-box > div { height:326px; }
    .friends-box .character-box .listbox ul { gap:0 70px; }
    .friends-box .character-box .listbox li:nth-child(4) { margin:0 -40px; }
    .friends-box .character-box .listbox li .img-s { padding-bottom:210px; }
    .friends-box .character-introduce { margin-top:100px; }
    .friends-box .character-introduce h4 { font-size:34px; }
    .friends-box .character-introduce .listbox > ul > li { margin-top:100px; }
    .friends-box .character-introduce .listbox > ul > li > div { width:100%; }
    .friends-box .character-introduce .listbox > ul > li .imgbox .c-box { margin:0 auto; }
    .friends-box .character-introduce .listbox > ul > li .txtbox { margin-top:60px; }
    .friends-box .character-introduce .listbox > ul > li .txtbox dt { text-align:center; font-size:16px; }
    .friends-box .character-introduce .listbox > ul > li .txtbox dt strong { font-size:34px; margin-bottom:10px; }
    .friends-box .character-introduce .listbox > ul > li .txtbox dd { margin-top:25px; font-size:16px; }
}
@media screen and (max-width:860px){
    .friends-box .character-box > div { height:auto; }
    .friends-box .character-box .listbox ul { position:relative; gap:50px 50px; padding:0 20px; }
    .friends-box .character-box .listbox li:nth-child(4) { margin:0 -30px; }
    .friends-box .character-box > div:before,
    .friends-box .character-box .bg-line:after,
    .friends-box .character-box .bg-line:before,
    .friends-box .character-box .listbox:after,
    .friends-box .character-box .listbox:before { display:none; }
}
@media screen and (max-width:760px){
    .friends-box .character-box .listbox ul { gap:100px 90px; }
    .friends-box .character-box .listbox li .img-s { padding-bottom:50px; }
}
@media screen and (max-width:640px){
    .friends-box .img-k { width:74px; }
    .friends-box .img-f { width:55px; }
    .friends-box .img-m { width:160px; }
    .friends-box .img-s { width:60px; }
    .friends-box .img-r { width:50px; }
    .friends-box .character:after { width:65px; height:24px; bottom:-12px; }
    .friends-box .img-f:after { width:62px; height:20px; bottom:-10px; }
    .friends-box .img-m:after { width:140px; height:40px; bottom:-20px; }
    .friends-box .img-s:after { width:55px; height:20px; bottom:-10px; }
    .friends-box .img-r:after { width:48px; height:18px; bottom:-9px; }
    .friends-box .character-box { margin-top:40px; padding:50px 0; }
    .friends-box .character-box .listbox ul { position:relative; gap:50px 100px; padding:0 60px; }
    .friends-box .character-box .listbox li:nth-child(4) { margin:0 -20px; }
    .friends-box .character-introduce { margin-top:70px; }
    .friends-box .character-introduce h4 { font-size:24px; }
    .friends-box .character-introduce .listbox > ul > li { margin-top:70px; }
    .friends-box .character-introduce .listbox > ul > li > div { width:100%; }
    .friends-box .character-introduce .listbox > ul > li .imgbox .c-box { width:320px; }
    .friends-box .character-introduce .listbox > ul > li .txtbox { margin-top:30px; }
    .friends-box .character-introduce .listbox > ul > li:nth-child(1) .imgbox .c-box { height:240px; padding-top:20px; }
    .friends-box .character-introduce .listbox > ul > li:nth-child(2) .imgbox .c-box { height:280px; padding-top:40px; }
    .friends-box .character-introduce .listbox > ul > li:nth-child(3) .imgbox .c-box { height:310px; padding-top:5px; }
    .friends-box .character-introduce .listbox > ul > li:nth-child(4) .imgbox .c-box { height:280px; padding-top:100px; }
    .friends-box .character-introduce .listbox > ul > li:nth-child(5) .imgbox .c-box { height:220px; padding-top:70px; }
    .friends-box .character-introduce .listbox > ul > li .character:after { width:65px; height:20px; bottom:-10px; }
    .friends-box .character-introduce .listbox > ul > li .img-f:after { width:55px; height:20px; bottom:-10px; }
    .friends-box .character-introduce .listbox > ul > li .img-m:after { width:120px; height:40px; bottom:-20px; }
    .friends-box .character-introduce .listbox > ul > li .img-s:after { width:65px; height:18px; bottom:-9px; }
    .friends-box .character-introduce .listbox > ul > li .img-r:after { width:60px; height:16px; bottom:-8px; }
    .friends-box .character-introduce .listbox > ul > li .img-s { padding-bottom:118px; }
}
@media screen and (max-width:600px){
    .friends-box .character-box .listbox ul { gap:50px 80px; padding:0 60px; }
}
@media screen and (max-width:570px){
    .friends-box .character-box .listbox ul { gap:50px 70px; padding:0 54px; }
}
@media screen and (max-width:520px){
    .friends-box .character-box .listbox ul { gap:50px 80px; padding:0 20px;}
    .friends-box .character-box .listbox li .img-s { padding-bottom:150px; }
}
@media screen and (max-width:480px){
    .friends-box .character-box .listbox ul { gap:50px 60px; }
}
@media screen and (max-width:440px){
    .friends-box .character-box .listbox ul { gap:50px 46px; }
}
@media screen and (max-width:400px){
    .friends-box .character-box .listbox ul { gap:50px 36px; }
}

/* animation */
.friends-box .character-box .listbox li .character,
.friends-box .character-box .listbox li .character:after { opacity:0; }
.friends-box .character-box .listbox.subOn li .img-k { animation:bgs3 .8s 0.3s; animation-fill-mode:both; }
.friends-box .character-box .listbox.subOn li .img-k:after { animation:ani_3_1 0.8s 0.6s; animation-fill-mode:both; }
.friends-box .character-box .listbox.subOn li .img-f { animation:bgs3 .8s 0.5s; animation-fill-mode:both; }
.friends-box .character-box .listbox.subOn li .img-f:after { animation:ani_3_1 0.8s 0.8s; animation-fill-mode:both; }
.friends-box .character-box .listbox.subOn li .img-m { animation:bgs3 .8s 0.7s; animation-fill-mode:both; }
.friends-box .character-box .listbox.subOn li .img-m:after { animation:ani_3_1 0.8s 1.0s; animation-fill-mode:both; }
.friends-box .character-box .listbox.subOn li .img-s { animation:bgs3 .8s 0.9s; animation-fill-mode:both; }
.friends-box .character-box .listbox.subOn li .img-s:after { animation:ani_3_1 0.8s 1.2s; animation-fill-mode:both; }
.friends-box .character-box .listbox.subOn li .img-r { animation:bgs3 .8s 1.1s; animation-fill-mode:both; }
.friends-box .character-box .listbox.subOn li .img-r:after { animation:ani_3_1 0.8s 1.4s; animation-fill-mode:both; }
.friends-box .character-introduce h4 { overflow:hidden }
.friends-box .character-introduce h4 span { opacity:0; display:block; }
.friends-box .character-introduce h4.subOn span { animation:ani_3 .8s 0.5s; animation-fill-mode:both; }
.friends-box .character-introduce .listbox > ul > li .imgbox .character img,
.friends-box .character-introduce .listbox > ul > li .txtbox dt,
.friends-box .character-introduce .listbox > ul > li .txtbox dd { opacity:0; }
.friends-box .character-introduce .listbox > ul > li.subOn .imgbox .character img { animation:ani_4 .8s 0.3s; animation-fill-mode:both; }
.friends-box .character-introduce .listbox > ul > li.subOn dt { animation:ani_2 .8s 0.4s; animation-fill-mode:both; }
.friends-box .character-introduce .listbox > ul > li.subOn dd { animation:ani_2 .8s 0.7s; animation-fill-mode:both; }


/* business-box */
.business-box { overflow:hidden }
.business-box .business-top {}
.business-box .business-top > div { display:flex; flex-wrap:wrap; }
.business-box .business-top > div > div { width:50%; }
.business-box .business-top > div > .txtbox { font-size:18px; color:#333; font-weight:300; line-height:1.8; }
.business-box .product-box { margin-top:155px; padding:150px 0; background-color:#f7f7f7; }
.business-box .product-box > div { display:flex; flex-wrap:wrap; align-items:center; }
.business-box .product-box > div > div { width:50%; }
.business-box .product-box > div > .txtbox dt { font-size:50px; color:#111; font-weight:700; }
.business-box .product-box > div > .txtbox dd { margin-top:40px; font-size:18px; color:#333; font-weight:300; line-height:1.8; }
.business-box .product-box > div > .txtbox dd .btn { margin-top:100px; }
.business-box .product-box > div > .txtbox dd .btn a { display:inline-block; }
.business-box .product-box > div > .txtbox dd .btn a span { padding:0 35px; height:57px; display:flex; align-items:center; background-color:#ff7b0f; border-radius:50px; color:#fff; font-size:15px; font-weight:600; }
.business-box .product-box > div > .imgbox img { max-width:100%; }
@media screen and (max-width:1600px){
    .business-box .business-top > div > .txtbox br { display:none }
    .business-box .business-top > div > .txtbox .m_br { display:block }
    .business-box .product-box > div > .txtbox { padding-right:100px; }
    .business-box .product-box > div > .txtbox br { display:none }
    .business-box .product-box > div > .txtbox .m_br { display:block }
}
@media screen and (max-width:1280px){
    .business-box .business-top > div > .logo.logo-1 img { height:50px; }
    .business-box .business-top > div > .logo.logo-2 img { height:70px; }
    .business-box .business-top > div > .txtbox { font-size:17px; }
    .business-box .product-box { margin-top:130px; padding:130px 0; }
    .business-box .product-box > div > .txtbox dt { font-size:40px; }
    .business-box .product-box > div > .txtbox dd { margin-top:35px; font-size:17px; }
    .business-box .product-box > div > .txtbox dd .btn { margin-top:100px; }
    .business-box .product-box > div > .txtbox dd .btn a span { padding:0 30px; height:52px; font-size:15px; }
}
@media screen and (max-width:1024px){
    .business-box .business-top > div > .logo.logo-1 img { height:45px; }
    .business-box .business-top > div > .logo.logo-2 img { height:60px; }
    .business-box .business-top > div > .txtbox { font-size:16px; }
    .business-box .product-box { margin-top:100px; padding:100px 0; }
    .business-box .product-box > div > .txtbox dt { font-size:34px; }
    .business-box .product-box > div > .txtbox dd { margin-top:30px; font-size:16px; }
    .business-box .product-box > div > .txtbox dd .btn { margin-top:50px; }
    .business-box .product-box > div > .txtbox dd .btn a span { padding:0 25px; height:45px; font-size:15px; }
}
@media screen and (max-width:860px){
    .business-box .business-top > div > .logo { text-align:center; }
    .business-box .business-top > div > div { width:100%; }
    .business-box .business-top > div > .txtbox { margin-top:50px; }
    .business-box .product-box > div { flex-direction:column-reverse; }
    .business-box .product-box > div > div { width:100%; }
    .business-box .product-box > div > .txtbox { margin-top:50px; padding-right:0; }
    .business-box .product-box > div > .txtbox dt { text-align:center }
    .business-box .product-box > div > .txtbox dd .btn { margin-top:50px; text-align:center; }
    .business-box .product-box > div > .txtbox dd .btn a { margin:0 auto; }
}
@media screen and (max-width:640px){
    .business-box .business-top > div > .logo.logo-1 img { height:35px; }
    .business-box .business-top > div > .logo.logo-2 img { height:48px; }
    .business-box .business-top > div > .txtbox { margin-top:40px; }
    .business-box .product-box { margin-top:80px; padding:80px 0; }
    .business-box .product-box > div > .txtbox { margin-top:40px; }
    .business-box .product-box > div > .txtbox dt { font-size:28px; }
    .business-box .product-box > div > .txtbox dd .btn { margin-top:40px; }
}

/* animation */
.business-box .business-top > div > div { opacity:0; }
.business-box .business-top.subOn > div > .logo { animation:ani_2 .8s 0.4s; animation-fill-mode:both; }
.business-box .business-top.subOn > div > .txtbox { animation:ani_1 .8s 0.4s; animation-fill-mode:both; }
.business-box .product-box > div .imgbox { opacity:0; }
.business-box .product-box.subOn > div > .imgbox { animation:bgs4 .8s 0.4s; animation-fill-mode:both; }
.business-box .product-box > div > .txtbox dt,
.business-box .product-box > div > .txtbox dd p,
.business-box .product-box > div > .txtbox dd .btn { opacity:0; }
.business-box .product-box.subOn > div > .txtbox dt { animation:ani_3 .8s 0.4s; animation-fill-mode:both; }
.business-box .product-box.subOn > div > .txtbox dd p { animation:ani_3 .8s 0.6s; animation-fill-mode:both; }
.business-box .product-box.subOn > div > .txtbox dd .btn { animation:ani_5 .8s 1.0s; animation-fill-mode:both; }



/* esg-box */
.esg-box { overflow:hidden }
.esg-box h4.stit { font-size:50px; color:#111; font-weight:700; letter-spacing:-0.02em; }
.esg-box h4.stit span { font-weight:700; }
.esg-box .title-box { text-align:center; margin-top:125px; }
.esg-box .title-box h3 { font-size:60px; color:#111; font-weight:700; letter-spacing:-0.02em; line-height:1.3 }
.esg-box .title-box h3 span { font-weight:700; }
.esg-box .title-box p.stxt { margin-top:30px; font-size:18px; color:#333; font-weight:300; line-height:1.8;  }
.esg-box .title-box dd { margin-top:35px; font-size:20px; color:#333; font-weight:300; line-height:1.8; }
.esg-box .title-box dd .btn { margin-top:50px; }
.esg-box .btn a { display:inline-block; }
.esg-box .btn a span { padding:0 35px; height:57px; display:flex; align-items:center; justify-content:center; background-color:#ff7b0f; border-radius:50px; color:#fff; font-size:15px; font-weight:600; }
.esg-box .btn a span img { display:inline-block; vertical-align:middle; margin-left:5px; }
.esg-box .top-listbox { margin-top:100px; overflow:hidden }
.esg-box .top-listbox > ul { display:flex; flex-wrap:wrap; justify-content:center; gap:0 9%; }
.esg-box .top-listbox > ul > li { width:calc((100% - 18%) / 3); text-align:center; position:relative; }
.esg-box .top-listbox > ul > li .box { position:relative; width:100%; }
.esg-box .top-listbox > ul > li .box:before { content:""; display:block; padding-bottom:100%; }
.esg-box .top-listbox > ul > li .box:after { content:""; display:block; position:absolute; top:50%; left:-50%; width:100%; height:1px; border-top:1px dashed #d6d6d6; }
.esg-box .top-listbox > ul > li:first-child .box:after { display:none; }
.esg-box .top-listbox > ul > li .box .circle-box { position:absolute; left:0; top:0; z-index:3; width:100%; height:100%; border:54px solid #fff2e7; border-radius:100%; }
.esg-box .top-listbox > ul > li .box .circle-box:before { content:""; display:block; position:absolute; top:50%; left:-59px; transform:translateY(-50%); width:11px; height:11px; background-color:#ff7b0f; border-radius:100%; }
.esg-box .top-listbox > ul > li .box .circle-box:after { content:""; display:block; position:absolute; top:50%; right:-59px; transform:translateY(-50%); width:11px; height:11px; background-color:#ff7b0f; border-radius:100%; }
.esg-box .top-listbox > ul > li:first-child .box .circle-box:before { display:none }
.esg-box .top-listbox > ul > li:last-child .box .circle-box:after { display:none }
.esg-box .top-listbox > ul > li .box .circle-box .circle { position:relative; display:flex; align-items:center; justify-content:center; box-shadow:0 0 20px rgba(255, 123, 15, .5); width:100%; height:100%; border-radius:100%; background:#fff }
.esg-box .top-listbox > ul > li .box .circle-box .circle dt { min-height:110px; }
.esg-box .top-listbox > ul > li .box .circle-box .circle dd { font-size:25px; color:#111; font-weight:700; }
.esg-box .top-listbox > ul > li .box .circle-box .circle dd strong { font-size:25px; color:#ff7b0f; }
.esg-box .top-listbox > ul > li .txtbox { margin-top:50px; }
.esg-box .top-listbox > ul > li .txtbox p { font-size:18px; color:#333; font-weight:300; line-height:1.6; }
.esg-box .certification-box { margin-top:150px; padding:150px 0; background-color:#f7f7f7 }
.esg-box .certification-box .title-box { margin-top:0; }
.esg-box .certification-box .certification_top { margin-top:50px; }
.esg-box .certification-box .certification_top > ul > li:not(:last-child) { margin-bottom:50px; }
.esg-box .certification-box .certification_top > ul > li { display:flex; flex-wrap:wrap; align-items:center; }
.esg-box .certification-box .certification_top > ul > li > div { width:50%; }
.esg-box .certification-box .certification_top > ul > li .imgbox { display:flex; align-items:center; justify-content:center; padding:95px 0; background-color:#fff; border:1px solid #d6d6d6; }
.esg-box .certification-box .certification_top > ul > li .txtbox { padding-left:140px; }
.esg-box .certification-box .certification_top > ul > li .txtbox .stxt { color:#ff7b0f; font-weight:600; font-size:20px; }
.esg-box .certification-box .certification_top > ul > li .txtbox dt { margin-top:25px; }
.esg-box .certification-box .certification_top > ul > li .txtbox dd { margin-top:40px; font-size:18px; font-weight:300; color:#555; line-height:1.6; }
.esg-box .certification-box .certification_list { margin-top:130px; }
.esg-box .certification-box .certification_list .dataTable { margin-top:50px; }
.esg-box .certification-box .certification_list .dataTable table { width:100%; border-top:1px solid #ff7b0f; }
.esg-box .certification-box .certification_list .dataTable thead th { text-align:center; color:#111; font-weight:600; font-size:20px; border:1px solid #e7e7e7; border-width:0 0 1px 1px; height:90px; }
.esg-box .certification-box .certification_list .dataTable thead th:first-child { border-left:none }
.esg-box .certification-box .certification_list .dataTable tbody th { text-align:center; color:#111; font-weight:600; font-size:20px; border-bottom:1px solid #e7e7e7; height:70px; }
.esg-box .certification-box .certification_list .dataTable tbody td { text-align:center; color:#333; font-weight:300; font-size:18px; line-height:1.4; padding:22px 5px; border:1px solid #e7e7e7; border-width:0 0 1px 1px; }
.esg-box .esg-system { margin-top:150px; }
.esg-box .esg-system .title-box { margin-top:0; }
.esg-box .esg-system .system-top { margin-top:90px; background:url(/img/sub/system_top_bg.png) center 30px no-repeat; }
.esg-box .esg-system .system-top > dl { text-align:center; }
.esg-box .esg-system .system-top > dl > dt { display:inline-block; }
.esg-box .esg-system .system-top > dl > dt strong { display:flex; align-items:center; justify-content:center; padding:0 65px; height:97px; background-color:#ff7b0f; margin:0 auto; color:#fff; font-weight:700; font-size:32px; border-radius:90px; }
.esg-box .esg-system .system-top > dl > dd { margin-top:95px; }
.esg-box .esg-system .system-top > dl > dd ul { display:flex; flex-wrap:wrap; justify-content:center; gap:0 25px; padding:0 65px; }
.esg-box .esg-system .system-top > dl > dd ul li { width:calc((100% - 75px) / 4); position:relative; }
.esg-box .esg-system .system-top > dl > dd ul li:before { content:""; display:block; padding-bottom:100%; }
.esg-box .esg-system .system-top > dl > dd ul li:after { content:""; display:block; position:absolute; top:50%; left:-17px; transform:translateY(-50%); width:11px; height:11px; background:url(/img/sub/system_plus_icon.png) center center no-repeat;}
.esg-box .esg-system .system-top > dl > dd ul li:first-child:after { display:none; }
.esg-box .esg-system .system-top > dl > dd ul li .circle-box { position:absolute; left:0; top:0; z-index:3; width:100%; height:100%; border-radius:100%; display:flex; align-items:center; justify-content:center; box-shadow:0 0 10px rgba(255, 123, 15, .5); }
.esg-box .esg-system .system-top > dl > dd ul li .circle-box dt { min-height:70px; display:flex; align-items:center; justify-content:center; }
.esg-box .esg-system .system-top > dl > dd ul li .circle-box dd { margin-top:30px; font-size:22px; color:#111; font-weight:700; letter-spacing:-0.02em; }
.esg-box .esg-system .listbox { margin-top:180px; }
.esg-box .esg-system .listbox h4.stit { text-align:center; }
.esg-box .esg-system .listbox > ul { padding-top:90px; }
.esg-box .esg-system .listbox > ul > li:not(:last-child) { margin-bottom:20px; }
.esg-box .esg-system .listbox > ul > li { display:flex; align-items:center; flex-wrap:wrap; }
.esg-box .esg-system .listbox > ul > li > div { width:50% }
.esg-box .esg-system .listbox > ul > li .imgbox { position:relative; overflow:hidden; }
.esg-box .esg-system .listbox > ul > li .imgbox:before {content:""; display:block; padding-bottom:56.3%; }
.esg-box .esg-system .listbox > ul > li .imgbox img { position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover; -o-object-fit:cover; }
.esg-box .esg-system .listbox > ul > li .txtbox { padding-left:140px; }
.esg-box .esg-system .listbox > ul > li .txtbox dt { font-size:45px; color:#111; font-weight:700; letter-spacing:-0.02em; }
.esg-box .esg-system .listbox > ul > li .txtbox dd { margin-top:40px; font-size:18px; color:#333; font-weight:300; letter-spacing:-0.02em; line-height:1.6; padding-right:20px; }
.esg-box .esg-system .listbox > ul > li:nth-child(2n) { flex-direction:row-reverse; }
.esg-box .esg-system .listbox > ul > li:nth-child(2n) .txtbox { padding-left:65px; }
.esg-box .esg-system .listbox .btn { margin-top:60px; }
.esg-box .esg-system .listbox .btn a { display:inline-block; }
.esg-box .esg-system .listbox .btn a span { padding:0 35px; height:57px; display:flex; align-items:center; background-color:#ff7b0f; border-radius:50px; color:#fff; font-size:15px; font-weight:600; }
.esg-box .esg-system .listbox .btn a span img { display:inline-block; vertical-align:middle; margin-left:5px; }
.esg-box .esg-initiative {  margin-top:200px; padding:180px 0; background-color:#f7f7f7 }
.esg-box .esg-initiative .title-box { margin-top:0; }
.esg-box .esg-initiative .listbox { margin-top:85px; }
.esg-box .esg-initiative .listbox > ul { display:flex; flex-wrap:wrap; gap:15px;}
.esg-box .esg-initiative .listbox > ul > li { width:calc((100% - 45px) / 4); text-align:center; }
.esg-box .esg-initiative .listbox > ul > li .icon img { max-width:100%; }
.esg-box .esg-initiative .listbox > ul > li .txtbox { margin-top:55px; color:#333; font-weight:300; font-size:18px; line-height:1.8; }
.esg-box .esg-initiative .listbox > ul > li .txtbox strong { display:block; font-weight:700; font-size:25px; }
@media screen and (max-width:1600px){
    .esg-box .top-listbox > ul > li .txtbox p br { display:none }
    .esg-box .top-listbox > ul { gap:0 6%; }
    .esg-box .top-listbox > ul > li { width:calc((100% - 12%) / 3); }
    .esg-box .top-listbox > ul > li .box .circle-box { border:40px solid #fff2e7; }
    .esg-box .top-listbox > ul > li .box .circle-box:before { left:-44px; }
    .esg-box .top-listbox > ul > li .box .circle-box:after { right:-44px; }
    .esg-box .certification-box .certification_top > ul > li .txtbox { padding-left:80px; }
    .esg-box .esg-system .listbox > ul > li .txtbox { padding-left:90px; }
    .esg-box .esg-system .listbox > ul > li:nth-child(2n) .txtbox { padding-left:50px; }
    .esg-box .esg-system .listbox > ul > li .txtbox dd br { display:none }
}
@media screen and (max-width:1280px){
    .esg-box h4.stit { font-size:40px; }
    .esg-box .title-box h3 { font-size:50px; }
    .esg-box .title-box p.stxt { margin-top:25px; font-size:17px; }
    .esg-box .title-box dd { margin-top:30px; font-size:18px; }
    .esg-box .title-box dd p br { display:none }
    .esg-box .title-box dd .btn { margin-top:45px; }
    .esg-box .btn a span { padding:0 30px; height:52px; font-size:15px; }
    .esg-box .top-listbox > ul { gap:0 4%; }
    .esg-box .top-listbox > ul > li { width:calc((100% - 8%) / 3); }
    .esg-box .top-listbox > ul > li .box .circle-box { border:30px solid #fff2e7; }
    .esg-box .top-listbox > ul > li .box .circle-box:before { left:-34px; }
    .esg-box .top-listbox > ul > li .box .circle-box:after { right:-34px; }
    .esg-box .top-listbox > ul > li .box .circle-box .circle dt { min-height:95px; }
    .esg-box .top-listbox > ul > li .box .circle-box .circle dd,
    .esg-box .top-listbox > ul > li .box .circle-box .circle dd strong { font-size:22px; }
    .esg-box .top-listbox > ul > li .txtbox { margin-top:40px; }
    .esg-box .top-listbox > ul > li .txtbox p { font-size:17px; }
    .esg-box .certification-box { margin-top:150px; padding:150px 0; }
    .esg-box .certification-box .certification_top { margin-top:50px; }
    .esg-box .certification-box .certification_top > ul > li:not(:last-child) { margin-bottom:50px; }
    .esg-box .certification-box .certification_top > ul > li .imgbox { padding:70px 0; }
    .esg-box .certification-box .certification_top > ul > li .txtbox { padding-left:60px; }
    .esg-box .certification-box .certification_top > ul > li .txtbox .stxt { font-size:18px; }
    .esg-box .certification-box .certification_top > ul > li .txtbox dt { margin-top:20px; }
    .esg-box .certification-box .certification_top > ul > li .txtbox dd { margin-top:30px; font-size:17px; }
    .esg-box .certification-box .certification_list { margin-top:130px; }
    .esg-box .certification-box .certification_list .dataTable { margin-top:50px; }
    .esg-box .certification-box .certification_list .dataTable thead th { font-size:19px; height:85px; }
    .esg-box .certification-box .certification_list .dataTable tbody th { font-size:20px; height:65px; }
    .esg-box .certification-box .certification_list .dataTable tbody td { font-size:18px; padding:20px 5px;}
    .esg-box .esg-system { margin-top:150px; }
    .esg-box .esg-system .system-top { margin-top:90px; }
    .esg-box .esg-system .system-top > dl > dt strong { padding:0 50px; height:80px; font-size:28px; }
    .esg-box .esg-system .system-top > dl > dd { margin-top:95px; }
    .esg-box .esg-system .system-top > dl > dd ul { gap:0 25px; padding:0 20px; }
    .esg-box .esg-system .system-top > dl > dd ul li { width:calc((100% - 75px) / 4); }
    .esg-box .esg-system .system-top > dl > dd ul li .circle-box dt { min-height:65px; }
    .esg-box .esg-system .system-top > dl > dd ul li .circle-box dd { margin-top:25px; font-size:20px; }
    .esg-box .esg-system .listbox { margin-top:180px; }
    .esg-box .esg-system .listbox > ul { padding-top:90px; }
    .esg-box .esg-system .listbox > ul > li:not(:last-child) { margin-bottom:20px; }
    .esg-box .esg-system .listbox > ul > li .txtbox { padding-left:70px; }
    .esg-box .esg-system .listbox > ul > li .txtbox dt { font-size:32px; }
    .esg-box .esg-system .listbox > ul > li .txtbox dd { margin-top:40px; font-size:17px; }
    .esg-box .esg-system .listbox > ul > li:nth-child(2n) .txtbox { padding-left:30px; }
    .esg-box .esg-system .listbox .btn { margin-top:40px; }
    .esg-box .esg-initiative {  margin-top:200px; padding:180px 0; }
    .esg-box .esg-initiative .listbox { margin-top:85px; }
    .esg-box .esg-initiative .listbox > ul { gap:10px;}
    .esg-box .esg-initiative .listbox > ul > li { width:calc((100% - 30px) / 4); }
    .esg-box .esg-initiative .listbox > ul > li .txtbox { margin-top:40px; font-size:17px; }
    .esg-box .esg-initiative .listbox > ul > li .txtbox strong { font-size:23px; }
}
@media screen and (max-width:1024px){
    .esg-box h4.stit { font-size:28px; }
    .esg-box .title-box { margin-top:90px; }
    .esg-box .title-box h3 { font-size:32px; }
    .esg-box .title-box p.stxt { margin-top:20px; font-size:16px; }
    .esg-box .title-box dd { margin-top:20px; font-size:16px; }
    .esg-box .title-box dd .btn { margin-top:35px; }
    .esg-box .btn a span { padding:0 25px; height:45px; }
    .esg-box .top-listbox { margin-top:80px; }
    .esg-box .top-listbox > ul { gap:50px; padding:0 40px; }
    .esg-box .top-listbox > ul > li { width:calc((100% - 50px) / 2); }
    .esg-box .top-listbox > ul > li .box:after { display:none; }
    .esg-box .top-listbox > ul > li .box .circle-box { border:30px solid #fff2e7; }
    .esg-box .top-listbox > ul > li .box .circle-box:before,
    .esg-box .top-listbox > ul > li .box .circle-box:after { display:none }
    .esg-box .top-listbox > ul > li .box .circle-box .circle dt { min-height:90px; }
    .esg-box .top-listbox > ul > li .box .circle-box .circle dd,
    .esg-box .top-listbox > ul > li .box .circle-box .circle dd strong { font-size:20px; }
    .esg-box .top-listbox > ul > li .txtbox { margin-top:35px; }
    .esg-box .top-listbox > ul > li .txtbox p { font-size:16px; }
    .esg-box .certification-box { margin-top:100px; padding:100px 0; }
    .esg-box .certification-box .certification_top { margin-top:40px; }
    .esg-box .certification-box .certification_top > ul > li:not(:last-child) { margin-bottom:40px; }
    .esg-box .certification-box .certification_top > ul > li > div { width:100%; }
    .esg-box .certification-box .certification_top > ul > li .imgbox { padding:50px 0; }
    .esg-box .certification-box .certification_top > ul > li .txtbox { padding-left:0; margin-top:50px; text-align:center; }
    .esg-box .certification-box .certification_top > ul > li .txtbox .stxt { font-size:17px; }
    .esg-box .certification-box .certification_top > ul > li .txtbox dt { margin-top:15px; }
    .esg-box .certification-box .certification_top > ul > li .txtbox dd { margin-top:25px; font-size:16px; }
    .esg-box .certification-box .certification_top > ul > li .txtbox dd br { display:none }
    .esg-box .certification-box .certification_list { margin-top:100px; }
    .esg-box .certification-box .certification_list .dataTable { margin-top:40px; }
    .esg-box .certification-box .certification_list .dataTable thead th { font-size:18px; height:80px; }
    .esg-box .certification-box .certification_list .dataTable tbody th { font-size:18px; height:60px; }
    .esg-box .certification-box .certification_list .dataTable tbody td { font-size:16px; padding:17px 5px;}
    .esg-box .certification-box .certification_list .dataTable .w1 { width:120px !important }
    .esg-box .esg-system { margin-top:100px; }
    .esg-box .esg-system .system-top { margin-top:70px; }
    .esg-box .esg-system .system-top > dl > dt strong { padding:0 40px; height:70px; font-size:22px; }
    .esg-box .esg-system .system-top > dl > dd { margin-top:70px; }
    .esg-box .esg-system .system-top > dl > dd ul { gap:25px 25px; padding:0 80px; }
    .esg-box .esg-system .system-top > dl > dd ul li { width:calc((100% - 50px) / 2); }
    .esg-box .esg-system .system-top > dl > dd ul li .circle-box dt { min-height:65px; }
    .esg-box .esg-system .system-top > dl > dd ul li .circle-box dd { margin-top:25px; font-size:20px; }
    .esg-box .esg-system .system-top > dl > dd ul li:nth-child(3):after { left:50%; top:-17px; transform:translate(-50%, 0); }
    .esg-box .esg-system .system-top > dl > dd ul li:nth-child(4) .circle-box:after { content:""; display:block; position:absolute; top:-17px; left:50%; transform:translateX(-50%); width:11px; height:11px; background:url(/img/sub/system_plus_icon.png) center center no-repeat;}
    .esg-box .esg-system .listbox { margin-top:100px; }
    .esg-box .esg-system .listbox > ul { padding-top:90px; }
    .esg-box .esg-system .listbox > ul > li:not(:last-child) { margin-bottom:50px; }
    .esg-box .esg-system .listbox > ul > li > div { width:100%; }
    .esg-box .esg-system .listbox > ul > li .txtbox { padding-left:0; margin-top:30px; text-align:center }
    .esg-box .esg-system .listbox > ul > li .txtbox dt { font-size:26px; }
    .esg-box .esg-system .listbox > ul > li .txtbox dd { margin-top:20px; font-size:16px; }
    .esg-box .esg-system .listbox > ul > li:nth-child(2n) .txtbox { padding-left:0; }
    .esg-box .esg-system .listbox > ul > li:nth-child(2n) { flex-direction:row; }
    .esg-box .esg-system .listbox .btn { margin-top:30px; }
    .esg-box .esg-initiative {  margin-top:100px; padding:100px 0; }
    .esg-box .esg-initiative .listbox { margin-top:50px; }
    .esg-box .esg-initiative .listbox > ul { gap:50px 10px;}
    .esg-box .esg-initiative .listbox > ul > li { width:calc((100% - 10px) / 2); }
    .esg-box .esg-initiative .listbox > ul > li .txtbox { margin-top:20px; font-size:16px; }
    .esg-box .esg-initiative .listbox > ul > li .txtbox strong { font-size:20px; }
}
@media screen and (max-width:860px){
    .esg-box .top-listbox > ul { padding:0 20px; }
    .esg-box .esg-system .system-top > dl > dd ul { padding:0 50px; }
}
@media screen and (max-width:640px){
    .esg-box h4.stit { font-size:22px; }
    .esg-box .title-box { margin-top:50px; }
    .esg-box .title-box h3 { font-size:26px; }
    .esg-box .title-box p.stxt { margin-top:15px; font-size:15px; }
    .esg-box .title-box dd { margin-top:15px; font-size:15px; }
    .esg-box .title-box dd .btn { margin-top:30px; }
    .esg-box .btn a span { padding:0 25px; height:45px; }
    .esg-box .top-listbox { margin-top:60px; }
    .esg-box .top-listbox > ul { gap:50px 0; padding:0; }
    .esg-box .top-listbox > ul > li { width:100%; }
    .esg-box .top-listbox > ul > li .box { margin:0 auto; max-width:280px; }
    .esg-box .top-listbox > ul > li .box .circle-box { border:25px solid #fff2e7; }
    .esg-box .top-listbox > ul > li .box .circle-box .circle dt { min-height:75px; }
    .esg-box .top-listbox > ul > li .box .circle-box .circle dt img { width:55px; }
    .esg-box .top-listbox > ul > li .box .circle-box .circle dd,
    .esg-box .top-listbox > ul > li .box .circle-box .circle dd strong { font-size:18px; }
    .esg-box .top-listbox > ul > li .txtbox { margin-top:20px; }
    .esg-box .top-listbox > ul > li .txtbox p { font-size:16px; }
    .esg-box .certification-box { margin-top:80px; padding:80px 0; }
    .esg-box .certification-box .certification_top { margin-top:30px; }
    .esg-box .certification-box .certification_top > ul > li:not(:last-child) { margin-bottom:40px; }
    .esg-box .certification-box .certification_top > ul > li > div { width:100%; }
    .esg-box .certification-box .certification_top > ul > li .imgbox { padding:50px 60px; }
    .esg-box .certification-box .certification_top > ul > li .imgbox img { max-width:100%; }
    .esg-box .certification-box .certification_top > ul > li .txtbox { margin-top:40px; }
    .esg-box .certification-box .certification_top > ul > li .txtbox .stxt { font-size:16px; }
    .esg-box .certification-box .certification_top > ul > li .txtbox dt { margin-top:15px; }
    .esg-box .certification-box .certification_top > ul > li .txtbox dd { margin-top:25px; font-size:16px; }
    .esg-box .certification-box .certification_list { margin-top:80px; }
    .esg-box .certification-box .certification_list .dataTable { margin-top:30px; }
    .esg-box .certification-box .certification_list .dataTable thead th { font-size:17px; height:65px; }
    .esg-box .certification-box .certification_list .dataTable tbody th { font-size:17px; height:55px; }
    .esg-box .certification-box .certification_list .dataTable tbody td { font-size:15px; padding:12px 5px;}
    .esg-box .certification-box .certification_list .dataTable .w1 { width:100px !important }
    .esg-box .esg-system { margin-top:80px; }
    .esg-box .esg-system .system-top { margin-top:50px; }
    .esg-box .esg-system .system-top > dl > dt strong { padding:0 40px; height:70px; font-size:22px; }
    .esg-box .esg-system .system-top > dl > dd { margin-top:50px; }
    .esg-box .esg-system .system-top > dl > dd ul { padding:0 0; }
    .esg-box .esg-system .system-top > dl > dd ul li { width:calc((100% - 50px) / 2); }
    .esg-box .esg-system .system-top > dl > dd ul li .circle-box dd { margin-top:20px; font-size:18px; }
    .esg-box .esg-system .listbox { margin-top:80px; }
    .esg-box .esg-system .listbox > ul { padding-top:70px; }
    .esg-box .esg-system .listbox > ul > li:not(:last-child) { margin-bottom:50px; }
    .esg-box .esg-system .listbox > ul > li > div { width:100%; }
    .esg-box .esg-system .listbox > ul > li .txtbox { margin-top:30px; }
    .esg-box .esg-system .listbox > ul > li .txtbox dt { font-size:20px; }
    .esg-box .esg-system .listbox > ul > li .txtbox dd { margin-top:20px; font-size:16px; }
    .esg-box .esg-system .listbox > ul > li:nth-child(2n) .txtbox { padding-left:0; }
    .esg-box .esg-system .listbox .btn { margin-top:30px; }
    .esg-box .esg-initiative { margin-top:80px; padding:80px 0; }
    .esg-box .esg-initiative .listbox { margin-top:40px; }
    .esg-box .esg-initiative .listbox > ul { gap:50px 10px;}
    .esg-box .esg-initiative .listbox > ul > li .txtbox { margin-top:15px; font-size:15px; }
    .esg-box .esg-initiative .listbox > ul > li .txtbox strong { font-size:18px; }
}

/* animation */
.esg-box .title-box h3 { overflow:hidden }
.esg-box .title-box h3 span { display:block; opacity:0; }
.esg-box .title-box.subOn h3 span { animation:ani_3 .8s 0.4s; animation-fill-mode:both; }
.esg-box .title-box dd  { opacity:0; }
.esg-box .title-box.subOn dd { animation:ani_4 .8s 0.7s; animation-fill-mode:both; }
.esg-box .top-listbox > ul > li { opacity:0; }
.esg-box .top-listbox.subOn > ul > li:nth-child(1) { animation:ani_2 .8s 0.3s; animation-fill-mode:both; z-index:3 }
.esg-box .top-listbox.subOn > ul > li:nth-child(2) { animation:ani_5 .8s 0.3s; animation-fill-mode:both; z-index:2 }
.esg-box .top-listbox.subOn > ul > li:nth-child(3) { animation:ani_1 .8s 0.3s; animation-fill-mode:both; }
.esg-box .certification-box .certification_top > ul > li > div { opacity:0; }
.esg-box .certification-box .certification_top.subOn > ul > li > .imgbox { animation:bgs3 .8s 0.3s; animation-fill-mode:both; }
.esg-box .certification-box .certification_top.subOn > ul > li > .txtbox { animation:ani_2 .8s 0.3s; animation-fill-mode:both; }
.esg-box .certification-box .certification_list h4.stit { overflow:hidden }
.esg-box .certification-box .certification_list h4.stit span { display:block; opacity:0; }
.esg-box .certification-box .certification_list .dataTable { opacity:0; }
.esg-box .certification-box .certification_list.subOn h4.stit span { animation:ani_3 .8s 0.4s; animation-fill-mode:both; }
.esg-box .certification-box .certification_list.subOn .dataTable { animation:ani_4 .8s 0.5s; animation-fill-mode:both; }
.esg-box .esg-system .system-top > dl > dd ul li { opacity:0; }
.esg-box .esg-system .system-top.subOn > dl > dd ul li:nth-child(1) { animation:ani_2.8s 0.2s; animation-fill-mode:both; }
.esg-box .esg-system .system-top.subOn > dl > dd ul li:nth-child(2) { animation:ani_2.8s 0.5s; animation-fill-mode:both; }
.esg-box .esg-system .system-top.subOn > dl > dd ul li:nth-child(3) { animation:ani_2.8s 0.8s; animation-fill-mode:both; }
.esg-box .esg-system .system-top.subOn > dl > dd ul li:nth-child(4) { animation:ani_2.8s 1.1s; animation-fill-mode:both; }
.esg-box .esg-system .listbox > ul > li > div { opacity:0; }
.esg-box .esg-system .listbox > ul > li.subOn > .imgbox { animation:bgs3 .8s 0.3s; animation-fill-mode:both; }
.esg-box .esg-system .listbox > ul > li.subOn > .txtbox { animation:ani_2 .8s 0.3s; animation-fill-mode:both; }
.esg-box .esg-system .listbox > ul > li:nth-child(2n).subOn > .txtbox { animation:ani_1 .8s 0.3s; animation-fill-mode:both; }
.esg-box .esg-initiative .title-box p.stxt { opacity:0; }
.esg-box .esg-initiative .title-box.subOn p.stxt { animation:ani_5 .8s 0.7s; animation-fill-mode:both; }
.esg-box .esg-initiative .listbox > ul > li { opacity:0; }
.esg-box .esg-initiative .listbox.subOn  > ul > li:nth-child(1) { animation:ani_3.8s 0.2s; animation-fill-mode:both; }
.esg-box .esg-initiative .listbox.subOn  > ul > li:nth-child(2) { animation:ani_3.8s 0.4s; animation-fill-mode:both; }
.esg-box .esg-initiative .listbox.subOn  > ul > li:nth-child(3) { animation:ani_3.8s 0.6s; animation-fill-mode:both; }
.esg-box .esg-initiative .listbox.subOn  > ul > li:nth-child(4) { animation:ani_3.8s 0.8s; animation-fill-mode:both; }
.esg-box .esg-initiative .listbox.subOn  > ul > li:nth-child(5) { animation:ani_3.8s 1.0s; animation-fill-mode:both; }
.esg-box .esg-initiative .listbox.subOn  > ul > li:nth-child(6) { animation:ani_3.8s 1.2s; animation-fill-mode:both; }
.esg-box .esg-initiative .listbox.subOn  > ul > li:nth-child(7) { animation:ani_3.8s 1.4s; animation-fill-mode:both; }
.esg-box .esg-initiative .listbox.subOn  > ul > li:nth-child(8) { animation:ani_3.8s 1.6s; animation-fill-mode:both; }

/* ethical-box */
.esg-box.ethical-box .title-box { margin-top:0; }
.esg-box.ethical-box .ethical-cont { position:relative; margin-top:120px; display:flex; flex-wrap:wrap; justify-content:center; overflow:hidden; }
.esg-box.ethical-box .ethical-cont dt { position:relative;  display:flex; justify-content:center; align-items:center; }
.esg-box.ethical-box .ethical-cont dt .p-line { padding:30px; border-radius:50%; border:1px dashed #d6d6d6; }
.esg-box.ethical-box .ethical-cont dt:before { content:""; display:block; position:absolute; top:50%; left:50%; transform:translate(-50%, 0); width:742px; height:371px; border:1px dashed #d6d6d6; border-radius:0 0 371px 371px; }
.esg-box.ethical-box .ethical-cont dt:after { content:""; display:block; position:absolute; top:calc(50% - 1px); left:50%; transform:translate(-50%, 0); width:742px; height:3px; background-color:#fff; }
.esg-box.ethical-box .ethical-cont dt .box { position:relative; z-index:1; width:357px; height:357px; border:25px solid #ff7b0f; display:flex; flex-wrap:wrap; justify-content:center; border-radius:50%; background-color:#fff }
.esg-box.ethical-box .ethical-cont dt .box svg { width:192px; }
.esg-box.ethical-box .ethical-cont dt .box svg .logo-2 { fill:#000; }
.esg-box.ethical-box .ethical-cont dd .circle { position:relative; background-color:#fff; display:flex; justify-content:center; align-items:center; width:210px; height:210px; margin:0 auto; box-shadow:0 0 10px rgba(255, 123, 15, .5); border:1px solid #ff7b0f; border-radius:50%; }
.esg-box.ethical-box .ethical-cont dd .circle:before { content:""; display:block; position:absolute; top:50%; left:-8px; margin-top:2px; transform:translateY(-50%); width:11px; height:11px; border:2px solid #fff; background-color:#ff7b0f; border-radius:100%; }
.esg-box.ethical-box .ethical-cont dd .circle:after { content:""; display:block; position:absolute; top:50%; right:-8px; margin-top:2px; transform:translateY(-50%); width:11px; height:11px; border:2px solid #fff; background-color:#ff7b0f; border-radius:100%; }
.esg-box.ethical-box .ethical-cont dd .txtbox { margin-top:22px; text-align:center; font-size:20px; color:#333; font-weight:700; letter-spacing:-0.02em; line-height:1.6; min-width:158px; }
.esg-box.ethical-box .ethical-cont dd .txtbox strong { color:#ff7b0f; }
.esg-box.ethical-box .ethical-cont dd li { position:relative; z-index:3; }
.esg-box.ethical-box .ethical-cont dd li:nth-child(1) { position:absolute; right:50%; top:100px; margin-right:280px; }
.esg-box.ethical-box .ethical-cont dd li:nth-child(2) { margin-top:40px; }
.esg-box.ethical-box .ethical-cont dd li:nth-child(3) { position:absolute; left:50%; top:100px; margin-left:280px; }
.esg-box.ethical-box .ethical-cont dd li:nth-child(1) .circle:after,
.esg-box.ethical-box .ethical-cont dd li:nth-child(3) .circle:after { display:none }
.esg-box.ethical-box .ethical-cont dd li:nth-child(1) .circle:before { left:50%; top:unset; bottom:-4px; margin:0 0 0 26px; transform:translate(-50%, 0);}
.esg-box.ethical-box .ethical-cont dd li:nth-child(3) .circle:before { left:50%; top:unset; bottom:-4px; margin:0 0 0 -26px; transform:translate(-50%, 0);}
.esg-box.ethical-box .ethical-cont dd li:nth-child(1) .txtbox { position:absolute; right:210px; top:50%; transform:translateY(-50%); margin-top:0; }
.esg-box.ethical-box .ethical-cont dd li:nth-child(3) .txtbox { position:absolute; left:210px; top:50%; transform:translateY(-50%); margin-top:0; }
.esg-box.ethical-box .listbox { margin-top:100px; border-top:1px solid #e6e6e6; }
.esg-box.ethical-box .listbox li { display:flex; flex-wrap:wrap; align-items:center; border-bottom:1px solid #e6e6e6; } 
.esg-box.ethical-box .listbox li .icon { width:250px; text-align:center; }
.esg-box.ethical-box .listbox li dl { width:calc(100% - 250px); padding:55px 0 65px; }
.esg-box.ethical-box .listbox li dt { font-size:25px; color:#111; font-weight:700; letter-spacing:-0.02em; }
.esg-box.ethical-box .listbox li dd { margin-top:18px; font-size:18px; color:#333; font-weight:300; letter-spacing:-0.02em; line-height:1.6; }
.esg-box.ethical-box .btn { margin-top:90px; text-align:center }
.esg-box.ethical-box .btn a { display:inline-block; margin:0 8px; }
.esg-box.ethical-box .btn a span { padding:0 30px; height:70px; display:flex; align-items:center; justify-content:center; background-color:#ff7b0f; border-radius:50px; color:#fff; font-size:17px; font-weight:500; }
.esg-box.ethical-box .btn a span img { display:inline-block; vertical-align:middle; margin:-4px 0 0 8px; }
@media screen and (max-width:1280px){
    .esg-box.ethical-box .listbox li .icon { width:180px; }
    .esg-box.ethical-box .listbox li dl { width:calc(100% - 180px); }
    .esg-box.ethical-box .ethical-cont dt .p-line { padding:20px; }
    .esg-box.ethical-box .ethical-cont dt:before { width:600px; height:300px; border-radius:0 0 300px 300px; }
    .esg-box.ethical-box .ethical-cont dt:after { width:600px; }
    .esg-box.ethical-box .ethical-cont dt .box { width:300px; height:300px; border:20px solid #ff7b0f; }
    .esg-box.ethical-box .ethical-cont dt .box svg { width:160px; }
    .esg-box.ethical-box .ethical-cont dd .circle { width:180px; height:180px; }
    .esg-box.ethical-box .ethical-cont dd .circle:before { left:-8px; margin-top:2px; width:11px; height:11px; }
    .esg-box.ethical-box .ethical-cont dd .circle:after { right:-8px; margin-top:2px; width:11px; height:11px; }
    .esg-box.ethical-box .ethical-cont dd .txtbox { margin-top:22px; font-size:19px; }
    .esg-box.ethical-box .ethical-cont dd li:nth-child(1) { top:100px; margin-right:220px; }
    .esg-box.ethical-box .ethical-cont dd li:nth-child(2) { margin-top:28px; }
    .esg-box.ethical-box .ethical-cont dd li:nth-child(3) { top:100px; margin-left:220px; }
    .esg-box.ethical-box .ethical-cont dd li:nth-child(1) .circle:before { bottom:-4px; margin:0 0 0 26px; }
    .esg-box.ethical-box .ethical-cont dd li:nth-child(3) .circle:before { bottom:-4px; margin:0 0 0 -26px; }
    .esg-box.ethical-box .ethical-cont dd li:nth-child(1) .txtbox { position:relative; right:unset; top:unset; transform:translateY(0); margin-top:22px; }
    .esg-box.ethical-box .ethical-cont dd li:nth-child(3) .txtbox { position:relative; left:unset; top:unset; transform:translateY(0); margin-top:22px; }
}
@media screen and (max-width:1024px){
    .esg-box.ethical-box .ethical-cont { margin-top:80px; }
    .esg-box.ethical-box .listbox { margin-top:60px; }
    .esg-box.ethical-box .listbox li .icon { width:120px; }
    .esg-box.ethical-box .listbox li dl { width:calc(100% - 120px); padding:35px 0 45px; }
    .esg-box.ethical-box .listbox li dt { font-size:20px; }
    .esg-box.ethical-box .listbox li dd { margin-top:15px; font-size:16px; }
}
@media screen and (max-width:860px){
    .esg-box.ethical-box .ethical-cont dt .p-line { padding:20px; }
    .esg-box.ethical-box .ethical-cont dt:before,
    .esg-box.ethical-box .ethical-cont dt:after { display:none }
    .esg-box.ethical-box .ethical-cont dt .box { width:300px; height:300px; border:20px solid #ff7b0f; }
    .esg-box.ethical-box .ethical-cont dt .box svg { width:160px; }
    .esg-box.ethical-box .ethical-cont dd .circle { width:180px; height:180px; }
    .esg-box.ethical-box .ethical-cont dd .circle:before,
    .esg-box.ethical-box .ethical-cont dd .circle:after { display:none !important }
    .esg-box.ethical-box .ethical-cont dd .txtbox { margin-top:0; } 
    .esg-box.ethical-box .ethical-cont dd ul { display:flex; flex-wrap:wrap; justify-content:center; gap:30px; margin-top:30px; }
    .esg-box.ethical-box .ethical-cont dd li:nth-child(1),
    .esg-box.ethical-box .ethical-cont dd li:nth-child(2),
    .esg-box.ethical-box .ethical-cont dd li:nth-child(3) { position:relative; top:unset; left:unset; right:unset; margin:0; }
    .esg-box.ethical-box .ethical-cont dd li:nth-child(1) .txtbox,
    .esg-box.ethical-box .ethical-cont dd li:nth-child(2) .txtbox,
    .esg-box.ethical-box .ethical-cont dd li:nth-child(3) .txtbox { margin-top:20px; }
    .esg-box.ethical-box .btn { margin-top:70px; }
    .esg-box.ethical-box .btn a span { padding:0 25px; height:60px; font-size:16px; }
    .esg-box.ethical-box .btn a span img { display:inline-block; vertical-align:middle; margin:-4px 0 0 8px; }
}
@media screen and (max-width:640px){
    .esg-box.ethical-box .ethical-cont { margin-top:60px; }
    .esg-box.ethical-box .ethical-cont dt .box { width:250px; height:250px; border:15px solid #ff7b0f; }
    .esg-box.ethical-box .ethical-cont dt .box svg { width:140px; }
    .esg-box.ethical-box .ethical-cont dd .circle { width:160px; height:160px; }
    .esg-box.ethical-box .ethical-cont dd .txtbox { margin-top:20px; font-size:18px; }
    .esg-box.ethical-box .listbox { margin-top:50px; }
    .esg-box.ethical-box .listbox li .icon { width:110px; }
    .esg-box.ethical-box .listbox li dl { width:calc(100% - 110px); padding:30px 0 40px; }
    .esg-box.ethical-box .listbox li dt { font-size:18px; }
    .esg-box.ethical-box .listbox li dd { margin-top:12px; font-size:15px; }
    .esg-box.ethical-box .btn { margin-top:50px; }
    .esg-box.ethical-box .btn a { margin:8px 0; width:100%; text-align:center }
    .esg-box.ethical-box .btn a span { padding:0 25px; height:45px; font-size:15px;}
}

/* animation */
.esg-box.ethical-box .ethical-cont dt,
.esg-box.ethical-box .ethical-cont dd li { opacity:0; }
.esg-box.ethical-box .ethical-cont.subOn dt { animation:ani_5.8s 0.3s; animation-fill-mode:both; }
.esg-box.ethical-box .ethical-cont.subOn dd li:nth-child(1) { animation:ani_1 .8s 0.4s; animation-fill-mode:both; }
.esg-box.ethical-box .ethical-cont.subOn dd li:nth-child(2) { animation:ani_3 .8s 0.6s; animation-fill-mode:both; }
.esg-box.ethical-box .ethical-cont.subOn dd li:nth-child(3) { animation:ani_2 .8s 0.8s; animation-fill-mode:both; }
.esg-box.ethical-box .listbox li { opacity:0; }
.esg-box.ethical-box .listbox.subOn li { animation:ani_4 .8s 0.4s; animation-fill-mode:both; }


/* recruit-box */
.recruit-box .subTitle-box { margin-top:0; }
.recruit-box .listbox { margin-top:75px; }
.recruit-box .listbox ul { border-top:1px solid #e6e6e6; }
.recruit-box .listbox li { border-bottom:1px solid #e6e6e6;  }
.recruit-box .listbox li > a { position:relative; padding:44px 200px 44px 50px; display:flex; flex-wrap:wrap; align-items:center; }
.recruit-box .listbox li .category { color:#111; font-size:30px; font-weight:700; width:275px; }
.recruit-box .listbox li .txtbox { width:calc(100% - 275px); }
.recruit-box .listbox li .txtbox > p { min-height:28px; color:#111; font-size:25px; font-weight:600; line-height:1.4; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; }
.recruit-box .listbox li .txtbox .keyword { margin-top:13px; color:#666; font-size:17px; font-weight:300; line-height:1.4; }
.recruit-box .listbox li .state { color:#fff; font-size:16px; font-weight:700; position:absolute; top:50%; right:50px; transform:translateY(-50%); text-align:center; display:flex; align-items:center; justify-content:center; width:98px; height:98px; background:#ff7b0f; border-radius:100%; }
.recruit-box .listbox li .state.finish { background:#e8e8e8; color:#444; font-weight:400; }
@media screen and (max-width:1024px){
    .recruit-box .subTitle-box { margin-top:0; }
    .recruit-box .listbox { margin-top:60px; }
    .recruit-box .listbox li > a { padding:30px 130px 30px 35px; }
    .recruit-box .listbox li .category { font-size:24px; width:200px; }
    .recruit-box .listbox li .txtbox { width:calc(100% - 200px); }
    .recruit-box .listbox li .txtbox > p { min-height:23px; font-size:20px; }
    .recruit-box .listbox li .txtbox .keyword { margin-top:10px; font-size:16px; }
    .recruit-box .listbox li .state { right:35px; font-size:15px; width:75px; height:75px; }
}
@media screen and (max-width:640px){
    .recruit-box .subTitle-box { margin-top:0; }
    .recruit-box .listbox { margin-top:40px; }
    .recruit-box .listbox li > a { padding:20px 100px 20px 10px; }
    .recruit-box .listbox li .category { font-size:20px; width:100%; }
    .recruit-box .listbox li .txtbox { width:100%; margin-top:15px; }
    .recruit-box .listbox li .txtbox > p { min-height:20px; font-size:18px; }
    .recruit-box .listbox li .txtbox .keyword { margin-top:8px; font-size:15px; }
    .recruit-box .listbox li .state { right:20px; font-size:15px; width:70px; height:70px; }
}
/* animation */
.recruit-box .listbox { opacity:0; }
.recruit-box .listbox.subOn { animation:ani_3 0.5s 0.3s; animation-fill-mode:both; }

/* recruit-complete */
.recruit-complete { margin-top:0; text-align:center; }
.recruit-complete .imgbox img { max-width:100%; }
.recruit-complete .txtbox { margin-top:55px; }
.recruit-complete .txtbox p { color:#111; font-size:60px; font-weight:700; line-height:1.4; }
.recruit-complete .txtbox p span { color:#ff7b0f; }
.recruit-complete .txtbox .txt-1 { margin-top:35px; color:#111; font-size:20px; font-weight:500; line-height:1.8; }
.recruit-complete .txtbox .txt-2 { margin-top:40px; color:#333; font-size:18px; font-weight:300; line-height:1.6; }
.recruit-complete .txtbox .txt-2 > div,
.recruit-complete .txtbox .txt-2 > span.bar { display:inline-block }
@media screen and (max-width:1024px){  
    .recruit-complete { margin-top:0; }
    .recruit-complete .imgbox img { max-width:80%; }
    .recruit-complete .txtbox { margin-top:45px; }
    .recruit-complete .txtbox p { font-size:40px; }
    .recruit-complete .txtbox .txt-1 { margin-top:30px; font-size:18px; }
    .recruit-complete .txtbox .txt-2 { margin-top:35px; font-size:16px; }
}
@media screen and (max-width:640px){  
    .recruit-complete { margin-top:0; }
    .recruit-complete .txtbox { margin-top:30px; }
    .recruit-complete .txtbox p { font-size:26px; }
    .recruit-complete .txtbox .txt-1 { margin-top:20px; font-size:17px; }
    .recruit-complete .txtbox .txt-1 br { display:none; }
    .recruit-complete .txtbox .txt-2 { margin-top:25px; font-size:15px; }
    .recruit-complete .txtbox .txt-2 > div { display:block }
    .recruit-complete .txtbox .txt-2 > span.bar { display:none }
}


/* customer */
.press-box .subTitle-box { margin-top:125px; }
.press-box .listbox { margin-top:100px; position:relative; overflow:hidden; }
.press-box .listbox > ul { position:absolute; top:0; left:0; opacity:-11; opacity:0; width:100%; display:flex; flex-wrap:wrap; gap:65px 50px; }
.press-box .listbox > ul.active { position:relative; z-index:3; opacity:1; }
.press-box .listbox > ul > li { width:calc((100% - 100px) / 3); }
.press-box .listbox > ul > li .imgbox { position:relative; overflow:hidden; }
.press-box .listbox > ul > li .imgbox:before {content:""; display:block; padding-bottom:68%; }
.press-box .listbox > ul > li .imgbox img { position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover; -o-object-fit:cover; transform:scale(1.00); transition:all 0.3s }
.press-box .listbox > ul > li .imgbox:hover img { transform:scale(1.2); }
.press-box .listbox > ul > li .txtbox { margin-top:25px; }
.press-box .listbox > ul > li .txtbox p { min-height:24px; color:#111; font-size:20px; font-weight:500; line-height:1.4; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; }
.press-box .listbox > ul > li .txtbox span.date { margin-top:10px; display:block; color:#666; font-size:14px; font-weight:300 }
@media screen and (max-width:1280px){
    .press-box .listbox > ul { gap:50px 40px; }
    .press-box .listbox > ul > li { width:calc((100% - 80px) / 3); }
}
@media screen and (max-width:1024px){
    .press-box .subTitle-box { margin-top:90px; }
    .press-box .listbox { margin-top:80px; }
    .press-box .listbox > ul { gap:40px 30px; }
    .press-box .listbox > ul > li { width:calc((100% - 60px) / 3); }
    .press-box .listbox > ul > li .txtbox { margin-top:20px; }
    .press-box .listbox > ul > li .txtbox p { min-height:20px; font-size:18px; }
    .press-box .listbox > ul > li .txtbox span.date { font-size:14px; }
}
@media screen and (max-width:860px){
    .press-box .listbox > ul { gap:30px 20px; }
    .press-box .listbox > ul > li { width:calc((100% - 30px) / 2); }
    .press-box .listbox > ul > li .txtbox { margin-top:20px; }
    .press-box .listbox > ul > li .txtbox p { min-height:20px; font-size:18px; }
    .press-box .listbox > ul > li .txtbox span.date { margin-top:5px; font-size:14px; }
}
@media screen and (max-width:640px){
    .press-box .subTitle-box { margin-top:50px; }
    .press-box .listbox { margin-top:60px; }
    .press-box .listbox > ul { gap:25px 10px; }
    .press-box .listbox > ul > li { width:calc((100% - 10px) / 2); }
    .press-box .listbox > ul > li .txtbox { margin-top:15px; }
    .press-box .listbox > ul > li .txtbox p { min-height:18px; font-size:16px; }
    .press-box .listbox > ul > li .txtbox span.date { font-size:13px; }
}
/* animation */
.press-box .listbox > ul.active { animation:ani_3 0.5s 0.3s; animation-fill-mode:both; }


/* application */
.application-box .title h4 { text-align:center; font-size:50px; color:#111; font-weight:700; line-height:1.3 }
.application-box .title h4 span { font-weight:700; }
.application-box .title .txt  { text-align:center; margin-top:35px; font-size:18px; color:#333; font-weight:400; line-height:1.6 }
.process_box .process-cont1 { margin-top:100px; padding:150px 0; background-color:#f7f7f7; overflow:hidden; }
.process_box .process-cont1 .listbox { margin-top:80px; }
.process_box .process-cont1 .listbox ul { display:flex; flex-wrap:wrap; justify-content:center; gap:45px; }
.process_box .process-cont1 .listbox ul li { width:calc((100% - 90px) / 3); height:410px; padding:0 10px; background-color:#fff; display:flex; align-items:center; justify-content:center; text-align:center; }
.process_box .process-cont1 .listbox ul li .num { width:42px; height:42px; margin:0 auto; font-size:18px; color:#fff; font-weight:700; display:flex; align-items:center; justify-content:center; background-color:#ff7b0f; border-radius:50%; }
.process_box .process-cont1 .listbox ul li .icon { min-height:75px; margin:0 auto; margin-top:55px; display:flex; align-items:center; justify-content:center; }
.process_box .process-cont1 .listbox ul li .txt { margin-top:42px; font-size:18px; color:#333; font-weight:400; line-height:1.6 }
.process_box .process-cont1 .listbox ul li .txt strong { font-weight:500; color:#222; }
.process_box .process-cont1 .listbox ul li .txt a { position:relative; display:inline-block; margin-top:10px; color:#ff7b0f; font-size:16px; font-weight:600; }
.process_box .process-cont1 .listbox ul li .txt a:before { content:""; display:block; position:absolute; bottom:-2px; left:-2px; width:calc(100% + 4px); height:1px; background-color:#ff7b0f; }
.process_box .process-cont2 { margin-top:150px; overflow:hidden; }
.process_box .process-cont2 .listbox { margin-top:85px; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:100px; }
.process_box .process-cont2 .listbox > ul { position:relative; display:flex; flex-wrap:wrap; gap:0; width:calc(100% - 22% - 100px - 32px); margin-left:32px; }
.process_box .process-cont2 .listbox > ul:before { content:""; display:block; position:absolute; top:50%; left:100%; width:60px; height:1px; background-color:#ff7b0f; }
.process_box .process-cont2 .listbox > ul:after { content:""; display:block; position:absolute; top:50%; right:-60px; transform:translateY(-50%); width:8px; height:8px; background-color:#ff7b0f; border-radius:50%; }
.process_box .process-cont2 .listbox > ul > li { position:relative; width:calc(25% + 32px); margin-left:-32px; }
.process_box .process-cont2 .listbox > ul > li:before { content:""; display:block; padding-bottom:100%; }
.process_box .process-cont2 .listbox > ul > li .circle { position:absolute; top:0; left:0; width:100%; height:100%; display:flex; align-items:center; justify-content:center; border:1px solid #ff7b0f; border-radius:50%; }
.process_box .process-cont2 .listbox .circle .icon { min-height:60px; margin:0 auto; display:flex; align-items:center; justify-content:center; }
.process_box .process-cont2 .listbox .circle .txt { margin-top:42px; font-size:20px; color:#111; font-weight:600; line-height:1.6; text-align:center; padding:0 20px; word-break:keep-all }
.process_box .process-cont2 .listbox .final { position:relative; width:22%; }
.process_box .process-cont2 .listbox .final:before { content:""; display:block; padding-bottom:100%; }
.process_box .process-cont2 .listbox .final .line { border:20px solid #fff2e7; border-radius:50%; position:absolute; top:0; left:0; width:100%; height:100%; }
.process_box .process-cont2 .listbox .final .circle { width:100%; height:100%; display:flex; align-items:center; justify-content:center; background-color:#ff7b0f; border:20px solid #ffcea6; border-radius:50%; }
.process_box .process-cont2 .listbox .final .circle .txt { color:#fff; }
.process_box .process-cont2 .txt_list { margin-top:100px; }
.process_box .process-cont2 .txt_list li:not(:last-child) { margin-bottom:2px; }
.process_box .process-cont2 .txt_list li { font-size:16px; color:#333; font-weight:400; line-height:1.6; word-break:break-word; }
.process_box .process-cont2 .txt_list li strong { font-weight:500; }
.process_box .process-cont2 .txt_list li a { color:#333; }
@media screen and (max-width:1280px){
    .process_box .process-cont1 .listbox ul { gap:35px; }
    .process_box .process-cont1 .listbox ul li { width:calc((100% - 70px) / 3);}
    .process_box .process-cont1 .listbox ul li { height:390px; }
    .process_box .process-cont1 .listbox ul li .txt br { display:none }
    .process_box .process-cont1 .listbox ul li .icon { margin-top:35px; }
    .process_box .process-cont2 .listbox { gap:80px; }
    .process_box .process-cont2 .listbox > ul { width:calc(100% - 22% - 80px - 26px); margin-left:26px; }
    .process_box .process-cont2 .listbox > ul > li { width:calc(25% + 26px); margin-left:-26px; }
    .process_box .process-cont2 .listbox .circle .txt { margin-top:25px; }
}
@media screen and (max-width:1024px){
    .application-box .title h4 { font-size:36px; }
    .application-box .title .txt  { margin-top:30px; font-size:16px; }
    .process_box .process-cont1 { margin-top:80px; padding:120px 0; }
    .process_box .process-cont1 .listbox { margin-top:60px; }
    .process_box .process-cont1 .listbox ul { gap:20px; }
    .process_box .process-cont1 .listbox ul li { width:calc((100% - 40px) / 3);}
    .process_box .process-cont1 .listbox ul li { height:320px; }
    .process_box .process-cont1 .listbox ul li .icon { margin-top:20px; }
    .process_box .process-cont1 .listbox ul li .num { width:38px; height:38px; font-size:16px; } 
    .process_box .process-cont1 .listbox ul li .txt { margin-top:25px; font-size:16px; }
    .process_box .process-cont1 .listbox ul li .txt a { margin-top:8px; font-size:15px; }
    .process_box .process-cont2 .listbox { gap:80px; }
    .process_box .process-cont2 .listbox > ul { width:calc(100% - 22% - 80px - 26px); margin-left:26px; }
    .process_box .process-cont2 .listbox > ul > li { width:calc(25% + 26px); margin-left:-26px; }
    .process_box .process-cont2 .listbox .circle .txt { margin-top:25px; }
    .process_box .process-cont2 { margin-top:120px; }
    .process_box .process-cont2 .listbox { margin-top:60px; gap:40px 0; }
    .process_box .process-cont2 .listbox > ul { width:calc(100% - 24px); margin-left:24px; }
    .process_box .process-cont2 .listbox > ul:before,
    .process_box .process-cont2 .listbox > ul:after { display:none }
    .process_box .process-cont2 .listbox > ul > li { width:calc(25% + 24px); margin-left:-24px; }
    .process_box .process-cont2 .listbox .circle .icon { min-height:60px;}
    .process_box .process-cont2 .listbox .circle .txt { margin-top:20px; font-size:18px; }
    .process_box .process-cont2 .listbox .final {  width:32%; margin:0 auto; }
    .process_box .process-cont2 .listbox .final .line { border:15px solid #fff2e7; }
    .process_box .process-cont2 .listbox .final .circle { border:15px solid #ffcea6; }
    .process_box .process-cont2 .txt_list { margin-top:80px; }
    .process_box .process-cont2 .txt_list li { font-size:16px; }
}
@media screen and (max-width:760px){
    .process_box .process-cont1 .listbox ul { gap:20px; }
    .process_box .process-cont1 .listbox ul li { width:calc((100% - 20px) / 2);}
    .process_box .process-cont2 .listbox { margin-top:60px; gap:40px 20px; }
    .process_box .process-cont2 .listbox > ul { width:calc(100% - 24px); margin-left:24px; padding:0 80px; }
    .process_box .process-cont2 .listbox > ul > li { width:calc(50% + 24px); margin-top:20px }
    .process_box .process-cont2 .listbox .final {  width:50%; }
}
@media screen and (max-width:640px){
    .application-box .title h4 { font-size:22px; }
    .application-box .title .txt  { margin-top:22px; font-size:15px; }
    .process_box .process-cont1 { margin-top:50px; padding:80px 0; }
    .process_box .process-cont1 .listbox { margin-top:40px; }
    .process_box .process-cont1 .listbox ul { gap:20px; }
    .process_box .process-cont1 .listbox ul li { width:100%;}
    .process_box .process-cont2 { margin-top:80px; }
    .process_box .process-cont2 .listbox { margin-top:60px; gap:30px 20px; padding:0 25%; }
    .process_box .process-cont2 .listbox > ul { width:100%; margin-left:0; padding:0; }
    .process_box .process-cont2 .listbox > ul > li { width:100%; margin:0; margin-top:-20px; }
    .process_box .process-cont2 .listbox .final {  width:100%; }
}
@media screen and (max-width:480px){
    .process_box .process-cont2 .listbox { padding:0 20%; }
}
.talent_box .listbox > ul > li .txtbox dd strong { font-weight:700; }


/* animation */
.application-box .title h4 { overflow:hidden }
.application-box .title h4 span { opacity:0; display:block;}
.application-box .title.subOn h4 span { animation:ani_3 0.5s 0.3s; animation-fill-mode:both; }
.process_box .process-cont1 .listbox ul li { opacity:0; }
.process_box .process-cont1 .listbox.subOn ul li:nth-child(1) { animation:ani_3 0.8s 0.2s; animation-fill-mode:both; }
.process_box .process-cont1 .listbox.subOn ul li:nth-child(2) { animation:ani_3 0.8s 0.4s; animation-fill-mode:both; }
.process_box .process-cont1 .listbox.subOn ul li:nth-child(3) { animation:ani_3 0.8s 0.6s; animation-fill-mode:both; }
.process_box .process-cont1 .listbox.subOn ul li:nth-child(4) { animation:ani_3 0.8s 0.8s; animation-fill-mode:both; }
.process_box .process-cont2 .listbox > ul > li { opacity:0; }
.process_box .process-cont2 .listbox.subOn ul li:nth-child(1) { animation:ani_2 0.8s 0.2s; animation-fill-mode:both; }
.process_box .process-cont2 .listbox.subOn ul li:nth-child(2) { animation:ani_2 0.8s 0.4s; animation-fill-mode:both; }
.process_box .process-cont2 .listbox.subOn ul li:nth-child(3) { animation:ani_2 0.8s 0.6s; animation-fill-mode:both; }
.process_box .process-cont2 .listbox.subOn ul li:nth-child(4) { animation:ani_2 0.8s 0.8s; animation-fill-mode:both; }
.process_box .process-cont2 .listbox.subOn ul li:nth-child(5) { animation:ani_2 0.8s 1.0s; animation-fill-mode:both; }
.process_box .process-cont2 .listbox > ul:before { width:0 }
.process_box .process-cont2 .listbox > ul:after { opacity:0 }
.process_box .process-cont2 .listbox.subOn > ul:before { width:60px; transition:all 0.5s 1.3s }
.process_box .process-cont2 .listbox.subOn > ul:after { opacity:1; transition:all 0.5s 1.6s }
.process_box .process-cont2 .listbox .final { opacity:0; }
.process_box .process-cont2 .listbox.subOn .final  { animation:bgs3 0.8s 1.7s; animation-fill-mode:both; }
@media screen and (max-width:1024px){
    .process_box .process-cont2 .listbox.subOn > ul:before { display:none } 
}


.talent_box { margin-top:100px; padding:150px 0; background-color:#f7f7f7; }
.talent_box .listbox { margin-top:100px; }
.talent_box .listbox > ul { display:flex; flex-wrap:wrap; gap:40px; }
.talent_box .listbox > ul > li { position:relative; width:calc((100% - 40px) / 2); background:#fff; }
.talent_box .listbox > ul > li .txtbox { position:absolute; left:65px; top:60px; }
.talent_box .listbox > ul > li .txtbox dt { color:#333; font-weight:900; font-size:40px; }
.talent_box .listbox > ul > li .txtbox dt strong { font-weight:900; color:#ff7b0f; }
.talent_box .listbox > ul > li .txtbox dd { margin-top:20px; color:#000; font-size:18px; font-weight:400; line-height:1.6; }
.talent_box .listbox > ul > li .imgbox img { max-width:100%; }
@media screen and (max-width:1400px){
    .talent_box .listbox > ul > li .txtbox { left:40px; top:40px; }
}
@media screen and (max-width:1280px){
    .talent_box .listbox > ul { gap:30px; }
    .talent_box .listbox > ul > li { width:calc((100% - 30px) / 2); padding-top:30px; }
    .talent_box .listbox > ul > li .txtbox { left:25px; top:50px; }
    .talent_box .listbox > ul > li .txtbox dt { font-size:34px; }
    .talent_box .listbox > ul > li .txtbox dd { margin-top:18px; font-size:17px; }
}
@media screen and (max-width:1024px){
    .talent_box { margin-top:80px; padding:120px 0; }
    .talent_box .listbox { margin-top:80px; }
    .talent_box .listbox > ul { gap:20px; }
    .talent_box .listbox > ul > li { width:calc((100% - 20px) / 2)}
    .talent_box .listbox > ul > li .txtbox { left:20px; top:30px; }
    .talent_box .listbox > ul > li .txtbox dt { font-size:24px; }
    .talent_box .listbox > ul > li .txtbox dd { margin-top:12px; font-size:16px; }
}
@media screen and (max-width:860px){
    .talent_box { margin-top:50px; padding:80px 0; }
    .talent_box .listbox { margin-top:50px; }
    .talent_box .listbox > ul { gap:20px; }
    .talent_box .listbox > ul > li { width:100%; padding-top:50px;}
    .talent_box .listbox > ul > li .txtbox dt { font-size:20px; }
    .talent_box .listbox > ul > li .txtbox dd { margin-top:12px; font-size:15px; }
}

/* animation */
.talent_box .listbox > ul > li { opacity:0; }
.talent_box .listbox > ul > li.subOn:nth-child(2n-1) { animation:ani_3 0.8s 0.3s; animation-fill-mode:both; }
.talent_box .listbox > ul > li.subOn:nth-child(2n) { animation:ani_3 0.8s 0.6s; animation-fill-mode:both; }



.faq_box { margin-top:100px; padding:150px 0; background-color:#f7f7f7; }
.faq_box .listbox { margin-top:100px; }
.faq_box .listbox > ul { border-top:1px solid #d6d6d6; }
.faq_box .listbox > ul > li { border-bottom:1px solid #d6d6d6; }
.faq_box .listbox > ul > li > p { position:relative; cursor:pointer; padding:35px 100px 35px 125px; min-height:136px; font-size:25px; color:#000; font-weight:700; line-height:1.4; display:flex; align-items:center; } 
.faq_box .listbox > ul > li > p:before { content:""; display:block; position:absolute; right:40px; top:50%; transform:translateY(-50%); width:14px; height:9px; background:url(/img/sub/faq_arr.png) center center no-repeat; }
.faq_box .listbox > ul > li.on > p:before { background:url(/img/sub/faq_arr_on.png) center center no-repeat; }
.faq_box .listbox > ul > li > p span.q { position:absolute; left:40px; top:42px; color:#fff; font-weight:700; font-size:30px; display:flex; justify-content:center; align-items:center; width:57px; height:57px; background-color:#ff7b0f; border-radius:50%; }
.faq_box .listbox > ul > li .contentBox { background-color:#fff; border-top:1px solid #d6d6d6; padding:35px 55px 70px; color:#000; font-size:18px; line-height:1.6 }
@media screen and (max-width:1024px){
    .faq_box { margin-top:80px; padding:120px 0; }
    .faq_box .listbox { margin-top:80px; }
    .faq_box .listbox > ul > li > p { padding:30px 100px 30px 110px; min-height:120px; font-size:22px; } 
    .faq_box .listbox > ul > li > p span.q { left:30px; top:35px; font-size:24px; width:52px; height:52px; }
    .faq_box .listbox > ul > li .contentBox { padding:30px 45px 60px; font-size:16px; }
}
@media screen and (max-width:640px){
    .faq_box { margin-top:50px; padding:80px 0; }
    .faq_box .listbox { margin-top:50px; }
    .faq_box .listbox > ul > li > p { padding:20px 50px 20px 65px; min-height:80px; font-size:17px; } 
    .faq_box .listbox > ul > li > p:before { right:20px; }
    .faq_box .listbox > ul > li > p span.q { left:10px; top:20px; font-size:19px; width:40px; height:40px; }
    .faq_box .listbox > ul > li .contentBox { padding:20px 20px 50px; font-size:16px; }
}

/* animation */
.faq_box .listbox { animation:ani_4 0.8s 0.6s; animation-fill-mode:both; }


.welfare_box { margin-top:100px; padding:150px 0; background-color:#f7f7f7; }
.welfare_box .listbox { margin-top:100px; }
.welfare_box .listbox > ul { display:flex; flex-wrap:wrap; gap:20px 23px; }
.welfare_box .listbox > ul > li { width:calc((100% - 69px) / 4); height:314px; background-color:#fff; display:flex; justify-content:center; align-items:center; text-align:center; }
.welfare_box .listbox > ul > li .icon { }
.welfare_box .listbox > ul > li .txt { margin-top:35px; color:#111; font-size:20px; font-weight:600; line-height:1.3; }
@media screen and (max-width:1280px){
    .welfare_box .listbox > ul { gap:20px 20px; }
    .welfare_box .listbox > ul > li { width:calc((100% - 60px) / 4); height:300px; }
}
@media screen and (max-width:1024px){
    .welfare_box { margin-top:80px; padding:120px 0; }
    .welfare_box .listbox { margin-top:80px; }
    .welfare_box .listbox > ul { gap:15px 15px; }
    .welfare_box .listbox > ul > li { width:calc((100% - 30px) / 3); height:300px; }
    .welfare_box .listbox > ul > li .txt { margin-top:25px; font-size:18px; }
}
@media screen and (max-width:640px){
    .welfare_box { margin-top:50px; padding:80px 0; }
    .welfare_box .listbox { margin-top:50px; }
    .welfare_box .listbox > ul { gap:12px 10px; }
    .welfare_box .listbox > ul > li { width:calc((100% - 10px) / 2); height:280px; }
}
@media screen and (max-width:480px){
    .welfare_box .listbox > ul > li { height:220px; }
    .welfare_box .listbox > ul > li .icon img { max-width:76%; }
}
/* animation */
.welfare_box .listbox.subOn > ul > li { animation:ani_4 0.8s 0.6s; animation-fill-mode:both; }


.foreground_box { margin-top:100px; }
.foreground_box .listbox > ul { display:flex; flex-wrap:wrap; gap:75px 50px; }
.foreground_box .listbox > ul > li { width:calc((100% - 100px) / 3); }
.foreground_box .listbox > ul > li .imgbox { position:relative; overflow:hidden; }
.foreground_box .listbox > ul > li .imgbox:before {content:""; display:block; padding-bottom:68%; }
.foreground_box .listbox > ul > li .imgbox img { position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover; -o-object-fit:cover; }
.foreground_box .listbox > ul > li .txtbox { margin-top:25px; font-size:18px; color:#111; font-weight:500; line-height:1.4; }
@media screen and (max-width:1280px){
    .foreground_box .listbox > ul { gap:50px 30px; }
    .foreground_box .listbox > ul > li { width:calc((100% - 60px) / 3); }
    .foreground_box .listbox > ul > li .txtbox { margin-top:18px; font-size:16px; }
}
@media screen and (max-width:960px){
    .foreground_box { margin-top:80px; }
    .foreground_box .listbox > ul { gap:40px 20px; }
    .foreground_box .listbox > ul > li { width:calc((100% - 20px) / 2); }
}
@media screen and (max-width:640px){
    .foreground_box { margin-top:50px; }
    .foreground_box .listbox > ul { gap:30px 10px; }
    .foreground_box .listbox > ul > li { width:calc((100% - 10px) / 2); }
    .foreground_box .listbox > ul > li .txtbox { margin-top:12px; }
}

/* animation */
.foreground_box .listbox.subOn > ul > li { animation:ani_4 0.8s 0.6s; animation-fill-mode:both; }


.search-box { position:relative; display:flex; flex-wrap:wrap; padding-right:170px; margin-top:80px; }
.search-box select { width:350px; height:80px; line-height:80px; padding:0 40px; font-size:18px; color:#111; font-weight:400; border:none; outline:none; -webkit-appearance:none; -moz-appearance:none; appearance:none; border-radius:0; background:#f3f3f3 url(/img/sub/icon_select_down.png) right center no-repeat; }
.search-box select::-ms-expand { display:none; }
.search-box input { width:calc(100% - 350px - 10px); margin-left:10px; height:80px; padding:0 40px; font-size:18px; color:#111; font-weight:400; border:none; outline:none; background:#f3f3f3; border-radius:0; }
.search-box button { position:absolute; right:0; top:0; display:inline-block; text-align:center; border:none; outline:none; background:none; padding:0; }
.search-box button span { margin:0 auto; display:flex; justify-content:center; align-items:center; position:relative; text-align:center; background-color:#ff7b0f; min-width:170px; height:80px; color:#fff; font-size:18px; font-weight:600; }
@media screen and (max-width:1024px){	
    .search-box { margin-top:60px; }
    .search-box select { width:250px; height:70px; line-height:70px; padding:0 25px; font-size:16px; }
    .search-box input { width:calc(100% - 250px - 10px); margin-left:10px; height:70px; padding:0 25px; font-size:16px; }
    .search-box button span { min-width:170px; height:70px; font-size:16px; }
}
@media screen and (max-width:760px){	
    .search-box { padding-right:0; }
    .search-box select { width:100%; }
    .search-box input { width:100%; margin-left:0; margin-top:8px; padding:0 175px 0 25px; }
    .search-box button { top:unset; bottom:0; }
    .search-box button span { min-width:150px; }
}
@media screen and (max-width:640px){	
    .search-box { margin-top:40px; }
    .search-box select { padding:0 10px; height:60px; line-height:60px; }
    .search-box input { height:60px; padding:0 110px 0 10px; }
    .search-box button span { min-width:90px; height:60px; }
}
.register-box { max-width:100%; margin:0; border:none; border-radius:0; background:none; padding:0; box-shadow:unset; }/* ���ߺκ� site.css */
.inquiry-box { margin-top:80px; }
.register-box .txt_tr { margin-top:40px; text-align:right; font-weight:400; font-size:16px; color:#333; }
.register-box .stit { margin:-20px 0 50px; text-align:center; color:#111; font-size:25px; font-weight:600; }
.register-box span.s { color:#ff7b0f; font-size:20px; font-weight:400; }
.register-box > ul { margin-top:20px; display:flex; flex-wrap:wrap; gap:20px 12px; }
.register-box > ul > li { position:relative; display:flex; align-items:center; flex-wrap:wrap; width:100%;  }
.register-box > ul > li.w50 { width:calc((100% - 12px) / 2) }
.register-box > ul > li > div { width:100% }
.register-box > ul > li .sel-box { background:#f3f3f3; }
.register-box > ul > li label.tit { position:absolute; left:40px; top:50%; z-index:1; transform:translateY(-50%); font-size:18px; color:#111; font-weight:600; line-height:1.6; display:inline-block; transition:all 0.3s }
.register-box > ul > li label.tit span { font-weight:300; }
.register-box > ul > li.tit-top label.tit { top:23px; transform:translateY(0); }
.register-box > ul > li input[type="text"],
.register-box > ul > li input[type="password"] { height:80px; padding:0 40px; width:100%; font-size:18px; color:#111; font-weight:400; border:none; outline:none; background:#f3f3f3; border-radius:0; }
.register-box > ul > li select { width:100%; height:80px; line-height:80px; padding:0 40px; font-size:18px; color:#111; font-weight:400; border:none; outline:none; -webkit-appearance:none; -moz-appearance:none; appearance:none; border-radius:0; background:#f3f3f3 url(/img/sub/icon_select_down.png) right center no-repeat; }
.register-box > ul > li select::-ms-expand { display: none; }
.register-box > ul > li textarea { width:100%; height:207px; line-height:1.6; padding:30px 40px; font-size:18px; color:#111; font-weight:400; border:none; outline:none; background:#f3f3f3; border-radius:0; }
.register-box > ul > li input.ip02 { width:calc(33.333% - 18px); }
.register-box > ul > li select.sel01 { width:calc(33.333% - 13px); margin-left:13px; }
.register-box > ul > li select.sel02 { width:calc(100% - 160px); margin-left:160px; }
.register-box > ul > li .stxt { font-size:18px; color:#111; font-weight:600; width:36px; display:inline-block; text-align:center; }
.register-box > ul > li .ip-box { background:#f3f3f3; padding:13px 0 13px 162px; display:flex; flex-wrap:wrap; align-items:center; }
.register-box > ul > li .ip-box .ipcont { position:relative; display:flex; padding-left:160px; }
.register-box > ul > li .ip-box .ipcont:not(:last-child) { margin-bottom:10px; }
.register-box > ul > li .ip-box .ipcont .upload-name { width:100%; height:65px; outline:none; border:none; padding:0 20px; font-size:18px; color:#111; border-radius:0 }
.register-box > ul > li .ip-box .ipcont .upload-name.on { padding:4px 0 4px 45px; background:url(/img/sub/file_icon.png) 20px center no-repeat; }
.register-box > ul > li .ip-box .ipcont .file { position:absolute; left:0; top:7px; width:145px; height:50px; background:#434343; border:none; cursor:pointer; margin-left:10px; display:flex; align-items:center; justify-content:center; border-radius:50px }
.register-box > ul > li .ip-box .ipcont .file.en { background:#ff7b0f; }
.register-box > ul > li .ip-box .ipcont .file span{ text-align:center; font-size:16px; color:#fff; font-weight:500; padding:2px 20px 2px 0; background:url(/img/sub/search_icon.png) right center no-repeat;}
.register-box > ul > li .ip-box .ipcont .file input{display:none}
.register-box > ul > li .ip-box .download { margin-left:10px; }
.register-box > ul > li .ip-box .download a { width:145px; height:50px; background:#ff7b0f; border:none; text-align:center; font-size:16px; color:#fff; font-weight:500; padding:2px 0; display:flex; align-items:center; justify-content:center; border-radius:50px }
.register-box > ul > li.careers .ip-box { padding:13px 0 13px 210px }
.register-box > ul > li .kcaptcha_ip { background:#f3f3f3; position:relative; padding:0 50px 0 340px; width:600px; }
.register-box > ul > li .kcaptcha_ip .imgbox { position:absolute; left:170px; top:0; }
.register-box > ul > li .kcaptcha_ip .imgbox img { width:175px; }
.register-box > ul > li .kcaptcha_ip input { border:none }
.register-box > ul > li .kcaptcha_ip .btn { position:absolute; right:0; top:0; height:100%; width:50px; border:none; outline:none; background:none }
.register-box > ul > li .kcaptcha_ip .btn i { color:#555; font-size:18px; }
.register-box > ul > li .privacy-box { background:#f3f3f3; padding:44px 0 30px 40px; }
.register-box > ul > li .privacy-box .scroll-box { margin-top:30px; height:180px; overflow:auto; }
.register-box > ul > li .privacy-box .scroll-box p { margin-top:8px; font-size:15px; color:#111; line-height:1.3; }
.register-box > ul > li .privacy-box .scroll-box p.tit-1 { margin-top:25px; }
.register-box > ul > li .privacy-box .scroll-box p.txt { margin-top:25px; }
.register-box > ul > li .sel-focus:focus ~ .tit,
.register-box > ul > li.on label.tit { opacity:0; z-index:-1 }
.register-box .ch { margin-top:25px; }
.register-box .ch_list .ch { margin-top:0; }
.register-box .ch input[type="checkbox"],
.register-box .ch input[type="radio"]{opacity:0; height:auto; line-height:auto;}
.register-box .ch input[type="checkbox"] + span,
.register-box .ch input[type="radio"] + span { position:relative; padding:0 0 0 20px; font-weight:300; font-size:16px; line-height:1.4 !important; display:inline-block; color:#111; }
.register-box .ch input[type="checkbox"] + span:before,
.register-box .ch input[type="radio"] + span:before { content:''; display:block; margin:3px 0 0 0; width:14px; height:14px; vertical-align:middle; background:none; border:1px solid #d7d7d7; border-radius:50px; position:absolute; left:-10px; top:-1px; }
.register-box .ch input[type="checkbox"] + span:after,
.register-box .ch input[type="radio"] + span:after { content:''; display:block; width:6px; height:6px; vertical-align:middle; background:none; border:none; border-radius:50px; position:absolute; left:-5px; top:7px; }
.register-box .ch input[type="checkbox"]:checked + span:after,
.register-box .ch input[type="radio"]:checked + span:after { background:#ff7b0f; }
.register-box .btnbox { margin-top:65px; }
@media screen and (max-width:1024px){	
    .inquiry-box { margin-top:60px; }
    .register-box .stit { margin:-20px 0 40px; font-size:20px; }
	.register-box > ul { gap:20px 10px; }
    .register-box > ul > li label.tit { left:25px; font-size:17px; }
    .register-box > ul > li.tit-top label.tit { top:20px; transform:translateY(0); }
	.register-box > ul > li input[type="text"],
	.register-box > ul > li input[type="password"] { height:70px; padding:0 25px; font-size:16px; }
	.register-box > ul > li select { height:70px; line-height:70px; padding:0 25px; font-size:16px; }
	.register-box > ul > li textarea { height:200px; padding:25px; font-size:16px; }
    .register-box > ul > li select.sel02 { width:calc(100% - 120px); margin-left:120px; }
    .register-box > ul > li .ip-box { padding:10px 0 10px 120px }
    .register-box > ul > li .ip-box .ipcont { padding-left:140px; }
	.register-box > ul > li .ip-box .ipcont:not(:last-child) { margin-bottom:10px; }
    .register-box > ul > li .ip-box .ipcont .upload-name { font-size:16px; height:60px; }
	.register-box > ul > li .ip-box .ipcont .file {width:130px; height:50px; }
	.register-box > ul > li .ip-box .ipcont .file span{ font-size:15px; }
    .register-box > ul > li .ip-box .download a { width:130px; 15px; }
    .register-box > ul > li.careers .ip-box { padding:13px 0 13px 180px }
	.register-box > ul > li .kcaptcha_ip { padding:0 50px 0 280px; }
    .register-box > ul > li .kcaptcha_ip .imgbox { left:140px; }
	.register-box > ul > li .kcaptcha_ip .imgbox img { width:150px !important; height:70px !important; }
	.register-box > ul > li .kcaptcha_ip .btn i { font-size:17px; }
    .register-box > ul > li .privacy-box { padding:35px 0 25px 25px; }
    .register-box > ul > li .privacy-box .scroll-box { margin-top:30px; height:120px; }
	.register-box .ch { margin-top:25px; }
	.register-box .ch input[type="checkbox"] + span,
	.register-box .ch input[type="radio"] + span { font-size:16px; }
}
@media screen and (max-width:960px){
    .register-box > ul > li .ip-box .ipcont { width:100%; margin-top:3px; }
}
@media screen and (max-width:640px){	
    .inquiry-box { margin-top:40px; }
    .register-box .stit { margin:-10px 0 -20px; font-size:18px; }
	.register-box > ul { gap:10px 0; }
    .register-box > ul > li.w50 { width:100%; }
    .register-box > ul > li label.tit { left:10px; line-height:1.2; }
    .register-box > ul > li.tit-top label.tit { top:18px; transform:translateY(0); }
	.register-box > ul > li input[type="text"],
	.register-box > ul > li input[type="password"] { height:60px; padding:0 10px; }
	.register-box > ul > li select { height:60px; line-height:60px; padding:0 10px; background:#f3f3f3 url(/img/sub/icon_select_down_m.png) right center no-repeat; }
	.register-box > ul > li textarea { height:150px; padding:18px 10px; }
	.register-box > ul > li input.ip02 { width:calc(50% - 15px); }
	.register-box > ul > li select.sel01 { width:calc(100% - 1px); margin:10px 0 0; }
    .register-box > ul > li select.sel02 { width:calc(100% - 100px); margin-left:100px; }
	.register-box > ul > li .stxt { width:30px; }
    .register-box > ul > li .ip-box { padding:10px 0 10px 100px }
    .register-box > ul > li .ip-box .ipcont { padding-left:0; padding-top:40px; }
	.register-box > ul > li .ip-box .ipcont:not(:last-child) { margin-bottom:10px; }
    .register-box > ul > li .ip-box .ipcont .upload-name { height:45px; padding:0 10px; }
	.register-box > ul > li .ip-box .ipcont .file { left:0; height:40px; width:110px; top:2px; }
    .register-box > ul > li .ip-box .download a { width:110px; height:40px; }
    .register-box > ul > li.careers .ip-box { padding:50px 0 13px 0 }
    .register-box > ul > li.careers label.tit { width:100%; top:30px; }
    .register-box > ul > li.careers label.tit br { display:none }
    .register-box > ul > li.careers .ip-box .ipcont { padding:0 0 0 118px; }
	.register-box > ul > li .kcaptcha_ip { padding:0 25px 0 205px; }
    .register-box > ul > li .kcaptcha_ip .imgbox { left:110px; top:0; width:100px; height:60px; overflow:hidden }
	.register-box > ul > li .kcaptcha_ip .imgbox img { position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:130px !important; height:70px !important; }
    .register-box > ul > li .kcaptcha_ip input { margin-top:0; }
    .register-box > ul > li .kcaptcha_ip .btn { width:30px; }
    .register-box > ul > li .privacy-box { padding:30px 0 10px 10px; }
    .register-box > ul > li .privacy-box .scroll-box { margin-top:28px; }
    .register-box > ul > li span.m_br { display:block; }
	.register-box .ch { margin-top:25px; }
}

/* animation */
.register-box { opacity:0; }
.register-box.subOn { animation:ani_3 0.5s 0.3s; animation-fill-mode:both; }


.board-view { margin-top:80px; }
.board-view .top-box { text-align:center; background-color:#f3f3f3; padding:60px 20px; }
.board-view .top-box .category { padding:8px 20px; display:inline-block; margin:0 auto; font-size:14px; font-weight:600; color:#fff; border-radius:50px; background-color:#ff7b0f; }
.board-view .top-box .title { margin-top:20px; font-size:30px; font-weight:600; color:#111; line-height:1.6; }
.board-view .top-box .date { margin-top:10px; font-size:15px; font-weight:300; color:#666; line-height:1.4; }
.board-view .top-box .date span.bar { display:inline-block; vertical-align:middle; margin:-3px 10px 0; overflow:hidden; width:1px; height:13px; background-color:#666; }
.board-view .viewCont .attach { padding-top:50px; }
.board-view .viewCont .attach dt { font-size:18px; font-weight:600; color:#111; }
.board-view .viewCont .attach dd { padding-top:3px; }
.board-view .viewCont .attach dd li { margin-top:10px; padding:4px 0 4px 22px; background:url(/img/sub/file_icon.png) left center no-repeat; }
.board-view .viewCont .attach dd li a { font-size:16px; font-weight:400; color:#333; }
.board-view .viewCont .contents { min-height:180px; padding:50px 0; }
.board-view .btn_pn { border-top:1px solid #e6e6e6; }
.board-view .btn_pn dl { border-bottom:1px solid #e6e6e6; display:flex; }
.board-view .btn_pn dt { width:225px; height:69px; background-color:#f3f3f3; display:flex; align-items:center; justify-content:center; font-size:18px; font-weight:400; color:#333; } 
.board-view .btn_pn dd { width:calc(100% - 225px); display:flex; align-items:center; padding:0 20px; }
.board-view .btn_pn dd a { font-size:18px; font-weight:400; color:#111; min-height:20px; line-height:1.4; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; }
@media screen and (max-width:1024px){	
    .board-view { margin-top:60px; }
    .board-view .top-box { padding:40px 20px; }
    .board-view .top-box .category { padding:8px 20px; font-size:14px; }
    .board-view .top-box .title { margin-top:15px; font-size:24px; }
    .board-view .top-box .date { margin-top:5px; font-size:15px; }
    .board-view .top-box .date span.bar { margin:-3px 8px 0; height:13px; }
    .board-view .viewCont .attach { padding-top:40px; }
    .board-view .viewCont .attach dt { font-size:17px; }
    .board-view .viewCont .attach dd { padding-top:3px; }
    .board-view .viewCont .attach dd li { margin-top:10px; }
    .board-view .viewCont .attach dd li a { font-size:16px; }
    .board-view .viewCont .contents { min-height:160px; padding:40px 0; }
    .board-view .btn_pn dt { width:180px; height:62px; font-size:17px; } 
    .board-view .btn_pn dd { width:calc(100% - 180px); }
    .board-view .btn_pn dd a { font-size:17px; min-height:19px; }
}
@media screen and (max-width:640px){	
    .board-view { margin-top:40px; }
    .board-view .top-box { padding:30px 10px; }
    .board-view .top-box .category { padding:6px 15px; font-size:13px; }
    .board-view .top-box .title { margin-top:10px; font-size:20px; }
    .board-view .top-box .date { margin-top:5px; font-size:14px; }
    .board-view .top-box .date span.bar { margin:-2px 5px 0; height:11px; }
    .board-view .viewCont .attach { padding-top:30px; }
    .board-view .viewCont .attach dt { font-size:16px; }
    .board-view .viewCont .attach dd { padding-top:3px; }
    .board-view .viewCont .attach dd li { margin-top:10px; }
    .board-view .viewCont .attach dd li a { font-size:15px; }
    .board-view .viewCont .contents { min-height:160px; padding:40px 0; }
    .board-view .btn_pn dt { width:100px; height:62px; font-size:16px; } 
    .board-view .btn_pn dd { width:calc(100% - 120px); }
    .board-view .btn_pn dd a { font-size:16px; }
}


/* page */
.paging { margin:80px auto 0 auto; text-align:center; padding:0; } 
.paging a { position:relative; font-size:16px; line-height:28px; font-weight:300; color:#666; border:none; padding:0; width:28px; height:28px; margin:0 2px; display:inline-block; }
.paging ul { display:inline-block; }
.paging li { display:inline-block; vertical-align:middle; margin:0 3px; }
.paging li.on a { font-weight:600; color:#fff; background-color:#ff7b0f !important; border:none; padding:0 4px; border-radius:50px; }
.paging li:hover a,
.paging li a:hover { border:none; /* background:none; */ }
.paging li.on:hover a  { background-color:#ff7b0f; }
.paging .btn_pn { display:inline-block; vertical-align:middle; padding:0; }
.paging .btn_prev { display:inline-block; vertical-align:middle; height:35px; padding:0; width:20px; margin-right:-4px; overflow:hidden; text-indent:-9999em; background:url(/img/sub/btn_b_prev.png) center center no-repeat; }
.paging .btn_next { display:inline-block; vertical-align:middle; height:35px; padding:0; width:25px; margin-left:-4px; overflow:hidden; border:none; text-indent:-9999em; background:url(/img/sub/btn_b_next.png) center center no-repeat;}
.paging .btn_first { display:inline-block; vertical-align:middle; height:35px; padding:0; width:25px; margin-right:8px; overflow:hidden; border:none; text-indent:-9999em; background:url(/img/sub/btn_b_first.png) center center no-repeat;}
.paging .btn_last { display:inline-block; vertical-align:middle; height:35px; padding:0; width:25px; margin-left:8px; overflow:hidden; border:none; text-indent:-9999em; background:url(/img/sub/btn_b_last.png) center center no-repeat;}
.paging li span { color:#aaa; display:block; margin-top:-10px; font-weight:800; }

@media screen and (max-width:640px){
	.paging { margin:30px auto 0 auto; }
	.paging a { font-size:16px; }
}