@charset "utf-8";


#container { padding-top:135px; }
#container .visual-box { position:relative; padding:0 60px; }
#container .visual-box .imgbox { position:relative; overflow:hidden; max-height:600px; }
#container .visual-box .imgbox:before {content:""; display:block; padding-bottom:25%; }
#container .visual-box .imgbox img { position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover; -o-object-fit:cover; }
#container .visual-box .subTitle { position:absolute; left:0; top:50%; transform:translateY(-50%); width:100%; font-family:var(--font-family); color:#fff; font-size:55px; font-weight:700; line-height:110%; text-align:center; }
#container .visual-box .subTitle span { font-family:var(--font-family); font-weight:700; }
@media screen and (max-width:1280px){
    #container .visual-box .imgbox:before { padding-bottom:30%; }
    #container .visual-box .subTitle { font-size:40px; }
}
@media screen and (max-width:1024px){
    #container { padding-top:100px; }
    #container .visual-box { padding:0 30px; }
    #container .visual-box .imgbox:before { padding-bottom:30%; }
    #container .visual-box .subTitle { font-size:32px; }
}
@media screen and (max-width:860px){
    #container .visual-box .imgbox:before { padding-bottom:34%; }
    #container .visual-box .subTitle { font-size:28px; }
}
@media screen and (max-width:640px){
    #container { padding-top:80px; }
    #container .visual-box { padding:0 20px; }
    #container .visual-box .imgbox:before { padding-bottom:38%; }
    #container .visual-box .subTitle { font-size:20px; }
}
@media screen and (max-width:480px){
    #container .visual-box .imgbox:before { padding-bottom:42%; }
}


/* animation */
#container .visual-box:after { content:""; display:block; width:100%; height:100%; background:#fff; position:absolute; left:0; top:0; z-index:2; }
#container .visual-box:after { animation:ani_w50 1.2s 0.5s; animation-fill-mode:both; }
#container .visual-box:before { content:""; display:block; width:100%; height:100%; background:#fff; position:absolute; right:0; top:0; z-index:2; }
#container .visual-box:before { animation:ani_w50 1.2s 0.5s; animation-fill-mode:both; }
#container .visual-box .subTitle{ display:block; overflow:hidden; }
#container .visual-box .subTitle span { display:block; overflow:hidden; }
#container .visual-box .subTitle span > span { opacity:0; display:inline-block; min-width:20px; }
#container .visual-box .subTitle span > span { animation:blur_txt 1.0s 0.5s; animation-fill-mode:both; }
#container .visual-box .subTitle span.txt { animation:ani_3 1.2s 1.8s; animation-fill-mode:both; }
@media screen and (max-width:1280px){
    #container .visual-box .subTitle span > span { min-width:10px; }
}
@media screen and (max-width:1024px){
    #container .visual-box .subTitle span > span { min-width:8px; }
}
@media screen and (max-width:860px){
    #container .visual-box .subTitle span > span { min-width:6px; }
}

#contents { padding:100px 110px 170px; max-width:2500px; margin:0 auto }
@media screen and (max-width:1024px){
    #contents { padding:80px 70px 120px; }
}
@media screen and (max-width:640px){
    #contents { padding:50px 20px 100px; }
}

#tab { display:flex; flex-wrap:wrap; position:relative; }
#tab .nav { width:400px; position:sticky; top:100px; max-height:250px; z-index:5; padding-right:50px; } 
#tab .nav ul { width:100%; background:#fff }
#tab .nav ul li { border-bottom:1px solid #e8e8e8; }
#tab .nav ul li a { padding:30px 0; font-size:17px; color:#666; font-weight:300; letter-spacing:0.02em; transition:all 0.5s; display:block }
#tab .nav ul li a span { position:relative; font-weight:300; display:inline-block; word-break:keep-all }
#tab .nav ul li.on a { color:#222; font-size:25px; font-weight:700; }
#tab .nav ul li.on a span { font-weight:700; padding-left:25px; }
#tab .nav ul li:first-child a { padding-top:0; }
#tab .nav ul li.on a span:before {content:""; display:block; position:absolute; left:0; top:50%; transform:translateY(-50%); width:5px; height:5px; border-radius:5px; background:#ec1c24; }
#tab .nav ul li.on a span.m_br { display:none }
#tab .nav ul li a span.m_br:before { display:none; }
#tab .tabCont { width:calc(100% - 400px); } 
@media screen and (max-width:1600px){
    #tab .nav { width:340px; }
    #tab .tabCont { width:calc(100% - 340px); } 
}
@media screen and (max-width:1400px){
    #tab .nav { width:300px; padding-right:30px; }
    #tab .tabCont { width:calc(100% - 300px); } 
}
@media screen and (max-width:1280px){
    #tab .nav ul li a { padding:25px 0; font-size:16px; }
    #tab .nav ul li.on a { font-size:22px; }
}
@media screen and (max-width:1024px){
    #tab .nav { padding-right:0; }
    #tab .nav,
    #tab .tabCont,
    #tab .nav ul { width:100%; }
    #tab .nav { top:0; }
    #tab .nav ul { display:flex; justify-content:space-between; gap:0; text-align:center; border-top:1px solid #e8e8e8; border-bottom:1px solid #e8e8e8; padding:0 5px; }
    #tab .nav ul li { border-bottom:none }
    #tab .nav.m2 ul li { width:50% }
    #tab .nav.m3 ul li { width:auto; }
    #tab .nav ul li a { padding:20px 0; font-size:15px; letter-spacing:-0.02em }
    #tab .nav ul li.on a { font-size:18px; }
    #tab .nav ul li:first-child a { padding-top:20px; }
    #tab .nav ul li.on a span { padding-left:0; }
    #tab .nav ul li:first-child.on a span { padding-left:0; }
    #tab .nav ul li.on a span:before { width:3px; height:3px; left:50%; top:-5px; transform:translate(-50%, 0);}
    #tab .tabCont { padding-top:80px; }
}
@media screen and (max-width:640px){
    #tab .tabCont { padding-top:60px; }
    #tab .nav ul { padding:0 30px; }
    #tab .nav ul li a,
    #tab .nav ul li.on a { font-size:16px; }
    #tab.team-box .nav ul { padding:0 30px 0 10px; }
    #tab.team-box .nav ul li a,
    #tab.team-box .nav ul li.on a { font-size:14px; }
    #tab .nav ul li.on a span { padding-left:0; }
    #tab .nav ul li.on a span:before { width:3px; height:3px; }
    #tab .nav ul li a span.m_br,
    #tab .nav ul li.on a span.m_br { display:inline-block; padding-left:0; }
    #tab .nav ul li a span.m_br:before { display:none; }
}

/* title */
#subCont h3.tit { color:#222; font-size:45px; font-weight:600; line-height:1.3 }
#subCont h3.tit span { font-weight:600; }
@media screen and (max-width:1560px){
    #subCont h3.tit {  font-size:40px; }
}
@media screen and (max-width:1280px){
    #subCont h3.tit {  font-size:30px; }
}
@media screen and (max-width:640px){
    #subCont h3.tit {  font-size:22px; }
}

/* animation */
#subCont h3.tit { overflow:hidden; }
#subCont h3.tit span { display:block; opacity:0; }
#subCont h3.tit.subOn span { animation:ani_3 0.8s 0.3s; animation-fill-mode:both; }


/* about */
.about-box .top-box .txt-1 { margin-top:-15px; color:#222; font-size:24px; font-weight:200; line-height:140%; }
.about-box .top-box .txt-1 strong { font-weight:600; }
.about-box .top-box .txt-1 span { font-weight:500; }
.about-box .top-box .txt-2 { margin-top:15px; }
.about-box .contBox-1 { margin-top:80px; }
.about-box .contBox-1 .listbox { margin-top:50px; }
.about-box .contBox-1 .listbox > ul > li:not(:last-child) { margin-bottom:80px; }
.about-box .contBox-1 .listbox > ul > li { display:flex; flex-wrap:wrap; align-items:center; }
.about-box .contBox-1 .listbox > ul > li > div { width:50%; }
.about-box .contBox-1 .listbox > ul > li .ibox { padding-right:20px; }
.about-box .contBox-1 .listbox > ul > li .imgbox { position:relative; overflow:hidden; }
.about-box .contBox-1 .listbox > ul > li .imgbox:before {content:""; display:block; padding-bottom:52.35%; }
.about-box .contBox-1 .listbox > ul > li .imgbox img { position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover; -o-object-fit:cover; }
.about-box .contBox-1 .listbox > ul > li .txtbox { padding-left:90px; }
.about-box .contBox-1 .listbox > ul > li .txtbox dt strong { color:#ec1c24; font-size:16px; font-weight:700; }
.about-box .contBox-1 .listbox > ul > li .txtbox dt h4 { margin-top:10px; color:#000; font-size:35px; font-weight:700; }
.about-box .contBox-1 .listbox > ul > li .txtbox dd { margin-top:25px; color:#000; font-size:16px; font-weight:300; line-height:1.8; opacity:0.8; word-break:keep-all }
.about-box .contBox-1 .listbox > ul > li:nth-child(2n) { flex-direction:row-reverse; }
.about-box .contBox-1 .listbox > ul > li:nth-child(2n) .ibox { padding-right:0; padding-left:20px; }
.about-box .contBox-1 .listbox > ul > li:nth-child(2n) .txtbox { padding-left:0; }
.about-box .contBox-2 { margin-top:160px; }
.about-box .contBox-2 .txt-top { margin-top:50px; color:#000; font-size:18px; font-weight:300; line-height:1.8; opacity:0.8; }
.about-box .contBox-2 .listbox { margin-top:40px; }
.about-box .contBox-2 .listbox > ul { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:35px 60px; }
.about-box .contBox-2 .listbox > ul > li { position:relative; width:calc((100% - 180px) / 4); }
.about-box .contBox-2 .listbox > ul > li:before {content:""; display:block; padding-bottom:100%; }
.about-box .contBox-2 .listbox > ul > li:after {content:"\e907"; display:block; font-family:'xeicon'; font-size:20px; color:#ec1c24; position:absolute; left:-40px; top:50%; transform:translateY(-50%); }
.about-box .contBox-2 .listbox > ul > li:first-child:after,
.about-box .contBox-2 .listbox > ul > li:nth-child(5):after { display:none }
.about-box .contBox-2 .listbox > ul > li .circle { position:absolute; left:0; top:0; width:100%; height:100%; display:flex; align-items:center; justify-content:center; flex-direction:column; text-align:center; background:linear-gradient(136.44deg, rgba(0, 0, 0, 0.102) -167.12%, rgba(0, 0, 0, 0) 50.19%), #FFFFFF; box-shadow:3px 3px 15px rgba(0, 0, 0, 0.15); border-radius:50%; }
.about-box .contBox-2 .listbox > ul > li .circle .num { color:#ec1c24; font-size:14px; font-weight:600; }
.about-box .contBox-2 .listbox > ul > li .circle dt { margin-top:10px; color:#222; font-size:24px; font-weight:600; }
.about-box .contBox-2 .listbox > ul > li .circle dd { margin-top:20px; }
.about-box .contBox-2 .listbox > ul > li .circle dd .icon { min-height:55px; }
.about-box .contBox-2 .listbox > ul > li .circle dd .txt { margin-top:30px; color:#666; font-size:16px; font-weight:400; line-height:1.3; min-height:45px; }
.about-box .contBox-3 { margin-top:160px; }
.about-box .contBox-3 .listbox { margin-top:50px; }
.about-box .contBox-3 .listbox ul { display:flex; flex-wrap:wrap; gap:20px;}
.about-box .contBox-3 .listbox li { width:calc((100% - 60px) / 4); text-align:center; }
.about-box .contBox-3 .listbox li .icon { border:1px solid #e8e8e8; display:flex; align-items:center; justify-content:center; width:100%; height:110px; padding:0 10px; }
.about-box .contBox-3 .listbox li .icon img { max-width:100%; }
.about-box .contBox-0  { margin-top:80px; }
@media screen and (max-width:1850px){
    .about-box .top-box .txt-1 br,
    .about-box .contBox-1 .listbox > ul > li .txtbox dd br { display:none }
}
@media screen and (max-width:1760px){
    .about-box .contBox-2 .listbox > ul { gap:30px 60px; }
    .about-box .contBox-2 .listbox > ul > li { width:calc((100% - 120px) / 3); }
    .about-box .contBox-2 .listbox > ul > li:after { font-size:20px; left:-40px; }
    .about-box .contBox-2 .listbox > ul > li:nth-child(4):after,
    .about-box .contBox-2 .listbox > ul > li:nth-child(7):after { display:none }
    .about-box .contBox-2 .listbox > ul > li:nth-child(5):after { display:block }
    .about-box .contBox-2 .listbox > ul > li .circle .num { font-size:14px; }
    .about-box .contBox-2 .listbox > ul > li .circle dt { margin-top:8px; font-size:20px; }
    .about-box .contBox-2 .listbox > ul > li .circle dd .txt { margin-top:20px; }
}
@media screen and (max-width:1560px){
    .about-box .top-box .txt-1 { font-size:28px; }
    .about-box .contBox-1 .listbox > ul > li > div { width:100%; }
    .about-box .contBox-1 .listbox > ul > li .ibox { padding-right:0; }
    .about-box .contBox-1 .listbox > ul > li .txtbox { padding-left:0; padding-top:50px; }
    .about-box .contBox-1 .listbox > ul > li:nth-child(2n) .ibox { padding-right:0; padding-left:0; }
    .about-box .contBox-3 .listbox ul { gap:20px;}
    .about-box .contBox-3 .listbox li { width:calc((100% - 40px) / 3); }
}
@media screen and (max-width:1280px){
    .about-box .top-box .txt-1 { font-size:24px; } 
    .about-box .contBox-1 .listbox > ul > li > div { width:100%; }
    .about-box .contBox-1 .listbox > ul > li .txtbox { padding-top:40px; }
    .about-box .contBox-1 .listbox > ul > li .txtbox dt strong { font-size:16px; }
    .about-box .contBox-1 .listbox > ul > li .txtbox dt h4 { margin-top:8px; font-size:28px; }
    .about-box .contBox-1 .listbox > ul > li .txtbox dd { margin-top:25px; font-size:16px; }
    .about-box .contBox-2 .listbox > ul { gap:30px 60px; }
    .about-box .contBox-2 .listbox > ul > li { width:calc((100% - 60px) / 2); }
    .about-box .contBox-2 .listbox > ul > li:after { font-size:20px; left:-40px; }
    .about-box .contBox-2 .listbox > ul > li:nth-child(3):after,
    .about-box .contBox-2 .listbox > ul > li:nth-child(5):after,
    .about-box .contBox-2 .listbox > ul > li:nth-child(7):after { display:none }
    .about-box .contBox-2 .listbox > ul > li:nth-child(4):after { display:block }
    .about-box .contBox-2 .listbox > ul > li .circle .num { font-size:14px; }
    .about-box .contBox-2 .listbox > ul > li .circle dt { margin-top:8px; font-size:20px; }
    .about-box .contBox-2 .listbox > ul > li .circle dd .txt { margin-top:20px; }
    .about-box .contBox-3 .listbox ul { gap:20px;}
    .about-box .contBox-3 .listbox li { width:calc((100% - 20px) / 2); }
    .about-box .contBox-2,
    .about-box .contBox-3 { margin-top:100px; }
}
@media screen and (max-width:640px){
    .about-box .top-box .txt-1 { font-size:18px; text-align:justify; word-break:keep-all }
    .about-box .contBox-1 .listbox { margin-top:30px; }
    .about-box .contBox-1 .listbox > ul > li > div { width:100%; }
    .about-box .contBox-1 .listbox > ul > li:not(:last-child) { margin-bottom:40px; }
    .about-box .contBox-1 .listbox > ul > li .txtbox { padding-top:30px; }
    .about-box .contBox-1 .listbox > ul > li .txtbox dt strong { font-size:15px; }
    .about-box .contBox-1 .listbox > ul > li .txtbox dt h4 { margin-top:8px; font-size:22px; }
    .about-box .contBox-1 .listbox > ul > li .txtbox dd { margin-top:20px; font-size:15px; text-align:justify; word-break:keep-all }
    .about-box .contBox-2 .txt-top { margin-top:30px; }
    .about-box .contBox-2 .listbox > ul { gap:30px 60px; }
    .about-box .contBox-2 .listbox > ul > li { width:calc((100% - 60px) / 2); }
    .about-box .contBox-2 .listbox > ul > li:after { font-size:20px; left:-40px; }
    .about-box .contBox-2 .listbox > ul > li:nth-child(3):after,
    .about-box .contBox-2 .listbox > ul > li:nth-child(5):after,
    .about-box .contBox-2 .listbox > ul > li:nth-child(7):after { display:none }
    .about-box .contBox-2 .listbox > ul > li:nth-child(4):after { display:block }
    .about-box .contBox-2 .listbox > ul > li .circle .num { font-size:12px; }
    .about-box .contBox-2 .listbox > ul > li .circle dt { margin-top:7px; font-size:18px; }
    .about-box .contBox-2 .listbox > ul > li .circle dd { margin-top:12px; }
    .about-box .contBox-2 .listbox > ul > li .circle dd .icon { min-height:55px; }
    .about-box .contBox-2 .listbox > ul > li .circle dd .txt { margin-top:15px; font-size:15px; min-height:40px; }
    .about-box .contBox-3 .listbox { margin-top:30px; }
    .about-box .contBox-3 .listbox ul { gap:10px;}
    .about-box .contBox-3 .listbox li { width:calc((100% - 10px) / 2); }
    .about-box .contBox-3 .listbox li .icon { height:90px; padding:0 10px; }
    .about-box .contBox-2,
    .about-box .contBox-3 { margin-top:70px; }
}
@media screen and (max-width:540px){
    .about-box .contBox-2 .listbox > ul { gap:40px 0; }
    .about-box .contBox-2 .listbox > ul > li { max-width:270px; width:100%; margin:0 auto }
    .about-box .contBox-2 .listbox > ul > li:nth-child(2):after,
    .about-box .contBox-2 .listbox > ul > li:nth-child(3):after,
    .about-box .contBox-2 .listbox > ul > li:nth-child(4):after,
    .about-box .contBox-2 .listbox > ul > li:nth-child(5):after,
    .about-box .contBox-2 .listbox > ul > li:nth-child(6):after,
    .about-box .contBox-2 .listbox > ul > li:nth-child(7):after { display:block }
    .about-box .contBox-2 .listbox > ul > li:after { content:"\e905"; left:50%; top:-30px; transform:translate(-50%, 0);}
}


/* animation */
.about-box .top-box .txt-1,
.about-box .top-box .txt-2  { opacity:0; }
.about-box .top-box.subOn .txt-1 { animation:ani_4 0.8s 0.3s; animation-fill-mode:both; }
.about-box .top-box.subOn .txt-2 { animation:ani_4 0.8s 0.5s; animation-fill-mode:both; }
.about-box .contBox-1 .listbox > ul > li .imgbox:after { content:""; display:block; width:100%; height:100%; background:#fff; position:absolute; right:0; top:0; }
.about-box .contBox-1 .listbox > ul > li:nth-child(2n) .imgbox:after { left:0; }
.about-box .contBox-1 .listbox > ul > li.subOn .imgbox:after { animation:ani_w100 1.0s 0.5s; animation-fill-mode:both; }
.about-box .contBox-1 .listbox > ul > li .txtbox dt,
.about-box .contBox-1 .listbox > ul > li .txtbox dd { opacity:0; } 
.about-box .contBox-1 .listbox > ul > li.subOn .txtbox dt { animation:ani_3 0.8s 0.3s; animation-fill-mode:both; }
.about-box .contBox-1 .listbox > ul > li.subOn .txtbox dd { animation:ani_3 0.8s 0.5s; animation-fill-mode:both; }
.about-box .contBox-2 .txt-top { opacity:0; } 
.about-box .contBox-2 .txt-top.subOn { animation:ani_3 0.8s 0.8s; animation-fill-mode:both; }
.about-box .contBox-2 .listbox > ul > li { opacity:0; } 
.about-box .contBox-2 .listbox.subOn > ul > li:nth-child(1) { animation:ani_1 0.8s 0.2s; animation-fill-mode:both; }
.about-box .contBox-2 .listbox.subOn > ul > li:nth-child(2) { animation:ani_1 0.8s 0.4s; animation-fill-mode:both; }
.about-box .contBox-2 .listbox.subOn > ul > li:nth-child(3) { animation:ani_1 0.8s 0.6s; animation-fill-mode:both; }
.about-box .contBox-2 .listbox.subOn > ul > li:nth-child(4) { animation:ani_1 0.8s 0.8s; animation-fill-mode:both; }
.about-box .contBox-2 .listbox.subOn > ul > li:nth-child(5) { animation:ani_1 0.8s 1.0s; animation-fill-mode:both; }
.about-box .contBox-2 .listbox.subOn > ul > li:nth-child(6) { animation:ani_1 0.8s 1.2s; animation-fill-mode:both; }
.about-box .contBox-2 .listbox.subOn > ul > li:nth-child(7) { animation:ani_1 0.8s 1.4s; animation-fill-mode:both; }
.about-box .contBox-2 .listbox.subOn > ul > li:nth-child(8) { animation:ani_1 0.8s 1.6s; animation-fill-mode:both; }
.about-box .contBox-2 .listbox.subOn > ul > li:nth-child(9) { animation:ani_1 0.8s 1.8s; animation-fill-mode:both; }
.about-box .contBox-3 .listbox { opacity:0; } 
.about-box .contBox-3 .listbox.subOn { animation:ani_4 0.8s 0.4s; animation-fill-mode:both; }
@media screen and (max-width:1400px){
    .about-box .contBox-1 .listbox > ul > li:nth-child(2n) .imgbox:after { left:unset; right:0; }
}
@media screen and (max-width:540px){
    .about-box .contBox-2 .listbox.subOn > ul > li:nth-child(1) { animation:ani_4 0.8s 0.2s; animation-fill-mode:both; }
    .about-box .contBox-2 .listbox.subOn > ul > li:nth-child(2) { animation:ani_4 0.8s 0.4s; animation-fill-mode:both; }
    .about-box .contBox-2 .listbox.subOn > ul > li:nth-child(3) { animation:ani_4 0.8s 0.6s; animation-fill-mode:both; }
    .about-box .contBox-2 .listbox.subOn > ul > li:nth-child(4) { animation:ani_4 0.8s 0.8s; animation-fill-mode:both; }
    .about-box .contBox-2 .listbox.subOn > ul > li:nth-child(5) { animation:ani_4 0.8s 1.0s; animation-fill-mode:both; }
    .about-box .contBox-2 .listbox.subOn > ul > li:nth-child(6) { animation:ani_4 0.8s 1.2s; animation-fill-mode:both; }
    .about-box .contBox-2 .listbox.subOn > ul > li:nth-child(7) { animation:ani_4 0.8s 1.4s; animation-fill-mode:both; }
    .about-box .contBox-2 .listbox.subOn > ul > li:nth-child(8) { animation:ani_4 0.8s 1.6s; animation-fill-mode:both; }
    .about-box .contBox-2 .listbox.subOn > ul > li:nth-child(9) { animation:ani_4 0.8s 1.8s; animation-fill-mode:both; }
}


/* team */
.team-box .contBox { margin-top:160px; }
.team-box .contBox:first-child { margin-top:0; }
.team-box .contBox .ibox i { display:none; }
.team-box .contBox .ibox .imgbox { position:relative; overflow:hidden; }
.team-box .contBox .ibox .imgbox img { position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover; -o-object-fit:cover; }
.team-box .contBox .ibox .imgbox:before {content:""; display:block; padding-bottom:135.1%; }
.team-box .contBox .txtbox .title { color:#fff; font-size:18px; font-weight:400; }
.team-box .contBox .txtbox .title strong { font-size:35px; font-weight:700; display:inline-block; margin-right:15px; }
.team-box .contBox .txtbox .txt { color:#fff; font-size:18px; font-weight:300; line-height:1.6; word-break:keep-all }
.team-box .contBox .topBox .list { border-top:1px solid rgba(217,217,217,0.15); }
.team-box .contBox .txtbox .list dt { position:relative; color:#fff; font-size:20px; font-weight:600; display:inline-block }
.team-box .contBox .txtbox .list dt:before {content:""; display:block; position:absolute; right:-8px; top:-2px; width:3px; height:3px; background-color:#ec1c24; border-radius:3px; }
.team-box .contBox .txtbox .list dd { padding-top:20px; }
.team-box .contBox .txtbox .list dd li:not(:last-child) { margin-bottom:14px }
.team-box .contBox .txtbox .list dd li { position:relative; padding-left:12px; color:#fff; font-size:16px; font-weight:300; opacity:0.8; }
.team-box .contBox .txtbox .list dd li:before {content:""; display:block; position:absolute; left:0; top:6px; width:4px; height:1px; background-color:#fff; opacity:0.8;}
.team-box .contBox-1 { overflow:hidden }
.team-box .contBox-1 .topBox { position:relative; margin-top:50px; display:flex; flex-wrap:wrap; gap:0 40px; overflow:hidden }
.team-box .contBox-1 .topBox .ibox { width:calc(32.8% - 20px); cursor:pointer; }
.team-box .contBox-1 .topBox .txtbox { display:block; width:calc(67.2% - 20px); padding:4% 4% 0; background:url(/img/sub/team_img1_bg.jpg) center / cover; }
.team-box .contBox-1 .topBox .txtbox .t-list { margin-top:5%; padding-top:5%; display:flex; gap:0 8%; }
.team-box .contBox-1 .topBox .list { margin-top:5%; border-top:none; }
.team-box .contBox-1 .topBox .t-list { border-top:1px solid rgba(217,217,217,0.15); }
.team-box .contBox-1 .topBox.over .txtbox { display:block }
.team-box .contBox-1 .topBox .ibox .txt { opacity:0 }
.team-box .contBox-1 .topBox .txtbox .title { animation:ani_3 0.5s 0.2s; animation-fill-mode:both; }
.team-box .contBox-1 .topBox .txtbox .list .txt { animation:ani_4 0.5s 0.5s; animation-fill-mode:both; }
.team-box .contBox-1 .topBox .txtbox .list dl { animation:ani_4 0.5s 0.7s; animation-fill-mode:both; }
.team-box .contBox-n .topBox .txtbox { display:none }
.team-box .contBox .listbox { margin-top:50px; }
.team-box .contBox .listbox > ul { display:flex; flex-wrap:wrap; gap:40px; }
.team-box .contBox .listbox > ul > li { position:relative; width:calc((100% - 80px) / 3); overflow:hidden; cursor:pointer; }
.team-box .contBox .listbox > ul > li .ibox { position:relative; filter:blur(0); transition:all .3s; }
.team-box .contBox .listbox > ul > li .ibox .txt { position:absolute; bottom:6%; left:0; width:100%; text-align:center; color:#fff; font-size:18px; font-weight:300; opacity:1; transition:all .3s; }
.team-box .contBox .listbox > ul > li .ibox .txt strong { color:#fff; font-size:24px; font-weight:700; display:block; margin-top:10px; }
.team-box .contBox .listbox > ul > li .txtbox { opacity:0; display:block; position:absolute; left:0; top:0; z-index:-1; width:100%; height:100%; padding:50px 45px 150px 45px; transition:all .3s; }
.team-box .contBox .listbox > ul > li .txtbox .title { opacity:0; border-bottom:1px solid rgba(217,217,217,0.15); padding-bottom:9%; margin-bottom:9%; color:#fff; font-size:18px; font-weight:400; }
.team-box .contBox .listbox > ul > li .txtbox .title strong { font-size:28px; font-weight:700; display:inline-block; margin-right:10px; }
.team-box .contBox .listbox > ul > li .txtbox .list .box { position:relative; overflow:auto; padding-right:10px; }
.team-box .contBox .listbox > ul > li .txtbox .list .box:before {content:""; display:block; position:absolute; right:0; top:0; width:1px; height:100%; background-color:#d9d9d9; opacity:0.15; }
.team-box .contBox .listbox > ul > li .txtbox .list .txt { color:#fff; font-size:18px; font-weight:300; line-height:1.6; padding-top:10px; word-break:keep-all }
.team-box .contBox .listbox > ul > li .txtbox .list dl:not(:last-child) { margin-bottom:35px; }
.team-box .contBox .listbox > ul > li:hover .txtbox { opacity:1; display:block; z-index:3; background:rgba(0,0,0,0.5); }
.team-box .contBox .listbox > ul > li:hover .ibox { filter:blur(5px); background: linear-gradient(0deg, rgba(0, 0, 0, 0.5) 23.37%, rgba(0, 0, 0, 0) 37.52%), url(1J7A3562 1.png); filter: blur(10px);}
.team-box .contBox .listbox > ul > li:hover .ibox .txt { opacity:0 }
.team-box .contBox .listbox > ul > li:hover .txtbox .title { animation:ani_3 0.5s 0.2s; animation-fill-mode:both; }
.team-box .contBox .listbox > ul > li:hover .txtbox .list .txt { animation:ani_4 0.5s 0.5s; animation-fill-mode:both; }
.team-box .contBox .listbox > ul > li:hover .txtbox .list dl { animation:ani_4 0.5s 0.7s; animation-fill-mode:both; }
.team-box .contBox .over-box { display:none; cursor:pointer; }
@media screen and (max-width:1900px){
    .team-box .contBox .txtbox .top dt { font-size:18px; }
    .team-box .contBox .txtbox .top dt strong { font-size:30px; margin-right:12px; }
    .team-box .contBox .txtbox .top dd { font-size:16px; }
    .team-box .contBox-1 .topBox .txtbox { padding:30px 30px 100px 30px; }
    .team-box .contBox-1 .topBox .txtbox .list { margin-top:4%; }
    .team-box .contBox-1 .topBox .txtbox .t-list { margin-top:4%; padding-top:4%; gap:0 6%; }
    .team-box .contBox-1 .txtbox .txt { font-size:16px; }
}
@media screen and (max-width:1750px){
    .team-box .contBox .listbox > ul { gap:30px; }
    .team-box .contBox .listbox > ul > li { width:calc((100% - 60px) / 3); }
    .team-box .contBox .listbox > ul > li .txtbox { padding:30px 30px 130px 30px; }
    .team-box .contBox-1 .topBox .t-list { flex-wrap:wrap; }
    .team-box .contBox-1 .topBox .t-list dl { width:40%; padding:10px 10px 20px 10px; }
    .team-box .contBox-1 .topBox .txtbox .box { overflow:auto; overflow-x:hidden !important; }
}

@media screen and (max-width:1400px){
    .team-box .contBox .listbox > ul { gap:30px; }
    .team-box .contBox .listbox > ul > li { width:calc((100% - 30px) / 2); }
    .team-box .contBox-1 .topBox { width:100%; gap:30px;  }
    .team-box .contBox-1 .topBox .ibox { width:calc(50% - 15px); }
    .team-box .contBox-1 .topBox .txtbox { width:calc(50% - 15px); }
    .team-box .contBox-1 .topBox .t-list dl { width:100%; }
}
@media screen and (max-width:1280px){
    .team-box .contBox .txtbox .top dt { font-size:17px; }
    .team-box .contBox .txtbox .top dt strong { font-size:30px; margin-right:12px; }
    .team-box .contBox .txtbox .top dd { font-size:17px; }
    .team-box .contBox .txtbox .list dt { font-size:19px; }
    .team-box .contBox .txtbox .list dt:before { right:-8px; top:-2px; }
    .team-box .contBox .txtbox .list dd { padding-top:15px; }
    .team-box .contBox .txtbox .list dd li:not(:last-child) { margin-bottom:12px }
    .team-box .contBox .txtbox .list dd li { padding-left:12px; font-size:16px; }
    .team-box .contBox .txtbox .list dd li:before { left:0; top:6px; width:4px; }
    .team-box .contBox .listbox { margin-top:40px; }
    .team-box .contBox-1 .topBox .txtbox .txt,
    .team-box .contBox .listbox > ul > li .ibox .txt { font-size:17px; }
    .team-box .contBox-1 .topBox .txtbox .txt strong,
    .team-box .contBox .listbox > ul > li .ibox .txt strong { font-size:22px; margin-top:10px; }
    .team-box .contBox-1 .topBox .txtbox,
    .team-box .contBox .listbox > ul > li .txtbox { padding:25px 25px 110px 25px; }
    .team-box .contBox-1 .txtbox .title,
    .team-box .contBox .listbox > ul > li .txtbox .title { padding-bottom:8%; margin-bottom:8%; font-size:17px; }
    .team-box .contBox-1 .txtbox .title strong,
    .team-box .contBox .listbox > ul > li .txtbox .title strong { font-size:24px; margin-right:10px; }
    .team-box .contBox .listbox > ul > li .txtbox .list .box { padding-right:10px; }
    .team-box .contBox-1 .txtbox .txt,
    .team-box .contBox .listbox > ul > li .txtbox .list .txt { font-size:17px; padding-top:8px; }
    .team-box .contBox-1 .topBox .txtbox .list dl { margin-top:30px; }
    .team-box .contBox .listbox > ul > li .txtbox .list dl:not(:last-child) { margin-bottom:30px; }
}
@media screen and (max-width:1024px){
    .team-box .contBox .over-box { display:block }
    .team-box .contBox-1 .topBox { width:calc(50% - 15px); }
    .team-box .contBox-1 .topBox .ibox { width:100%; }
    .team-box .contBox-1 .topBox .txtbox { display:none; position:absolute; left:0; top:0; width:100%; height:100%; z-index:3; padding:30px 30px 130px 30px; transition:all .3s; background:none }
    .team-box .contBox-1 .topBox .t-list { border-top:none; }
    .team-box .contBox-1 .txtbox .title { padding-bottom:9%; margin-bottom:9%; border-bottom:1px solid rgba(217,217,217,0.15); }
    .team-box .contBox-1 .topBox > .txtbox { display:none !important; opacity:0; }
    .team-box .contBox-1 .topBox .txtbox .t-list { margin-top:0; padding-top:0; display:flex; flex-wrap:wrap; gap:0; }
    .team-box .contBox-1 .topBox .txtbox .t-list dl { width:100%; padding:0; }
    .team-box .contBox-1 .topBox .txtbox .ibox { filter:blur(0); transition:all .3s; }
    .team-box .contBox-1 .topBox .txtbox .box { position:relative; overflow:auto; overflow-x:hidden !important; padding-right:10px; }
    .team-box .contBox-1 .topBox .txtbox .txt { padding-top:10px;  }
    .team-box .contBox-1 .topBox .txtbox .list dl { margin-top:35px; }
    .team-box .contBox-1 .topBox:hover .txtbox { display:block; background:rgba(0,0,0,0.5); }
    .team-box .contBox-1 .topBox:hover .ibox { filter:blur(5px); background: linear-gradient(0deg, rgba(0, 0, 0, 0.5) 23.37%, rgba(0, 0, 0, 0) 37.52%), url(1J7A3562 1.png); filter: blur(10px);}

    .team-box .contBox { margin-top:100px; overflow:hidden }
    .team-box .contBox .listbox > ul > li .txtbox { padding:40px 40px 130px 40px; }
    .team-box .contBox-1 .topBox .ibox { margin:0 auto; }
    .team-box .contBox .ibox i { display:block; position:absolute; top:4%; right:4%; color:#ec1c24; font-size:22px; opacity:1; z-index:3; transition:all .3s; }
    .team-box .contBox-1 .topBox .txtbox { padding:40px; }
    .team-box .contBox .listbox > ul > li:hover .ibox i,
    .team-box .contBox .over-box:hover .ibox i { opacity:0; }
}
@media screen and (max-width:760px){
    .team-box .contBox-1 .topBox .txtbox,
    .team-box .contBox .listbox > ul > li .txtbox { padding:30px 25px 110px 25px; }
}
@media screen and (max-width:640px){
    .team-box .contBox { margin-top:60px; }
    .team-box .contBox .txtbox .top dt { font-size:16px; }
    .team-box .contBox .txtbox .top dt strong { font-size:24px; margin-right:10px; }
    .team-box .contBox .txtbox .top dd { font-size:15px; }
    .team-box .contBox .txtbox .list dt { font-size:17px; }
    .team-box .contBox .txtbox .list dt:before { right:-8px; top:-2px; }
    .team-box .contBox .txtbox .list dd { padding-top:12px; }
    .team-box .contBox .txtbox .list dd li:not(:last-child) { margin-bottom:10px }
    .team-box .contBox .txtbox .list dd li { padding-left:10px; font-size:15px; }
    .team-box .contBox .txtbox .list dd li:before { left:0; top:6px; width:3px; }
    .team-box .contBox .listbox { margin-top:30px; }
    .team-box .contBox .listbox > ul { gap:20px; }
    .team-box .contBox .listbox > ul > li { width:calc((100% - 20px) / 2); }
    .team-box .contBox-1 .topBox .txtbox .txt,
    .team-box .contBox .listbox > ul > li .ibox .txt { font-size:16px; }
    .team-box .contBox-1 .topBox .txtbox .txt strong,
    .team-box .contBox .listbox > ul > li .ibox .txt strong { font-size:20px; margin-top:10px; }
    .team-box .contBox-1 .topBox .txtbox,
    .team-box .contBox .listbox > ul > li .txtbox { padding:35px 25px 120px 25px; }
    .team-box .contBox-1 .txtbox .title,
    .team-box .contBox .listbox > ul > li .txtbox .title { padding-bottom:7%; margin-bottom:7%; font-size:16px; }
    .team-box .contBox-1 .txtbox .title strong,
    .team-box .contBox .listbox > ul > li .txtbox .title strong { font-size:22px; margin-right:10px; }
    .team-box .contBox .listbox > ul > li .txtbox .list .box { padding-right:10px; }
    .team-box .contBox-1 .txtbox .txt,
    .team-box .contBox .listbox > ul > li .txtbox .list .txt { font-size:15px; padding-top:6px; }
    .team-box .contBox-1 .topBox .txtbox .list dl { margin-top:25px;  }
    .team-box .contBox .listbox > ul > li .txtbox .list dl:not(:last-child) { margin-bottom:25px; }
}
@media screen and (max-width:520px){
    .team-box .contBox .topBox,
    .team-box .contBox .listbox { padding:0 0; }
    .team-box .contBox .listbox > ul { gap:20px; }
    .team-box .contBox .listbox > ul > li { width:100%; }
    .team-box .contBox-1 .topBox { width:100%; }
}


/* animation */
.team-box .contBox-1 .topBox .ibox { opacity:0; }
.team-box .contBox-1 .topBox.on .ibox { animation:ani_3 0.5s 0.2s; animation-fill-mode:both; }
.team-box .contBox .listbox > ul > li { opacity:0; }
.team-box .contBox .listbox > ul > li.subOn { animation:ani_3 0.5s 0.5s; animation-fill-mode:both; }

.os-theme-dark > .os-scrollbar, .os-theme-light > .os-scrollbar { padding:0; }
.os-theme-dark > .os-scrollbar-vertical, .os-theme-light > .os-scrollbar-vertical { width:1px; }
.os-theme-dark > .os-scrollbar > .os-scrollbar-track > .os-scrollbar-handle { background:#ec1c24; width:1px; border-radius:0 }
.os-theme-dark.os-host-transition > .os-scrollbar > .os-scrollbar-track > .os-scrollbar-handle.active, 
.os-theme-light.os-host-transition > .os-scrollbar > .os-scrollbar-track > .os-scrollbar-handle.active,
.os-theme-dark > .os-scrollbar:hover > .os-scrollbar-track > .os-scrollbar-handle,
.os-theme-dark > .os-scrollbar:hover > .os-scrollbar-track > .os-scrollbar-handle.active { background:#ec1c24; }


/* portfolio */
.portfolio-box .contBox { margin-top:160px; }
.portfolio-box .contBox:first-child { margin-top:0; }
.portfolio-box .contBox .listbox { margin-top:50px; }
.portfolio-box .funds-list .listbox > ul { display:flex; flex-wrap:wrap; gap:50px; }
.portfolio-box .funds-list .listbox > ul > li { position:relative; width:calc((100% - 100px) / 3); border:1px solid #ccc; }
.portfolio-box .funds-list .listbox > ul > li .imgbox { position:relative; overflow:hidden; }
.portfolio-box .funds-list .listbox > ul > li .imgbox:before {content:""; display:block; padding-bottom:62.8%; }
.portfolio-box .funds-list .listbox > ul > li .imgbox img { position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover; -o-object-fit:cover; transition:all .3s; }
.portfolio-box .funds-list .listbox > ul > li .txtbox { height:123px; padding:0 30px; display:flex; align-items:center; border-top:1px solid #ccc;}
.portfolio-box .funds-list .listbox > ul > li .txtbox dt { color:#000; font-size:22px; font-weight:700; line-height:1.3; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; }
.portfolio-box .funds-list .listbox > ul > li .txtbox dd { margin-top:10px; color:#222; font-size:16px; font-weight:400; line-height:1.3; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; }
.portfolio-box .funds-list .listbox > ul > li:hover .imgbox img { transform:scale(1.10); }
.portfolio-box .portfolio-list .listbox > ul { display:flex; flex-wrap:wrap; gap:50px; }
.portfolio-box .portfolio-list .listbox > ul > li { position:relative; width:calc((100% - 100px) / 3); border:1px solid #ccc; }
.portfolio-box .portfolio-list .listbox > ul > li .imgbox { position:relative; overflow:hidden;}
.portfolio-box .portfolio-list .listbox > ul > li .imgbox:before {content:""; display:block; padding-bottom:62.8%; }
.portfolio-box .portfolio-list .listbox > ul > li .imgbox .img-i {  padding:0 50px; position:absolute; left:0; top:0; width:100%; height:100%; display:flex; align-items:center; justify-content:center; }
.portfolio-box .portfolio-list .listbox > ul > li .imgbox .img-i img { max-width:100%; transition:all .3s; }
.portfolio-box .portfolio-list .listbox > ul > li .txtbox { position:relative; height:171px; padding:25px 30px 0; border-top:1px solid #ccc; background:#f9f9f9; }
.portfolio-box .portfolio-list .listbox > ul > li .txtbox dt { color:#000; font-size:22px; font-weight:700; line-height:1.3; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; }
.portfolio-box .portfolio-list .listbox > ul > li .txtbox dd { margin-top:10px; color:#222; font-size:16px; font-weight:400; line-height:1.3; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; word-break:keep-all !important; }
.portfolio-box .portfolio-list .listbox > ul > li .txtbox .stxt { position:absolute; right:30px; bottom:30px; color:#333; font-size:16px; font-weight:400; padding:0 8px; }
.portfolio-box .portfolio-list .listbox > ul > li .txtbox .stxt:before {content:""; display:block; position:absolute; left:0; top:50%; transform:translateY(-50%); background:#333; width:3px; height:3px; border-radius:3px; }
.portfolio-box .portfolio-list .listbox > ul > li .txtbox .stxt:after {content:""; display:block; position:absolute; right:0; top:50%; transform:translateY(-50%); background:#333; width:3px; height:3px; border-radius:3px; }
.portfolio-box .portfolio-list .listbox > ul > li .txtbox .link { opacity:0; position:absolute; left:50%; top:-20px; transform:translateX(-50%); transition:all .3s;}
.portfolio-box .portfolio-list .listbox > ul > li .txtbox .link a { width:164px; height:40px; color:#fff; font-size:16px; font-weight:400; background-color:#ec1c24; display:flex; align-items:center; justify-content:center; }
.portfolio-box .portfolio-list .listbox > ul > li .txtbox .link a i { display:inline-block; margin-left:15px; font-size:18px; }
.portfolio-box .portfolio-list .listbox > ul > li .complete { position:absolute; right:30px; top:30px; min-width:62px; height:25px; color:#333; font-size:12px; font-weight:600; border-radius:25px; background-color:#d9d9d9; display:flex; align-items:center; justify-content:center; }
.portfolio-box .portfolio-list .listbox > ul > li:hover .imgbox .img-i img { filter:brightness(0) invert(0.6); opacity:0.4; }
.portfolio-box .portfolio-list .listbox > ul > li:hover .txtbox .link { opacity:1 }
@media screen and (max-width:1600px){
    .portfolio-box .funds-list .listbox > ul,
    .portfolio-box .portfolio-list .listbox > ul { gap:40px; }
    .portfolio-box .funds-list .listbox > ul > li,
    .portfolio-box .portfolio-list .listbox > ul > li { width:calc((100% - 80px) / 3); }
    .portfolio-box .portfolio-list .listbox > ul > li .imgbox .img-i { padding:0 20px; }
    .portfolio-box .portfolio-list .listbox > ul > li .imgbox .img-i img { max-width:100%; }
}
@media screen and (max-width:1400px){
    .portfolio-box .funds-list .listbox > ul,
    .portfolio-box .portfolio-list .listbox > ul { gap:30px; }
    .portfolio-box .funds-list .listbox > ul > li,
    .portfolio-box .portfolio-list .listbox > ul > li { width:calc((100% - 60px) / 3); }
    .portfolio-box .portfolio-list .listbox > ul > li .complete { right:20px; top:20px; }
}
@media screen and (max-width:1280px){
    .portfolio-box .contBox .listbox { margin-top:40px; }
    .portfolio-box .funds-list .listbox > ul,
    .portfolio-box .portfolio-list .listbox > ul { gap:20px; }
    .portfolio-box .funds-list .listbox > ul > li,
    .portfolio-box .portfolio-list .listbox > ul > li { width:calc((100% - 20px) / 2); }
    .portfolio-box .funds-list .listbox > ul > li .txtbox { height:115px; padding:0 20px; }
    .portfolio-box .portfolio-list .listbox > ul > li .txtbox { height:160px; padding:25px 20px 0; }
    .portfolio-box .funds-list .listbox > ul > li .txtbox dt,
    .portfolio-box .portfolio-list .listbox > ul > li .txtbox dt { font-size:20px; }
    .portfolio-box .funds-list .listbox > ul > li .txtbox dd,
    .portfolio-box .portfolio-list .listbox > ul > li .txtbox dd { margin-top:10px; font-size:16px; }
    .portfolio-box .portfolio-list .listbox > ul > li .txtbox .stxt { right:20px; bottom:20px; }
}
@media screen and (max-width:640px){
    .portfolio-box .contBox .listbox { margin-top:30px; }
    .portfolio-box .funds-list .listbox > ul,
    .portfolio-box .portfolio-list .listbox > ul { gap:10px; }
    .portfolio-box .funds-list .listbox > ul > li,
    .portfolio-box .portfolio-list .listbox > ul > li { width:calc((100% - 10px) / 2); }
    .portfolio-box .funds-list .listbox > ul > li .txtbox { height:90px; padding:0 10px; }
    .portfolio-box .portfolio-list .listbox > ul > li .txtbox { height:130px; padding:20px 10px 0; }
    .portfolio-box .funds-list .listbox > ul > li .txtbox dt,
    .portfolio-box .portfolio-list .listbox > ul > li .txtbox dt { font-size:18px; }
    .portfolio-box .funds-list .listbox > ul > li .txtbox dd,
    .portfolio-box .portfolio-list .listbox > ul > li .txtbox dd { margin-top:8px; font-size:15px; }
    .portfolio-box .portfolio-list .listbox > ul > li .txtbox .stxt { right:10px; bottom:10px; font-size:15px; }
    .portfolio-box .portfolio-list .listbox > ul > li .imgbox .img-i { padding:0 20px; }
    .portfolio-box .portfolio-list .listbox > ul > li .complete { right:10px; top:10px; }
    .portfolio-box .portfolio-list .listbox > ul > li .txtbox .link { top:-15px; opacity:1 }
    .portfolio-box .portfolio-list .listbox > ul > li .txtbox .link a { width:130px; height:30px; font-size:14px; }
    .portfolio-box .portfolio-list .listbox > ul > li .txtbox .link a i { margin-left:8px; font-size:16px; }
}
@media screen and (max-width:520px){
    .portfolio-box .funds-list .listbox > ul,
    .portfolio-box .portfolio-list .listbox > ul { gap:10px; }
    .portfolio-box .funds-list .listbox > ul > li,
    .portfolio-box .portfolio-list .listbox > ul > li { width:100%; }
}

/* animation */
.portfolio-box .funds-list .listbox { opacity:0; }
.portfolio-box .funds-list .listbox.subOn { animation:ani_4 0.5s 0.5s; animation-fill-mode:both; }
.portfolio-box .portfolio-list .listbox { opacity:0; }
.portfolio-box .portfolio-list .listbox.subOn { animation:ani_4 0.5s 0.5s; animation-fill-mode:both; }

.contact-box { display:flex; flex-wrap:wrap; align-items:center; gap:20px; }
.contact-box .imgbox { position:relative; overflow:hidden; width:440px; }
.contact-box .imgbox:before {content:""; display:block; padding-bottom:146.5%; }
.contact-box .imgbox img { position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover; -o-object-fit:cover; }
.contact-box .mapbox { width:440px; }
.contact-box .mapbox > div,
.contact-box .mapbox .wrap_map { width:100% !important; height:100% !important; }
.contact-box .infobox { padding-left:40px; width:calc(100% - 880px - 40px) }
.contact-box .infobox h4.tit { color:#222; font-size:38px; font-weight:700; font-family:var(--font-family); }
.contact-box .infobox h4.tit span { font-weight:700; }
.contact-box .infobox > ul > li { padding:60px 30px 60px 20px; }
.contact-box .infobox > ul > li:not(:last-child) { border-bottom:1px solid #e8e8e8; }
.contact-box .infobox > ul > li .box { display:flex; flex-wrap:wrap; align-items:center; }
.contact-box .infobox > ul > li .box .icon { width:120px; }
.contact-box .infobox > ul > li .box .txtbox { width:calc(100% - 120px); }
.contact-box .infobox > ul > li .box .txtbox dt { color:#222; font-size:16px; font-weight:500; line-height:1.3; word-break:keep-all }
.contact-box .infobox > ul > li .box .txtbox dd { margin-top:10px; color:#222; font-size:15px; font-weight:300; line-height:1.3; word-break:keep-all }
.contact-box .infobox > ul > li .box .txtbox ul { display:flex; flex-wrap:wrap; gap:15px 20px; }
.contact-box .infobox > ul > li .box .txtbox li.full { width:100%; font-weight:500; font-size:15px; }
.contact-box .infobox > ul > li .box .txtbox li.full.txt  { font-weight:300; }
.contact-box .infobox > ul > li .box .txtbox li { position:relative; color:#222; font-size:16px; font-weight:300; line-height:1.3; word-break:keep-all }
.contact-box .infobox > ul > li .box .txtbox li a { font-weight:300; }
.contact-box .infobox > ul > li .box .txtbox li:before {content:""; display:block; position:absolute; left:-10px; top:50%; transform:translateY(-50%); background:#ddd; width:1px; height:13px; }
.contact-box .infobox > ul > li .box .txtbox li strong { font-weight:600; }
.contact-box .infobox > ul > li .box .txtbox li span { position:relative; font-weight:500; display:inline-block;}
.contact-box .infobox > ul > li .box .txtbox li span.t {  margin-left:20px; }
.contact-box .infobox > ul > li .box .txtbox li span.t:before {content:""; display:block; position:absolute; left:-10px; top:50%; transform:translateY(-50%); background:#ddd; width:1px; height:13px; }
.contact-box .infobox > ul > li .box .txtbox li span.br { display:none; }
.contact-box .infobox > ul > li .box .txtbox li:first-child:before { display:none; }
.contact-box .infobox > ul > li .box .txtbox li.full:before { display:none; }
@media screen and (max-width:1800px){
    .contact-box .infobox > ul > li { padding:50px 30px 50px 20px; }
    .contact-box .infobox > ul > li .box .txtbox li strong.t { display:block; margin-bottom:10px; }
    .contact-box .infobox > ul > li .box .txtbox li span.br { display:block; margin:5px 0; }
    .contact-box .infobox > ul > li .box .txtbox li span.t {  margin-left:0; }
    .contact-box .infobox > ul > li .box .txtbox li span.t:before { display:none; }
}
@media screen and (max-width:1600px){
    .contact-box .imgbox { width:440px; }
    .contact-box .imgbox:before {content:""; display:block; padding-bottom:146.5%; }
    .contact-box .imgbox img { position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover; -o-object-fit:cover; }
    .contact-box .mapbox { width:calc(100% - 440px - 20px); }
    .contact-box .infobox { padding-left:0; width:100%; margin-top:50px; }
    .contact-box .infobox > ul { display:flex; flex-wrap:wrap; }
    .contact-box .infobox > ul > li { width:50%; }
    .contact-box .infobox > ul > li:last-child { width:100%; }
    .contact-box .infobox > ul > li .box .txtbox li strong.t { display:inline-block; margin-bottom:0; }
    .contact-box .infobox > ul > li .box .txtbox li span.br { display:none; margin:5px 0; }
    .contact-box .infobox > ul > li .box .txtbox li span.t {  margin-left:20px; }
    .contact-box .infobox > ul > li .box .txtbox li span.t:before { display:block; }
}
@media screen and (max-width:1280px){
    .contact-box .imgbox { width:30%; }
    .contact-box .mapbox {width:calc(100% - 30% - 20px); }
    .contact-box .infobox h4.tit { font-size:30px; }
    .contact-box .infobox > ul > li { width:100%; }
    .contact-box .infobox > ul > li .box .icon { width:110px; }
    .contact-box .infobox > ul > li .box .txtbox { width:calc(100% - 110px)}
}
@media screen and (max-width:760px){
    .contact-box .infobox h4.tit { font-size:26px; }
    .contact-box .infobox > ul > li { padding:30px 10px; }
    .contact-box .infobox > ul > li .box .txtbox li strong.t { display:block; margin-bottom:10px; }
    .contact-box .infobox > ul > li .box .txtbox li span.br { display:block; margin:5px 0; }
    .contact-box .infobox > ul > li .box .txtbox li span.t {  margin-left:0; }
    .contact-box .infobox > ul > li .box .txtbox li span.t:before { display:none; }
}
@media screen and (max-width:520px){
    .contact-box { gap:10px; }
    .contact-box .imgbox { width:100%; height:120px; display:none }
    .contact-box .mapbox {width:100%; height:320px !important; }
    .contact-box .infobox { margin-top:30px; }
    .contact-box .infobox > ul > li .box .icon img { width:70% }
    .contact-box .infobox > ul > li .box .icon { width:70px; }
    .contact-box .infobox > ul > li .box .txtbox { width:calc(100% - 70px); }
}
@media screen and (max-width:440px){
    .contact-box .infobox > ul > li .box .icon { width:90px; }
    .contact-box .infobox > ul > li .box .txtbox { width:calc(100% - 90px); }
    .contact-box .infobox > ul > li .box .txtbox li { width:100%; }
    .contact-box .infobox > ul > li .box .txtbox li:before { display:none; }
}

/* animation */
.contact-box .imgbox:after { content:""; display:block; width:100%; height:100%; background:#fff; position:absolute; right:0; bottom:0; }
.contact-box .imgbox.subOn:after { animation:ani_w100 1.0s 0.5s; animation-fill-mode:both; }
.contact-box .mapbox { opacity:0; }
.contact-box .mapbox.subOn { animation:bgs3 0.8s 0.8s; animation-fill-mode:both; }
.contact-box .infobox,
.contact-box .infobox h4.tit { overflow:hidden }
.contact-box .infobox h4.tit span { display:block; opacity:0;}
.contact-box .infobox.subOn h4.tit span { animation:ani_3 0.8s 1.0s; animation-fill-mode:both; }
.contact-box .infobox > ul > li { opacity:0; }
.contact-box .infobox.subOn > ul > li:nth-child(1)  { animation:ani_2 0.8s 1.2s; animation-fill-mode:both; }
.contact-box .infobox.subOn > ul > li:nth-child(2)  { animation:ani_2 0.8s 1.4s; animation-fill-mode:both; }
.contact-box .infobox.subOn > ul > li:nth-child(3)  { animation:ani_2 0.8s 1.6s; animation-fill-mode:both; }
@media screen and (max-width:1600px){
    .contact-box .infobox.subOn h4.tit span { animation:ani_3 0.8s 0.4s; animation-fill-mode:both; }
    .contact-box .infobox > ul > li { opacity:0; }
    .contact-box .infobox.subOn > ul > li:nth-child(1)  { animation:ani_2 0.8s 0.6s; animation-fill-mode:both; }
    .contact-box .infobox.subOn > ul > li:nth-child(2)  { animation:ani_2 0.8s 0.8s; animation-fill-mode:both; }
    .contact-box .infobox.subOn > ul > li:nth-child(3)  { animation:ani_2 0.8s 1.0s; animation-fill-mode:both; }
}