@charset "utf-8";

/* =========================== PAGE */
#organization1004{position:relative;padding-bottom:100px;font-size:14px;letter-spacing:-.3px;line-height:1.5;color:#777}
#organization1004 .pl{white-space:pre-line}
#organization1004 *{word-break:keep-all}
#organization1004 .inner{max-width:var(--mainsize);margin:0 auto}
#organization1004 .inner > ul, li{list-style:none}
#organization1004 .inner .tit{text-align:center}
#organization1004 .inner h1{font-size:18px;font-weight:700;font-family:var(--e-font);color:var(--primary)}
#organization1004 .inner .tit h2{margin-top:25px;font-size:38px;font-weight:700;color:#000}
#organization1004 .org_wrap h2{position:relative;display:flex;justify-content:center;align-items:center;margin:70px auto 80px;width:170px;height:170px;border-radius:50%;text-align:center;font-size:22px;font-weight:700;color:#fff;background-color:var(--primary);animation:org_name 0.6s ease both;animation-delay:.3s}
#organization1004 .org_wrap h2::before{content:"";position:absolute;z-index:-2;top:0px;left:0px;width:100%;height:100%;border-radius:50%;filter:blur(25px);background-color:var(--primary)}
#organization1004 .org_wrap h2::after{content:"";position:absolute;z-index:-1;top:100%;left:50%;transform:translateX(-50%);width:0.5px;height:80px;background-color:#cccccc;animation:organization_ceo_line 0.8s ease both;animation-delay:.2s}
#organization1004 .org_list_node{position:relative;display:flex;justify-content:space-between;padding-top:40px}
#organization1004 .org_list_node:after{content:"";position:absolute;top:0px;left:50%;transform:translateX(-50%);width:calc(100% - (100% / 3 - 50px));height:1px;background-color:#ccc;animation:department_line_x 0.5s ease both;animation-delay:0.9s}
#organization1004 .org_list_node .department{position:relative;width:calc(100% / 3 - 50px)}
#organization1004 .org_list_node .department h3{position:relative;z-index:15;margin:auto;width:200px;height:80px;line-height:80px;border-radius:40px;transform:translateZ(0);text-align:center;font-size:20px;font-weight:700;color:rgb(255, 255, 255, 0.8);background-color:#bd9bdb;animation:org_name 0.7s ease both;animation-delay:1.2s}
#organization1004 .org_list_node .department h3:before{content:"";z-index:-1;position:absolute;top:-40px;left:50%;width:0.5px;height:40px;background-color:#ccc;animation:department_line_y 0.3s ease both;animation-delay:1.5s}
#organization1004 .org_list_node .department h3:after{content:"";z-index:-1;position:absolute;top:80px;left:50%;width:0.5px;height:30px;background-color:#ccc;animation:department_line_y_2 0.3s ease both;animation-delay:1.8s}
#organization1004 .org_list_node .group{position:relative;display:flex;align-items:flex-start;justify-content:space-between}
#organization1004 .org_list_node .group:after{content:"";position:absolute;top:30px;left:50%;transform:translateX(-50%);width:calc(100% - (100% / 3 - 10px));height:1px;background-color:#ccc;animation:group_line_x 0.6s ease both;animation-delay:2.1s}
#organization1004 .org_list_node .team{position:relative;width:calc(100% / 3 - 10px);text-align:center}
#organization1004 .org_list_node .team::after{content:"";position:absolute;z-index:-1;top:30px;left:50%;transform:translateX(-50%);width:0.5px;height:calc(100% - 30px);background-color:#ccc;animation:group_line_y 0.8s ease both;animation-delay:2.9s}
#organization1004 .org_list_node .section li+li{margin-top:20px}
#organization1004 .org_list_node h4{position:relative;padding:20px 0;margin:60px 0 30px;border:2px solid #bd9bdb;border-radius:15px;font-size:19px;font-weight:700;color:#bd9bdb;background-color:#fff;animation:org_name 0.8s ease both;animation-delay:2.9s}
#organization1004 .org_list_node h4::after{content:"";position:absolute;top:-4px;left:50%;transform:translateX(-50%);width:8px;height:8px;border-radius:50%;background-color:#bd9bdb}
#organization1004 .org_list_node h4::before{content:"";opacity:0.3;position:absolute;top:-12px;left:50%;transform:translateX(-50%);width:24px;height:24px;border-radius:50%;background-color:#bd9bdb}
#organization1004 .org_list_node .section li:first-child h5{position:relative;animation-delay:3s}
#organization1004 .org_list_node .section li:first-child h5:after{content:"";position:absolute;top:-2px;left:50%;transform:translateX(-50%);width:7px;height:7px;border-radius:50%;background-color:#ccc}
#organization1004 .org_list_node .section li:nth-child(2) h5{animation-delay:3.1s}
#organization1004 .org_list_node .section li:nth-child(3) h5{animation-delay:3.2s}
#organization1004 .org_list_node h5{padding:20px 0;border-radius:15px;font-size:18px;font-weight:500;color:#222;background-color:#f5f5f5;animation:org_name 0.8s ease both}

@keyframes org_name {0% {opacity:0;transform:scale(.8)} 100% {opacity:1;transform:none}}
@keyframes organization_ceo_line {0% {height:0px} 100% {height:80px}}
@keyframes department_line_x {0% {width:0px} 100% {width:calc(100% - (100% / 3 - 50px))}}
@keyframes department_line_x_1024 {0% {width:0px} 100% {width:calc(100% - (100% / 3 - 30px))}}
@keyframes department_line_y {0% {height:0px} 100% {height:40px}}
@keyframes department_line_y_2 {0% {height:0px} 100% {height:30px}}
@keyframes group_line_x {0% {width:0px} 100% {width:calc(100% - (100% / 3 - 10px))}}
@keyframes group_line_x_480 {0% {width:0px} 100% {width:100%}}
@keyframes group_line_y {0% {height:0px} 100% {height:calc(100% - 30px)}}
@keyframes border_line {0% {height:0px} 100% {height:315px}}
@keyframes border_line_390 {0% {height:0px} 100% {height:280px}}



@media(max-width:1024px){
#organization1004 .inner{margin:auto;width:95%}
#organization1004 .inner h1{font-size:16px}
#organization1004 .inner .tit h2{margin-top:20px;font-size:30px}
#organization1004 .org_wrap h2{width:150px;height:150px;font-size:19px}
#organization1004 .org_list_node:after{width:calc(100% - (100% / 3 - 30px));animation:department_line_x_1024 0.5s ease both;animation-delay:0.9s}
#organization1004 .org_list_node .department{width:calc(100% / 3 - 30px)}
#organization1004 .org_list_node .department h3{width:150px;height:60px;line-height:60px;font-size:17px}
#organization1004 .org_list_node .department h3:after{top:60px}
#organization1004 .org_list_node h4{padding:12px 0;font-size:15px;border-radius:10px}
#organization1004 .org_list_node h4::before{top:-10px;width:20px;height:20px}
#organization1004 .org_list_node h4::after{width:7px;height:7px}
#organization1004 .org_list_node h5{padding:12px 0;font-size:14px;border-radius:10px}
}
@media(max-width:768px){
#organization1004 .inner h1{font-size:15px}
#organization1004 .inner .tit h2{margin-top:15px;font-size:26px}
#organization1004 .org_wrap h2{margin:50px auto 70px;width:140px;height:140px;font-size:18px}
#organization1004 .org_wrap h2::after{display:none}
#organization1004 .org_list_node:after{display:none}
#organization1004 .org_list_node{flex-direction:column;padding-top:0px}
#organization1004 .org_list_node > li+li{margin-top:80px}
#organization1004 .org_list_node .department{width:100%}
#organization1004 .org_list_node .department h3{width:145px;height:55px;line-height:55px;font-size:16px}
#organization1004 .org_list_node .department h3:before{display:none}
#organization1004 .org_list_node .department h3:after{top:55px;width:1px}
}
@media(max-width:480px){
#organization1004 .inner h1{font-size:14px}
#organization1004 .inner .tit h2{margin-top:12px;font-size:23px}
#organization1004 .org_wrap h2{margin:40px auto 60px;width:130px;height:130px;font-size:16px;animation-delay:0.2s}
#organization1004 .org_list_node > li+li{margin-top:65px}
#organization1004 .org_list_node .department:after{content:"";position:absolute;top:83px;left:0px;width:1px;height:315px;background-color:#ccc;animation:border_line 0.8s ease both;animation-delay:1.8s}
#organization1004 .org_list_node .department:before{content:"";position:absolute;top:83px;right:0px;width:1px;height:315px;background-color:#ccc;animation:border_line 0.8s ease both;animation-delay:1.8s}
#organization1004 .org_list_node .department h3{width:140px;height:53px;line-height:53px;font-size:15px;animation-delay:0.6s}
#organization1004 .org_list_node .department h3:after{left:50%;top:53px;animation-delay:1s}
#organization1004 .org_list_node .group{padding:25px;margin-top:30px;height:315px}
#organization1004 .org_list_node .group:after{top:0px;width:100%;animation:group_line_x_480 0.6s ease both;animation-delay:1.3s}
#organization1004 .org_list_node .group:before{content:"";position:absolute;bottom:0px;left:50%;transform:translateX(-50%);width:100%;height:1px;background-color:#ccc;animation:group_line_x_480 0.6s ease both;animation-delay:2.3s}
#organization1004 .org_list_node .team{position:relative;padding-top:10px;overflow:hidden}
#organization1004 .org_list_node h4{margin:0 auto 30px}
}
@media(max-width:390px){
#organization1004 .inner h1{font-size:13px}
#organization1004 .inner .tit h2{margin-top:10px;font-size:21px}
#organization1004 .org_wrap h2{margin:40px auto 60px;width:120px;height:120px;font-size:15px}
#organization1004 .org_list_node > li+li{margin-top:55px}
#organization1004 .org_list_node .department:after{top:78px;animation:border_line_390 0.8s ease both;animation-delay:1.8s}
#organization1004 .org_list_node .department:before{top:78px;animation:border_line_390 0.8s ease both;animation-delay:1.8s}
#organization1004 .org_list_node .department h3{width:120px;height:48px;line-height:48px;font-size:14px}
#organization1004 .org_list_node .department h3:after{top:48px}
#organization1004 .org_list_node .group{padding:18px;height:280px}
#organization1004 .org_list_node .team{width:calc(100% / 3 - 7px)}
#organization1004 .org_list_node h4{padding:10px 0;margin-bottom:25px;border-radius:8px;font-size:14px}
#organization1004 .org_list_node h5{padding:10px 0;border-radius:8px;font-size:13px}
}