@charset "utf-8";
/* Generated by scripts/build_sub_modules.py from sub.css. Do not edit. */

.drBackUp-box1 { padding-bottom:110px; }
.drBackUp-box1 .subTitle .imgTit { margin-bottom:25px; }
.drBackUp-box1 .listbox { margin-top:50px; display:flex; flex-wrap:wrap; gap:0 20px;  }
.drBackUp-box1 .listbox .l-box { width:calc(33% - 10px); }
.drBackUp-box1 .listbox .r-box { width:calc(67% - 10px); background:#fff; border-radius:15px; height:535px; display:flex; align-items:center; justify-content:center; padding:0 50px; }
.drBackUp-box1 .listbox .r-box img { max-width:100%; }
.drBackUp-box1 .listbox .l-box li:not(:last-child) { margin-bottom:20px; }
.drBackUp-box1 .listbox .l-box li { height:165px; display:flex; align-items:center; background:#fff; border-radius:15px; padding-left:40px; }
.drBackUp-box1 .listbox .l-box li .icon { width:98px; height:98px; background:#f9f9f9; border-radius:98px; display:flex; align-items:center; justify-content:center; }
.drBackUp-box1 .listbox .l-box li .txtbox { word-break:keep-all; width:calc(100% - 98px); padding-left:30px; font-size:20px; font-weight:400; color:#222; line-height:1.5; letter-spacing:-0.02em; }
.drBackUp-box1 .listbox .l-box li .txtbox strong { font-weight:600; word-break:keep-all; }

.drBackUp-box1 .companyIntro .subTitle { max-width: 100%; }
.drBackUp-box1 .companyIntro .subTitle .imgTit { margin-bottom:25px; width: 100%; height: 100%; }
.drBackUp-box1 .companyIntro .listbox { margin-top:50px; display:flex; flex-wrap:wrap; gap:0 20px;  }
.drBackUp-box1 .companyIntro .listbox .l-box { width:calc(60% - 10px); }
.drBackUp-box1 .companyIntro .listbox .r-box { width:calc(40% - 10px); background:#fff; border-radius:15px; height:535px; display:flex; align-items:center; justify-content:center; padding:0 50px; }
.drBackUp-box1 .companyIntro .listbox .r-box img { max-width:100%; }
.drBackUp-box1 .companyIntro .listbox .l-box li:not(:last-child) { margin-bottom:20px; }
.drBackUp-box1 .companyIntro .listbox .l-box li { height:165px; display:flex; align-items:center; background:#fff; border-radius:15px; padding-left:40px; }
.drBackUp-box1 .companyIntro .listbox .l-box li .icon { width:98px; height:98px; background:#f9f9f9; border-radius:98px; display:flex; align-items:center; justify-content:center; }
.drBackUp-box1 .companyIntro .listbox .l-box li .txtbox { word-break:keep-all; width:calc(100% - 98px); padding-left:30px; font-size:20px; font-weight:400; color:#222; line-height:1.6; letter-spacing:-0.01em; }
.drBackUp-box1 .companyIntro .listbox .l-box li .txtbox strong { color: var(--mainColor); font-weight:600; word-break:keep-all; border-bottom: 2px solid var(--mainColor); line-height: 2; }
.drBackUp-box1 .companyIntro .listbox .l-box li .txtbox span { font-weight:600; line-height: 2; letter-spacing: 2px; }

.drBackUp-box2 { padding:140px 0; background:#fff; }
.drBackUp-box2 .listbox { margin-top:50px; }
.drBackUp-box2 .listbox ul { display:flex; flex-wrap:wrap; gap:20px; }
.drBackUp-box2 .listbox li { width:calc((100% - 60px) / 4 ); height:354px; border:1px solid #ddd; border-radius:10px; background:#fff; display:flex; justify-content:center; text-align:center; padding-top:47px; }
.drBackUp-box2 .listbox li .icon { margin:0 auto; width:180px; height:180px; background:#f9f9f9; border-radius:180px; display:flex; align-items:center; justify-content:center; }
.drBackUp-box2 .listbox li .txtbox { word-break:keep-all; margin-top:30px; font-size:20px; font-weight:400; color:#222; line-height:1.5; letter-spacing:-0.02em; }
.drBackUp-box3 { padding:140px 0; }
.drBackUp-box3 .listbox { margin-top:50px; position:relative; z-index:2; }
.drBackUp-box3 .listbox ul { display:flex; flex-wrap:wrap; gap:20px; }
.drBackUp-box3 .listbox li { width:calc((100% - 40px) / 3 ); height:163px; border:1px solid #ddd; border-radius:15px; background:#fff; display:flex; align-items:center; padding-left:33px; }
.drBackUp-box3 .listbox .icon { width:102px; height:102px; background:#f9f9f9; border-radius:102px; display:flex; align-items:center; justify-content:center; }
.drBackUp-box3 .listbox .txtbox { word-break:keep-all; width:calc(100% - 102px); padding-left:22px; font-size:18px; font-weight:400; color:#222; line-height:1.6; letter-spacing:-0.02em; }
.drBackUp-box3 .listbox .txtbox h3,
.drBackUp-box3 .listbox .txtbox strong { font-weight:700; word-break:keep-all; }
.drBackUp-box3.netorage-feature-cards .listbox li { padding-right:33px; }
.drBackUp-box3.netorage-feature-cards .listbox .txtbox { min-width:0; }
@media screen and (max-width:1500px){
    .drBackUp-box1 .subTitle .imgTit img { height:84px; }
    .drBackUp-box1 .companyIntro .subTitle .imgTit img { height:100%; }
}
@media screen and (max-width:1280px){
    .drBackUp-box1 .subTitle .imgTit { margin-bottom:20px; }
    .drBackUp-box1 .subTitle .imgTit img { height:75px; }
    .drBackUp-box1 .listbox .l-box { width:calc(40% - 10px); }
    .drBackUp-box1 .listbox .r-box { width:calc(60% - 10px); }
    .drBackUp-box1 .listbox .l-box li { padding-left:25px; }
    .drBackUp-box1 .listbox .l-box li .txtbox { font-size:19px; }

    .drBackUp-box1 .companyIntro .subTitle .imgTit { margin-bottom:20px; }
    .drBackUp-box1 .companyIntro .subTitle .imgTit img { height:100%; }
    .drBackUp-box1 .companyIntro .listbox .l-box li { padding-left:25px; }
    .drBackUp-box1 .companyIntro .listbox .l-box li .txtbox { font-size:18px; }

    .drBackUp-box2 .listbox li { padding-top:42px; }
    .drBackUp-box2 .listbox li .icon { width:160px; height:160px; }
    .drBackUp-box2 .listbox li .txtbox { font-size:19px; }
    .drBackUp-box3 .listbox li { padding-left:20px; }
    .drBackUp-box3 .listbox .icon { width:95px; height:95px; }
    .drBackUp-box3 .listbox .txtbox { width:calc(100% - 95px); padding-left:20px; }
    .drBackUp-box3.netorage-feature-cards .listbox li { padding-right:20px; }
}
@media screen and (max-width:1024px){
    .drBackUp-box1 { padding-bottom:100px; }
    .drBackUp-box1 .subTitle .imgTit { margin-bottom:20px; }
    .drBackUp-box1 .subTitle .imgTit img { height:75px; }
    .drBackUp-box1 .listbox { margin-top:40px; }
    .drBackUp-box1 .listbox .l-box { width:calc(40% - 10px); }
    .drBackUp-box1 .listbox .r-box { width:calc(60% - 10px); }
    .drBackUp-box1 .listbox .l-box li { padding:0 20px; }
    .drBackUp-box1 .listbox .l-box li .icon { width:90px; height:90px; }
    .drBackUp-box1 .listbox .l-box li .txtbox { width:calc(100% - 90px); padding-left:20px; font-size:18px; }
    .drBackUp-box1 .listbox .l-box li .txtbox br { display:none }

    .drBackUp-box1 .companyIntro .subTitle .imgTit { margin-bottom:20px; }
    .drBackUp-box1 .companyIntro .subTitle .imgTit img { height:100%; }
    .drBackUp-box1 .companyIntro .listbox .l-box li { padding-left:25px; }
    .drBackUp-box1 .companyIntro .listbox .l-box li .txtbox { font-size:16px; }
    .drBackUp-box1 .companyIntro .listbox .l-box li .txtbox br { display: inline-block; }

    .drBackUp-box2 { padding:100px 0; }
    .drBackUp-box2 .listbox { margin-top:40px; }
    .drBackUp-box2 .listbox li { width:calc((100% - 20px) / 2 ); padding:30px 20px; height:auto; }
    .drBackUp-box2 .listbox li .icon { width:160px; height:160px; }
    .drBackUp-box2 .listbox li .txtbox { font-size:18px; }
    .drBackUp-box2 .listbox .txtbox br { display:none }
    .drBackUp-box3 { padding:100px 0; }
    .drBackUp-box3 .listbox { margin-top:40px; }
    .drBackUp-box3 .listbox li { padding:0 20px; }
    .drBackUp-box3 .listbox li { width:calc((100% - 20px) / 2 ); padding:20px; height:auto; }
    .drBackUp-box3 .listbox .icon { width:95px; height:95px; }
    .drBackUp-box3 .listbox .txtbox { width:calc(100% - 95px); padding:0 20px; font-size:16px; }
    .drBackUp-box3 .listbox .txtbox br { display:none }
}
@media screen and (max-width:960px){
    .drBackUp-box1 .listbox .l-box { width:100%; }
    .drBackUp-box1 .listbox .l-box li:not(:last-child) { margin-bottom:0; }
    .drBackUp-box1 .listbox .l-box ul { display:flex; gap:0 20px; }
    .drBackUp-box1 .listbox .r-box { width:100%; margin-top:20px; padding:40px 20px; height:auto; }

    .drBackUp-box1 .companyIntro .listbox .l-box { width:100%; margin-top:20px; padding:40px 15px; height:auto; background-color: #fff; }
    .drBackUp-box1 .companyIntro .listbox .l-box li { display: block; width: 100%; background: none; padding: 0 5px; }
    .drBackUp-box1 .companyIntro .listbox .l-box li .txtbox { font-size:15px; width: 100%; padding: 10px; line-height: 1.5; }
    .drBackUp-box1 .companyIntro .listbox .l-box li .txtbox br { display: inline-block; }
    .drBackUp-box1 .companyIntro .listbox .r-box { width:100%; }
    .drBackUp-box1 .companyIntro .listbox .l-box li .icon { display: none; }
    .drBackUp-box1 .companyIntro .listbox .l-box li .txtbox strong { line-height: 4; font-size: 17px; }
}
@media screen and (max-width:860px){
    .drBackUp-box1 .listbox .l-box ul { display:flex; gap:10px; }
    .drBackUp-box1 .listbox .l-box li { padding:20px; height:auto; }
    .drBackUp-box1 .listbox .l-box li .icon { width:84px; height:84px; }
    .drBackUp-box1 .listbox .l-box li .icon img { width:40px; }
    .drBackUp-box1 .listbox .r-box { margin-top:10px; }
    .drBackUp-box2 .listbox ul,
    .drBackUp-box3 .listbox ul { gap:10px; }
    .drBackUp-box2 .listbox li,
    .drBackUp-box3 .listbox li { width:calc((100% - 10px) / 2 ); }
    .drBackUp-box2 .listbox li .icon { width:120px; height:120px; }
    .drBackUp-box2 .listbox li .icon img { width:55px; }
}
@media screen and (max-width:760px){
    .drBackUp-box1 .listbox .l-box ul { flex-wrap:wrap; }
    .drBackUp-box1 .listbox .l-box li { width:100%; }
    .drBackUp-box3 .listbox li { width:100%; }
}
@media screen and (max-width:640px){
    .drBackUp-box1 { padding-bottom:80px; }
    .drBackUp-box1 .subTitle .imgTit img { height:60px; }
    .drBackUp-box1 .listbox { margin-top:30px; }
    .drBackUp-box1 .listbox .l-box li .txtbox { font-size:16px; }
    .drBackUp-box2 { padding:80px 0; }
    .drBackUp-box2 .listbox { margin-top:30px; }
    .drBackUp-box2 .listbox li .txtbox { font-size:16px; }
    .drBackUp-box3 { padding:80px 0; }
    .drBackUp-box3 .listbox { margin-top:30px; }
    .drBackUp-box3 .listbox .txtbox { font-size:14px; }
}

/* animation */
.drBackUp-box1 .listbox,
.drBackUp-box2 .listbox,
.drBackUp-box3 .listbox { opacity:0; }
.drBackUp-box1.subOn .listbox,
.drBackUp-box2.subOn .listbox,
.drBackUp-box3.subOn .listbox { animation:ani_4 0.8s 0.4s; animation-fill-mode:both; }

/*** global ***/
.global-box > div:nth-child(1) { padding-bottom:110px; }
.global-velocity { padding:140px 0; }
.global-velocity * { word-break:keep-all; }
.global-velocity.bg { background:#fff; }
.global-velocity .listbox { margin-top:50px; }
.global-velocity.velocity-box1 .listbox ul { display:flex; flex-wrap:wrap; gap:20px; }
.global-velocity.velocity-box1 .listbox li { width:calc((100% - 40px) / 3); border-radius:10px; border:1px solid #ddd; background:#f9f9f9; padding:33px 10px 33px 33px; display:flex; align-items:center; }
.global-velocity.velocity-box1 .listbox li .icon { width:98px; height:98px; border-radius:98px; background:#fff; display:flex; align-items:center; justify-content:center; }
.global-velocity.velocity-box1 .listbox li .txtbox { width:calc(100% - 98px); padding-left:38px; font-size:18px; font-weight:400; color:#222; line-height:1.5; letter-spacing:-0.02em; }
.global-velocity.velocity-box1 .listbox li .txtbox strong { font-weight:600; }
.global-velocity.velocity-box1 .imgbox { margin:50px auto 0; text-align:center; }
.global-velocity.velocity-box1 .imgbox img { max-width:100%; }
.global-velocity.velocity-box3 .subTitle .txtbox { margin-top:10px; }
.global-velocity.velocity-box3 .listbox { margin:140px 0; }
.global-velocity.velocity-box3 .listbox .v-box { position:relative; margin:0 auto; max-width:540px; height:540px; display:flex; align-items:center; justify-content:center; }
.global-velocity.velocity-box3 .listbox .v-box:before { content:''; display:block; z-index:5; position:absolute; left:0; top:0; width:100%; height:100%; background:url(../img/global/velocity_line.png) no-repeat right center; }
.global-velocity.velocity-box3 .listbox .v-box .circle-box { display:flex; align-items:center; justify-content:center; text-align:center; background:var(--mainColor); width:300px; height:300px; border-radius:300px; }
.global-velocity.velocity-box3 .listbox .v-box .circle-box .box { font-size:32px; font-weight:700; color:#fff; line-height:1.5; letter-spacing:-0.02em; }
.global-velocity.velocity-box3 .listbox .v-box .circle { z-index:8; position:absolute; display:flex; align-items:center; justify-content:center; text-align:center; background:#fff; width:200px; height:200px; border-radius:200px; border:1px solid var(--mainColor); filter:drop-shadow(0px 0px 20px rgba(5, 105, 255, 0.25)); }
.global-velocity.velocity-box3 .listbox .v-box .circle .txtbox { margin-top:15px; font-size:19px; font-weight:600; color:#222; line-height:1.5; letter-spacing:-0.02em;}
.global-velocity.velocity-box3 .listbox .v-box .circle-1 { right:-75px; top:-35px; }
.global-velocity.velocity-box3 .listbox .v-box .circle-2 { right:-75px; bottom:-35px; }
.global-velocity.velocity-box3 .listbox .v-box .circle-3 { left:-75px; bottom:-35px; }
.global-velocity.velocity-box3 .listbox .v-box .circle-4 { left:-75px; top:-35px; }
.global-velocity.velocity-box3 .linkbox { margin-top:50px; padding:0 115px; }
.global-velocity.velocity-box3 .linkbox ul { display:flex; flex-wrap:wrap; gap:20px; }
.global-velocity.velocity-box3 .linkbox li { width:calc((100% - 60px) / 4); }
.global-velocity.velocity-box3 .linkbox li a { height:80px; width:100%; border-radius:80px; background:var(--mainColor); display:flex; align-items:center; justify-content:center; cursor: pointer;}
.global-velocity.velocity-box3 .linkbox li a span { display:inline-block; font-size:20px; font-weight:700; color:#fff; line-height:1.5; letter-spacing:-0.02em; padding:3px 36px 2px 0; background:url(../img/global/link_icon.png) no-repeat right center; }
@media screen and (max-width:1400px){
    .global-velocity.velocity-box3 .linkbox { margin-top:50px; padding:0; }
}
@media screen and (max-width:1280px){
    .global-velocity.velocity-box1 .listbox li { padding:20px 10px 20px 20px; }
    .global-velocity.velocity-box1 .listbox li .icon { width:98px; height:98px; }
    .global-velocity.velocity-box1 .listbox li .txtbox { width:calc(100% - 98px); padding-left:25px; }
    .global-velocity.velocity-box3 .linkbox li a { height:70px; }
    .global-velocity.velocity-box3 .linkbox li a span { font-size:19px; }
}
@media screen and (max-width:1024px){
    .global-box > div:nth-child(1) { padding-bottom:100px; }
    .global-velocity { padding:100px 0; }
    .global-velocity .listbox { margin-top:40px; }
    .global-velocity.velocity-box1 .listbox li { padding:20px 10px 20px 20px; }
    .global-velocity.velocity-box1 .listbox li .icon { width:75px; height:75px; }
    .global-velocity.velocity-box1 .listbox li .icon img { width:38px; }
    .global-velocity.velocity-box1 .listbox li .txtbox { width:calc(100% - 75px); padding-left:20px; font-size:16px; }
    .global-velocity.velocity-box3 .listbox { margin:100px 0; }
    .global-velocity.velocity-box3 .linkbox { margin-top:40px; }
    .global-velocity.velocity-box3 .linkbox li a { height:60px; }
    .global-velocity.velocity-box3 .linkbox li a span { font-size:18px; }
}
@media screen and (max-width:860px){
    .global-velocity.velocity-box1 .listbox ul { gap:10px; }
    .global-velocity.velocity-box1 .listbox li { width:calc((100% - 20px) / 3);  }
    .global-velocity.velocity-box2 .listbox li { width:calc((100% - 10px) / 2);  }
    .global-velocity.velocity-box3 .linkbox ul { gap:10px; }
    .global-velocity.velocity-box3 .linkbox li { width:calc((100% - 30px) / 4); }
}
@media screen and (max-width:760px){
    .global-velocity.velocity-box1 .listbox li { width:100%;  }
    .global-velocity.velocity-box3 .linkbox li { width:calc((100% - 10px) / 2); }
    .global-velocity.velocity-box3 .listbox .v-box { max-width:400px; height:400px; }
    .global-velocity.velocity-box3 .listbox .v-box:before { background-size:100% auto; }
    .global-velocity.velocity-box3 .listbox .v-box .circle-box { width:220px; height:220px; }
    .global-velocity.velocity-box3 .listbox .v-box .circle-box .box { font-size:22px; }
    .global-velocity.velocity-box3 .listbox .v-box .circle { width:160px; height:160px; }
    .global-velocity.velocity-box3 .listbox .v-box .circle .icon img { width:60px; }
    .global-velocity.velocity-box3 .listbox .v-box .circle .txtbox { margin-top:12px; font-size:17px; }
    .global-velocity.velocity-box3 .listbox .v-box .circle-1 { right:-65px; top:-30px; }
    .global-velocity.velocity-box3 .listbox .v-box .circle-2 { right:-65px; bottom:-30px; }
    .global-velocity.velocity-box3 .listbox .v-box .circle-3 { left:-65px; bottom:-30px; }
    .global-velocity.velocity-box3 .listbox .v-box .circle-4 { left:-65px; top:-30px; }
}
@media screen and (max-width:640px){
    .global-box > div:nth-child(1) { padding-bottom:80px; }
    .global-velocity { padding:80px 0; }
    .global-velocity .listbox { margin-top:30px; }
    .global-velocity.velocity-box3 .listbox { margin:80px 0; }
    .global-velocity.velocity-box3 .listbox .v-box { max-width:270px; height:270px; }
    .global-velocity.velocity-box3 .listbox .v-box .circle-box { width:150px; height:150px; }
    .global-velocity.velocity-box3 .listbox .v-box .circle-box .box { font-size:18px; }
    .global-velocity.velocity-box3 .listbox .v-box .circle { width:125px; height:125px; }
    .global-velocity.velocity-box3 .listbox .v-box .circle .icon img { width:45px; }
    .global-velocity.velocity-box3 .listbox .v-box .circle .txtbox { margin-top:8px; font-size:15px; }
    .global-velocity.velocity-box3 .listbox .v-box .circle-1 { right:-55px; top:-25px; }
    .global-velocity.velocity-box3 .listbox .v-box .circle-2 { right:-55px; bottom:-25px; }
    .global-velocity.velocity-box3 .listbox .v-box .circle-3 { left:-55px; bottom:-25px; }
    .global-velocity.velocity-box3 .listbox .v-box .circle-4 { left:-55px; top:-25px; }
    .global-velocity.velocity-box3 .linkbox { margin-top:30px; }
    .global-velocity.velocity-box3 .linkbox li a { height:55px; }
    .global-velocity.velocity-box3 .linkbox li a span { font-size:17px; padding:5px 30px 2px 0;  }
}

/* animation */
.global-velocity .listbox,
.global-velocity.velocity-box1 .imgbox,
.global-velocity.velocity-box3 .linkbox { opacity:0; }
.global-velocity.subOn .listbox,
.global-velocity.velocity-box1.subOn .imgbox,
.global-velocity.velocity-box3 .linkbox.subOn { animation:ani_4 0.8s 0.4s; animation-fill-mode:both; }


.global-hosting { padding:140px 0; overflow:hidden }
.global-hosting * { word-break:keep-all; }
.global-hosting.bg { background:#fff; }
.global-hosting .subTitle .txtbox { margin-top:10px; }
.global-hosting .listbox { margin-top:50px; z-index:2; position:relative; }
.global-hosting.global-hosting1 .listbox li:not(:last-child) { margin-bottom:60px; }
.global-hosting.global-hosting1 .listbox li { display:flex; align-items:center; gap:0 82px; }
.global-hosting.global-hosting1 .listbox li .imgbox { width:calc(50% - 82px); position:relative; }
.global-hosting.global-hosting1 .listbox li .imgbox:before { content: ""; display:block; padding-bottom:72.5%; }
.global-hosting.global-hosting1 .listbox li .imgbox img { position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover; -o-object-fit:cover; overflow:hidden; border-radius:15px; }
.global-hosting.global-hosting1 .listbox li .txtbox { width:50%; padding-left:82px; }
.global-hosting.global-hosting1 .listbox li .txtbox dt { font-size:26px; font-weight:700; color:#222; line-height:1.3; letter-spacing:-0.02em; }
.global-hosting.global-hosting1 .listbox li .txtbox dt h3 { font:inherit; color:inherit; }
.global-hosting.global-hosting1 .listbox li .txtbox dt strong { display:block; color:#eee; font-size:62px; font-weight:700; margin-bottom:38px; }
.global-hosting.global-hosting1 .listbox li .txtbox dd { margin-top:20px; font-size:20px; font-weight:300; color:#555; line-height:1.3; letter-spacing:-0.02em; }
.global-hosting.global-hosting1 .listbox li:nth-child(2n) { flex-direction:row-reverse; }
.global-hosting.global-hosting1 .listbox li:nth-child(2n) .txtbox { text-align:right; padding:0 82px 0 0; }
.global-hosting.global-hosting2 .listbox li:not(:last-child) { margin-bottom:10px; }
.global-hosting.global-hosting2 .listbox li { display:flex; align-items:center; padding:30px; background:#fff; border-radius:10px;}
.global-hosting.global-hosting2 .listbox li .num { width:40px; height:40px; border-radius:40px; display:flex; align-items:center; justify-content:center; background:var(--mainColor); font-size:14px; font-weight:700; color:#fff; line-height:1.3; letter-spacing:-0.02em; }
.global-hosting.global-hosting2 .listbox li .txtbox { width:calc(100% - 40px); padding-left:15px; font-size:20px; font-weight:300; color:#333; line-height:1.6; letter-spacing:-0.02em; }
.global-hosting.global-hosting2 .listbox li .txtbox strong { font-weight:600; }
.global-hosting.global-hosting2 .listbox li .txtbox .top-list { display: flex; align-items: center; }
.global-hosting.global-hosting2 .listbox li .txtbox .btn { display: flex; justify-content: center; background-color: #222; border-radius: 50px; width: 150px; height: 100%; padding: 16px 12px; }
.global-hosting.global-hosting2 .listbox li .txtbox .btn a { color: #fff;  align-items: center; font-size: smaller; }
.global-hosting.global-hosting3 .listbox ul { display:flex; flex-wrap:wrap; gap:20px; }
.global-hosting.global-hosting3 .listbox li { width:calc((100% - 40px) / 3); border-radius:10px; border:1px solid #ddd; background:#f9f9f9; padding:33px 10px 33px 33px; display:flex; align-items:center; }
.global-hosting.global-hosting3 .listbox li .icon { width:98px; height:98px; border-radius:98px; background:#fff; display:flex; align-items:center; justify-content:center; }
.global-hosting.global-hosting3 .listbox li .txtbox { width:calc(100% - 98px); padding-left:38px; font-size:20px; font-weight:400; color:#222; line-height:1.5; letter-spacing:-0.02em; }
.global-hosting.global-hosting3 .listbox li .txtbox strong { font-weight:600; }
@media screen and (max-width:1400px){
    .global-hosting .listbox li .txtbox br { display:none }
}
@media screen and (max-width:1280px){
    .global-hosting.global-hosting1 .listbox li:not(:last-child) { margin-bottom:50px; }
    .global-hosting.global-hosting1 .listbox li { gap:0 35px; }
    .global-hosting.global-hosting1 .listbox li .imgbox { width:calc(50% - 35px); }
    .global-hosting.global-hosting1 .listbox li .txtbox { padding-left:35px; }
    .global-hosting.global-hosting1 .listbox li:nth-child(2n) .txtbox { padding:0 35px 0 0; }
    .global-hosting.global-hosting1 .listbox li .txtbox dt { font-size:22px; }
    .global-hosting.global-hosting1 .listbox li .txtbox dt strong { font-size:54px; margin-bottom:34px; }
    .global-hosting.global-hosting1 .listbox li .txtbox dd { margin-top:15px; font-size:18px; }
    .global-hosting.global-hosting2 .listbox li .txtbox .btn { width: 140px; height: 100%; padding: 12px 12px; margin-left: 10px; }
    .global-hosting.global-hosting2 .listbox li .txtbox .btn a { font-size: 17px; }
    .global-hosting.global-hosting3 .listbox li { padding:20px 10px 20px 20px; }
    .global-hosting.global-hosting3 .listbox li .icon { width:98px; height:98px; }
    .global-hosting.global-hosting3 .listbox li .txtbox { width:calc(100% - 98px); padding-left:25px; }
}
@media screen and (max-width:1024px){
    .global-hosting { padding:100px 0; }
    .global-hosting .listbox { margin-top:40px; }
    .global-hosting.global-hosting1 .listbox li:not(:last-child) { margin-bottom:40px; }
    .global-hosting.global-hosting1 .listbox li { gap:0 20px; }
    .global-hosting.global-hosting1 .listbox li .imgbox { width:calc(50% - 20px); }
    .global-hosting.global-hosting1 .listbox li .imgbox img { border-radius:10px;}
    .global-hosting.global-hosting1 .listbox li .txtbox { padding-left:20px; }
    .global-hosting.global-hosting1 .listbox li:nth-child(2n) .txtbox { padding:0 20px 0 0; }
    .global-hosting.global-hosting1 .listbox li .txtbox dt { font-size:20px; }
    .global-hosting.global-hosting1 .listbox li .txtbox dt strong { font-size:38px; margin-bottom:20px; }
    .global-hosting.global-hosting1 .listbox li .txtbox dd { margin-top:12px; font-size:16px; }
    .global-hosting.global-hosting2 .listbox li { padding:25px; }
    .global-hosting.global-hosting2 .listbox li .num { width:40px; height:40px; }
    .global-hosting.global-hosting2 .listbox li .txtbox { width:calc(100% - 40px); padding-left:15px; font-size:18px; }
    .global-hosting.global-hosting2 .listbox li .txtbox .btn { width: 130px; height: 100%; padding: 12px 12px; margin-left: 20px; }
    .global-hosting.global-hosting2 .listbox li .txtbox .btn a { font-size: 15px; }
    .global-hosting.global-hosting3 .listbox li { padding:20px 10px 20px 20px; }
    .global-hosting.global-hosting3 .listbox li .icon { width:75px; height:75px; }
    .global-hosting.global-hosting3 .listbox li .icon img { width:38px; }
    .global-hosting.global-hosting3 .listbox li .txtbox { width:calc(100% - 75px); padding-left:20px; font-size:16px; }
}
@media screen and (max-width:860px){
    .global-hosting.global-hosting1 .listbox li:not(:last-child) { margin-bottom:40px; }
    .global-hosting.global-hosting1 .listbox li { gap:0 20px; }
    .global-hosting.global-hosting1 .listbox li .imgbox { width:calc(50% - 20px); }
    .global-hosting.global-hosting1 .listbox li .txtbox { padding-left:20px; }
    .global-hosting.global-hosting1 .listbox li:nth-child(2n) .txtbox { padding:0 20px 0 0; }
    .global-hosting.global-hosting1 .listbox li .txtbox dt { font-size:18px; }
    .global-hosting.global-hosting1 .listbox li .txtbox dt strong { font-size:30px; margin-bottom:15px; }
    .global-hosting.global-hosting1 .listbox li .txtbox dd { margin-top:10px; font-size:15px; }
    .global-hosting.global-hosting2 .listbox li .txtbox .btn { width: 130px; height: 100%; padding: 12px; margin-left: 30px; }
    .global-hosting.global-hosting2 .listbox li .txtbox .btn a { font-size: 15px; }
    .global-hosting.global-hosting3 .listbox ul { gap:10px; }
    .global-hosting.global-hosting3 .listbox li { width:calc((100% - 20px) / 3);  }
}
@media screen and (max-width:760px){
    .global-hosting.global-hosting3 .listbox li { width:100%; }
}
@media screen and (max-width:640px){
    .global-hosting { padding:80px 0; }
    .global-hosting .listbox { margin-top:30px; }
    .global-hosting.global-hosting1 .listbox li:not(:last-child) { margin-bottom:35px; }
    .global-hosting.global-hosting1 .listbox li { gap:10px; flex-wrap:wrap; }
    .global-hosting.global-hosting1 .listbox li .imgbox,
    .global-hosting.global-hosting1 .listbox li .txtbox { padding-left:0; width:100%; }
    .global-hosting.global-hosting1 .listbox li .imgbox:before { padding-bottom:56.5%; }
    .global-hosting.global-hosting1 .listbox li:nth-child(2n) { flex-direction:row; }
    .global-hosting.global-hosting1 .listbox li:nth-child(2n) .txtbox { padding:0; text-align:left; }
    .global-hosting.global-hosting1 .listbox li .txtbox dt { font-size:17px; }
    .global-hosting.global-hosting1 .listbox li .txtbox dt strong { font-size:26px; margin-bottom:13px; }
    .global-hosting.global-hosting2 .listbox li { padding:15px; }
    .global-hosting.global-hosting2 .listbox li .num { width:30px; height:30px; font-size:12px; }
    /* .global-hosting.global-hosting2 .listbox li .txtbox { width:calc(100% - 30px); padding-left:15px; font-size:16px; } */
    .global-hosting.global-hosting2 .listbox li .txtbox { width:calc(100% - 30px); padding-left:15px; font-size:16px; flex-direction: column; }
    .global-hosting.global-hosting2 .listbox li .txtbox .txt-list { justify-content: right; margin-left: 65%; }
    .global-hosting.global-hosting2 .listbox li .txtbox .btn { width: 130px; height: 100%; padding: 7px; background: none; border: 1px solid #0569ff; }
    .global-hosting.global-hosting2 .listbox li .txtbox .btn a { color:#222; font-size: 15px; line-height: 1.5; justify-content: center; align-items: center; }
}

/* animation */
.global-hosting .listbox { opacity:0; }
.global-hosting.subOn .listbox { animation:ani_4 0.8s 0.4s; animation-fill-mode:both; }
.global-hosting.global-hosting1 .listbox li .txtbox dt,
.global-hosting.global-hosting1 .listbox li .txtbox dd { opacity:0; }
.global-hosting.global-hosting1 .listbox  { opacity:1; animation:infinite; }
.global-hosting.global-hosting1 .listbox li.subOn .txtbox dt { animation:ani_2 0.8s 0.4s; animation-fill-mode:both; }
.global-hosting.global-hosting1 .listbox li.subOn .txtbox dd { animation:ani_2 0.8s 0.7s; animation-fill-mode:both; }
.global-hosting.global-hosting1 .listbox li:nth-child(2n).subOn .txtbox dt { animation:ani_1 0.8s 0.4s; animation-fill-mode:both; }
.global-hosting.global-hosting1 .listbox li:nth-child(2n).subOn .txtbox dd { animation:ani_1 0.8s 0.7s; animation-fill-mode:both; }
.global-hosting.global-hosting1 .listbox li .imgbox:after { content:""; display:block; width:100%; height:100%; background:#fff; position:absolute; right:0; top:0; }
.global-hosting.global-hosting1 .listbox li:nth-child(2n).subOn .imgbox:after { left:0; }
.global-hosting.global-hosting1 .listbox li.subOn .imgbox:after { animation:ani_w100 1.2s 0.8s; animation-fill-mode:both; }
@media screen and (max-width:640px){
    .global-hosting.global-hosting1 .listbox li:nth-child(2n).subOn .txtbox dt { animation:ani_2 0.8s 0.4s; animation-fill-mode:both; }
    .global-hosting.global-hosting1 .listbox li:nth-child(2n).subOn .txtbox dd { animation:ani_2 0.8s 0.7s; animation-fill-mode:both; }
    .global-hosting.global-hosting1 .listbox li:nth-child(2n).subOn .imgbox:after { left:unset; right:0; }
}

.cloud-managed { padding:140px 0; }
.cloud-managed * { word-break:keep-all; }
.cloud-managed.bg { background:#fff; }
.cloud-managed .listbox { margin-top:50px; z-index:2; position:relative;}
.cloud-managed.cloud-managed-box1 { padding:0; }
.cloud-managed.cloud-managed-box1 .dataTable { margin-top:0 }
.cloud-managed.cloud-managed-box2 .listbox:before { content:''; display:block; position:absolute; top:50%; left:0; width:100%; height:1px; transform:translateY(-50%); margin-top:-5px; background:var(--mainColor); }
.cloud-managed.cloud-managed-box2 .listbox .box { z-index:5; position:relative; border-radius:300px; background:#fff; border:1px solid var(--mainColor); display:flex; align-items:center; justify-content:center;  }
.cloud-managed.cloud-managed-box2 .listbox .box ul { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; text-align:center; width:100%; }
.cloud-managed.cloud-managed-box2 .listbox .box li { position:relative; }
.cloud-managed.cloud-managed-box2 .listbox .box li:before { content:''; display:block; padding-bottom:100%; }
.cloud-managed.cloud-managed-box2 .listbox .box li .circle-box { position:absolute; left:0; top:0; width:100%; height:100%; border-radius:500px; background:#f2f6fa; display:flex; align-items:center; justify-content:center; }
.cloud-managed.cloud-managed-box2 .listbox .box .txt strong { color: var(--mainColor); font-weight: 500; }
.cloud-managed.cloud-managed-box2 .listbox-1 .box { padding:44px 73px; }
.cloud-managed.cloud-managed-box2 .listbox-2 .box { padding:70px 45px; }
.cloud-managed.cloud-managed-box2 .listbox-1 .box ul { gap:50px; }
.cloud-managed.cloud-managed-box2 .listbox-2 .box ul { gap:45px; }
.cloud-managed.cloud-managed-box2 .listbox-1 .box li { width:calc((100% - 150px) / 4); }
.cloud-managed.cloud-managed-box2 .listbox-1 .box li.txt { width:100%; }
.cloud-managed.cloud-managed-box2 .listbox-1 .box li.txt:before { display:none; padding-bottom:0; }
.cloud-managed.cloud-managed-box2 .listbox-2 .box li { width:calc((100% - 180px) / 5); }
.cloud-managed.cloud-managed-box2 .listbox-1 .box ul .txt { color:#222; line-height: 50px; font-size: 23px; font-weight: 400; }
.cloud-managed.cloud-managed-box2 .listbox-2 { margin-top:115px; }
.cloud-managed.cloud-managed-box2 .listbox-2 p.tit { position:absolute; left:50%; top:-38px; transform:translateX(-50%); display:flex; align-items:center; justify-content:center; width:365px; height:77px; background:#444; border-radius:80px; font-size:30px; font-weight:600; color:#fff; line-height:1.3; letter-spacing:-0.02em; }
.cloud-managed.cloud-managed-box2 .listbox-2 .box li .circle-box { flex-direction:column; padding:0 20px;}
.cloud-managed.cloud-managed-box2 .listbox-2 .box li .circle-box .num { font-family:var(--mainFont); color:var(--mainColor); font-size:18px; font-weight:600; line-height:1.5; margin-bottom:15px; }
.cloud-managed.cloud-managed-box2 .listbox-2 .box li .circle-box .icon { margin:0 auto; min-height:50px; }
.cloud-managed.cloud-managed-box2 .listbox-2 .box li .circle-box .txtbox { margin-top:10px; font-size:18px; font-weight:500; color:#222; line-height:1.5; min-height:54px; }
.cloud-managed.cloud-managed-box3 .listbox ul { display:flex; flex-wrap:wrap; gap:20px; }
.cloud-managed.cloud-managed-box3 .listbox li { width:calc((100% - 40px) / 3); border-radius:15px; background:#fff; padding:35px 10px 75px 50px; }
.cloud-managed.cloud-managed-box3 .listbox li .icon { width:102px; height:102px; border-radius:102px; background:#f9f9f9; display:flex; align-items:center; justify-content:center; }
.cloud-managed.cloud-managed-box3 .listbox li .txtbox { margin-top:20px; font-size:18px; font-weight:400; color:#222; line-height:1.5; letter-spacing:-0.02em; }
.cloud-managed.cloud-managed-box3 .imgboxCont { display: flex; justify-content: center; margin-top: 40px; }
.cloud-managed.cloud-managed-box3 .imgboxCont img { width: 95%; }
@media screen and (max-width:1500px){
    .cloud-managed.cloud-managed-box3 .listbox li .txtbox br { display:none }
}
@media screen and (max-width:1280px){
    .cloud-managed .listbox li .txtbox br { display:none }
    .cloud-managed.cloud-managed-box2 .listbox-1 .box { padding:30px 50px; }
    .cloud-managed.cloud-managed-box2 .listbox-2 .box { padding:60px 30px; }
    .cloud-managed.cloud-managed-box2 .listbox-1 .box ul { gap:30px; }
    .cloud-managed.cloud-managed-box2 .listbox-2 .box ul { gap:25px; }
    .cloud-managed.cloud-managed-box2 .listbox-1 .box li { width:calc((100% - 90px) / 4); }
    .cloud-managed.cloud-managed-box2 .listbox-2 .box li { width:calc((100% - 100px) / 5); }
    .cloud-managed.cloud-managed-box2 .listbox-2 p.tit { top:-35px; width:360px; height:70px; font-size:30px; }
    .cloud-managed.cloud-managed-box2 .listbox-2 .box li .circle-box .num { font-size:17px; margin-bottom:10px; }
    .cloud-managed.cloud-managed-box2 .listbox-2 .box li .circle-box .icon { min-height:42px; }
    .cloud-managed.cloud-managed-box2 .listbox-2 .box li .circle-box .icon img { width:38px; }
    .cloud-managed.cloud-managed-box2 .listbox-2 .box li .circle-box .txtbox { margin-top:6px; font-size:17px; min-height:52px; }
    .cloud-managed.cloud-managed-box3 .listbox li {padding:30px 10px 60px 40px; }
}
@media screen and (max-width:1024px){
    .cloud-box > div:nth-child(1) { padding-bottom:100px; }
    .cloud-managed { padding:100px 0; }
    .cloud-managed .listbox { margin-top:40px; }
    .cloud-managed .listbox li .txtbox br { display:none }
    .cloud-managed.cloud-managed-box2 .listbox-2 { margin-top:100px; }
    .cloud-managed.cloud-managed-box2 .listbox-1 .box { padding:40px 30px; }
    .cloud-managed.cloud-managed-box2 .listbox-2 .box { padding:60px 100px; }
    .cloud-managed.cloud-managed-box2 .listbox-1 .box ul { gap:20px; }
    .cloud-managed.cloud-managed-box2 .listbox-2 .box ul { gap:20px; }
    .cloud-managed.cloud-managed-box2 .listbox-1 .box ul .txt { color:#222; line-height: 40px; font-size: 18px; font-weight: 400; }
    .cloud-managed.cloud-managed-box2 .listbox-1 .box li { width:calc((100% - 60px) / 4); }
    .cloud-managed.cloud-managed-box2 .listbox-2 .box li { width:calc((100% - 40px) / 3); }
    .cloud-managed.cloud-managed-box2 .listbox-2 p.tit { top:-34px; width:320px; height:68px; font-size:26px; }
    .cloud-managed.cloud-managed-box2 .listbox-2 .box li .circle-box .num { font-size:16px; margin-bottom:10px; }
    .cloud-managed.cloud-managed-box2 .listbox-2 .box li .circle-box .icon { min-height:38px; }
    .cloud-managed.cloud-managed-box2 .listbox-2 .box li .circle-box .icon img { width:34px; }
    .cloud-managed.cloud-managed-box2 .listbox-2 .box li .circle-box .txtbox { margin-top:8px; font-size:16px; min-height:50px; }
    .cloud-managed.cloud-managed-box3 .listbox li {padding:30px 10px 50px 30px; }
    .cloud-managed.cloud-managed-box3 .listbox li .txtbox { margin-top:13px; font-size:16px; }
}
@media screen and (max-width:960px){
    .cloud-managed.cloud-managed-box2 .listbox .box { border-radius:100px; }
    .cloud-managed.cloud-managed-box2 .listbox-1 .box { padding:40px 100px; }
    .cloud-managed.cloud-managed-box2 .listbox-1 .box li { width:calc((100% - 20px) / 2); }
    .cloud-managed.cloud-managed-box3 .listbox li { width:calc((100% - 20px) / 2); }
}
@media screen and (max-width:760px){
    .cloud-managed.cloud-managed-box2 .listbox-1 .box { padding:40px 80px; }
    .cloud-managed.cloud-managed-box2 .listbox-2 .box { padding:60px 80px; }
    .cloud-managed.cloud-managed-box2 .listbox-2 p.tit { top:-28px; width:280px; height:56px; font-size:20px; }
    .cloud-managed.cloud-managed-box2 .listbox-2 .box li { width:calc((100% - 20px) / 2); }
    .cloud-managed.cloud-managed-box3 .listbox ul { gap:10px; }
    .cloud-managed.cloud-managed-box3 .listbox li { width:calc((100% - 10px) / 2); }
}
@media screen and (max-width:640px){
    .cloud-box > div:nth-child(1) { padding-bottom:80px; }
    .cloud-managed { padding:80px 0; }
    .cloud-managed .listbox { margin-top:30px; }
    .cloud-managed.cloud-managed-box2 .listbox-2 { margin-top:80px; }
    .cloud-managed.cloud-managed-box2 .listbox .box { border-radius:50px; }
    .cloud-managed.cloud-managed-box2 .listbox-1 .box { padding:30px 20px; }
    .cloud-managed.cloud-managed-box2 .listbox-1 .box .circle-box img { width:50% }
    .cloud-managed.cloud-managed-box2 .listbox-2 .box { padding:50px 20px; }
    .cloud-managed.cloud-managed-box2 .listbox-1 .box ul .txt { color:#222; line-height: 35px; font-size: 14px; font-weight: 400; }
    .cloud-managed.cloud-managed-box2 .listbox-2 .box li { width:calc((100% - 20px) / 2); }
    .cloud-managed.cloud-managed-box2 .listbox-2 p.tit { top:-25px; width:220px; height:50px; font-size:18px; }
    .cloud-managed.cloud-managed-box2 .listbox-2 .box li .circle-box .num { font-size:16px; margin-bottom:10px; }
    .cloud-managed.cloud-managed-box2 .listbox-2 .box li .circle-box .icon { min-height:34px; }
    .cloud-managed.cloud-managed-box2 .listbox-2 .box li .circle-box .icon img { width:32px; }
    .cloud-managed.cloud-managed-box2 .listbox-2 .box li .circle-box .txtbox { margin-top:5px; font-size:15px; min-height:45px; }
    .cloud-managed.cloud-managed-box3 .listbox li {padding:20px 10px 30px 20px; width:100%; }
    .cloud-managed.cloud-managed-box3 .listbox li .txtbox { margin-top:10px; font-size:15px; }
    .cloud-managed.cloud-managed-box3 .listbox li .icon { margin:0 auto; }
}

/* animation */
.cloud-managed .listbox { opacity:0; }
.cloud-managed.subOn .listbox { animation:ani_4 0.8s 0.4s; animation-fill-mode:both; }

/* history */
.about-box .about-history ul,li { list-style: none; }
.about-box .about-history a {text-decoration: none}
.about-box .about-history .history h2,
.about-box .about-history .history h3 { text-align: center; font-size: 30px; font-weight: 600; color: #222; line-height: 1; margin-top: 70px; }
.about-box .about-history .tabMenu a h3 { font:inherit; color:inherit; }
.about-box .about-history .list_right { display: table; width: 100%; table-layout: fixed; }
.about-box .about-history .list_right span { display: table-cell; vertical-align: top; }
.about-box .about-history .list_right div { position: relative; display: table-cell; vertical-align: top; }
.about-box .about-history .list_right div:before { content: ""; position: absolute; left: 0; width: 1px; height: 100%; background: #dfdfdf; }
.about-box .about-history .list_right div ul { margin-top: 20px; }
.about-box .about-history .list_right div ul li { display: table; position: relative; width: 100%; padding-left: 25px; padding-top: 5px; }
.about-box .about-history .list_right div ul li+li { margin-top: 20px; }
.about-box .about-history .list_right div ul li:before { content: ""; position: absolute; left: -8px; top: 7px; width: 15px; height: 15px; border: 3px solid var(--mainColor); border-radius: 50%; }
.about-box .about-history .list_right dl { text-align: left; display: table; width: 100%; }
.about-box .about-history .list_right dl dt { width: 10%; display: table-cell; vertical-align: middle; font-size: 14px; color: #444; font-weight: 600; text-align: left; font-size: 18px; }
.about-box .about-history .list_right dl dd { width: 90px; display: table-cell; vertical-align: middle; font-size: 13px; color: #444; text-align: left; }
.about-box .about-history .list_left { display: table; width: 100%; table-layout: fixed; }
.about-box .about-history .list_left span { display: table-cell; vertical-align: top; }
.about-box .about-history .list_left div { position: relative; display: table-cell; vertical-align: top; }
.about-box .about-history .list_left div:before { content: ""; position: absolute; right: -1px; width: 1px; height: 100%; background: #dfdfdf; }
.about-box .about-history .list_left div ul { margin-top: 20px; }
.about-box .about-history .list_left div ul li { display: table; position: relative; width: 100%; padding-left: 25px; padding-top: 5px; }
.about-box .about-history .list_left div ul li+li { margin-top: 20px; }
.about-box .about-history .list_left div ul li:before { content: ""; position: absolute; right: -10px; top: 7px; width: 15px; height: 15px; border: 3px solid var(--mainColor); border-radius: 50%; }
.about-box .about-history .list_left dl { text-align: right; display: table; width: 100%; padding-right: 20px; }
.about-box .about-history .list_left dl dt { width: 10%; display: table-cell; vertical-align: middle; font-size: 14px; color: #444; font-weight: 600; text-align: right; font-size: 18px; }
.about-box .about-history .list_left dl dd { width: 90px; display: table-cell; vertical-align: middle; font-size: 13px; color: #444; text-align: right; }

@media screen and (max-width:690px){
    .about-box .about-history .history h2,
    .about-box .about-history .history h3 { font-size: 23px; text-align: left; }
    .about-box .about-history .history ul { border-bottom: 1px solid #dfdfdf; }
    .about-box .about-history .history ul li:last-child { padding-bottom: 20px; }
    .about-box .about-history .list_right div:before,
    .about-box .about-history .list_left div:before { background: none; }
    .about-box .about-history .list_right span,
    .about-box .about-history .list_left span { display: none }
    .about-box .about-history .list_right div ul li:before,
    .about-box .about-history .list_left div ul li:before { content: ""; position: absolute; left: -5px; top: 7px; width: 0px; height: 15px; border: 3px solid var(--mainColor); border-radius: 50%; padding-left: 15px; }
    .about-box .about-history .list_right dl dt,
    .about-box .about-history .list_left dl dt { font-size: 17px; line-height: 1.5; text-align: left; }
}

/* animation */
.about-box .aobut-history { opacity:0; }
/* .about-box .aobut-history .history-wrap { animation:ani_4 0.8s 0.4s; animation-fill-mode:both; } */


/* location */
.about-box .about-history { background-color:#f5f5f5;}
.about-box .about-history .firewall-service { background-color: #f5f5f5; padding: 50px 0 50px 0; }
.about-box .about-history .location { display: flex; justify-content: center; align-items: center; }
.about-box .about-history .location iframe { position: relative; min-width:1500px; height:580px; overflow-x: scroll;}

.location-tab > ul { display:flex; flex-wrap:wrap; justify-content:center; gap:25px; }
.location-tab > ul > li a { padding:0 25px; display:flex; align-items:center; justify-content:center; background:#fff; color:#222; font-size:18px; font-weight:400; line-height:1.3; }
.location-tab > ul > li.on a { background:var(--mainColor); color:#fff }
.location-tab > .tabnav a.on { background-color:var(--mainColor); color: #fff; }
.location-tab > .tabnav a { transition: background-color 0.3s, color 0.3s; }

@media screen and (max-width:1500px){
    .about-box .about-history .location iframe { min-width:1200px; height:580px;}
}
@media screen and (max-width:1280px){
    .about-box .about-history .location iframe { min-width:1000px; height:580px;}
}
@media screen and (max-width:1024px){
    .about-box .about-history .location iframe { min-width:900px; height:580px;}
}
@media screen and (max-width:960px) {
    .about-box .about-history .location iframe { min-width:820px; height:580px;}
}

@media screen and (max-width:860px){
    .about-box .about-history .location iframe { max-width: 100%; height:580px;}
}

@media screen and (max-width:640px){
    .about-box .about-history .location iframe { min-width:100%; height:100%;}
}