/*=========================================================
  VGATE — common.min.css
  Global tokens, header, drawer nav, footer, buttons, pagetop
  Architecture cloned from mashgroup.jp (JIS corporate layout).
  Only color tokens differ (Vgate palette).
=========================================================*/

@import "https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700;900&family=Noto+Sans:ital,wght@0,400;0,700;1,400;1,700&display=swap";
@import "https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@100;300;400;500;700;900&family=Noto+Sans+TC:wght@100;300;400;500;700;900&display=swap";

/* ---------- Breakpoint helpers ---------- */
.pcOnly{display:block}.pcTabOnly{display:block}.tabSpOnly{display:none}.tabOnly{display:none}.spOnly{display:none}
@media only screen and (max-width: 768px){
  .pcOnly{display:none}.pcTabOnly{display:block}.tabSpOnly{display:block}.tabOnly{display:block}.spOnly{display:none}
}
@media only screen and (max-width: 480px){
  .pcOnly{display:none}.pcTabOnly{display:none !important}.tabSpOnly{display:block}.tabOnly{display:none}.spOnly{display:block}
}

/* ---------- Keyframes ---------- */
@keyframes loader{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}
@keyframes gnaviAnime{0%{opacity:0}100%{opacity:1}}
@keyframes downAnime{from{transform:translateY(-100px)}to{transform:translateY(0)}}
@keyframes upAnime{from{transform:translateY(0)}to{transform:translateY(-100px)}}
@keyframes linkhover{0%{opacity:1}50%{opacity:0;transform:translate3d(100%, 0, 0)}55%{opacity:0;transform:translate3d(-100%, 0, 0)}100%{opacity:1;transform:translate3d(0, 0, 0)}}
@keyframes linkhover2{0%{opacity:1}50%{opacity:0;transform:translate3d(0, -100%, 0)}55%{opacity:0;transform:translate3d(0, 100%, 0)}100%{opacity:1;transform:translate3d(0, 0, 0)}}
@keyframes linkhover3{0%{opacity:0}50%{opacity:0;transform:translate3d(0, -100%, 0)}55%{opacity:.1;transform:translate3d(0, 100%, 0)}100%{opacity:1;transform:translate3d(0, 0, 0)}}
@keyframes ripple{0%{opacity:1;transform:scale(1);box-shadow:0 0 0 1px #1A1A1A}100%{opacity:0;transform:scale(2);box-shadow:0 0 0 10px #1A1A1A}}
@keyframes ripple2{0%{opacity:1;transform:scale(1);box-shadow:0 0 0 1px #1A1A1A}100%{opacity:0;transform:scale(2);box-shadow:0 0 0 10px #1A1A1A}}
@keyframes PageAnime{0%{transform-origin:left;transform:scaleX(0)}50%{transform-origin:left;transform:scaleX(1)}50.001%{transform-origin:right}100%{transform-origin:right;transform:scaleX(0)}}
@keyframes PageAnimeAppear{0%{opacity:0}100%{opacity:1}}
@keyframes rotate{0%{transform:rotate(-100deg)}100%{transform:rotate(0deg)}}
@keyframes rotate2{0%{opacity:0;transform:rotate(60deg)}100%{opacity:1;transform:rotate(360deg)}}
@keyframes fadeIn{0%{opacity:0}100%{opacity:1}}
@keyframes fadeOut{0%{opacity:1}100%{opacity:0}}
@keyframes figureLeftToRight{0%{transform:translateX(0)}100%{transform:translateX(100%)}}

/* ---------- Page-load fade ---------- */
body{opacity:0;transition:opacity .6s cubic-bezier(0.25, 0.25, 0.75, 0.75)}
body.show{opacity:1;transition:opacity .6s cubic-bezier(0.25, 0.25, 0.75, 0.75)}
.is-fade-element{transition:opacity .8s,transform .8s}
.is-fade-standby{opacity:0;transform:translate(0, 100px);transition:none}
@media only screen and (max-width: 768px){.is-fade-standby{transform:translate(0, 80px)}}

/* ---------- Base typography ---------- */
html,body{
  font-family: "Noto Sans JP","Noto Sans","Hiragino Sans","Hiragino Kaku Gothic ProN","Arial","Yu Gothic","Meiryo",sans-serif;
  line-height:1; font-weight:400; font-size:13px; overflow-x:hidden; width:100%;
  color:#1A1A1A; background:#fff;
}
html a,body a{color:#1A1A1A;cursor:pointer;transition:all 1s cubic-bezier(0.215, 0.61, 0.355, 1)}
@media only screen and (min-width: 769px){
  html a:hover,body a:hover{opacity:.8;transition:all 1s cubic-bezier(0.215, 0.61, 0.355, 1)}
}
html a.disable,body a.disable{pointer-events:none}
html a.externalLink,body a.externalLink{position:relative;padding-right:18px;display:inline;font-weight:700;text-decoration:underline}
html a.externalLink:before,body a.externalLink:before{
  content:url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><path d="M82.61,95H17.4A12.39,12.39,0,0,1,5,82.61V17.39A12.39,12.39,0,0,1,17.4,5H41.31v7.35H17.4a5,5,0,0,0-5,5V82.61a5,5,0,0,0,5,5H82.61a5,5,0,0,0,5-5V58.69H95V82.61A12.39,12.39,0,0,1,82.61,95Z"/><rect x="17.88" y="35.67" width="86.08" height="7.35" transform="translate(-9.98 54.6) rotate(-45)"/><polygon points="95.03 46.17 87.68 46.17 87.68 12.37 53.88 12.37 53.88 5.02 95.03 5.02 95.03 46.17"/></svg>');
  display:inline-block;position:absolute;height:13px;width:13px;top:-1px;right:2px
}
html h3,body h3{letter-spacing:.05em}
html h4,body h4{letter-spacing:.05em}
html p,body p{letter-spacing:.05em}
@media only screen and (max-width: 480px){html,body{font-size:3.4933333333vw}}
.font-eng{font-family:"Noto Sans","Noto Sans JP","Hiragino Sans","Hiragino Kaku Gothic ProN","Arial","Yu Gothic","Meiryo",sans-serif}
.colorW{fill:#fff}
img{backface-visibility:hidden;-webkit-backface-visibility:hidden}
img[src$=".svg"]{width:100%;height:auto}

/* ---------- Header (top fixed bar + drawer) ---------- */
header{
  width:100%; position:fixed; background:#fff; z-index:9999; top:0;
  transition:.8s cubic-bezier(0.165, 0.84, 0.44, 1); padding:36px 0;
}
header .inner{margin:0 auto;width:90%}
header .inner .logo{max-width:410px;width:100%;margin-bottom:18px;transition:.8s cubic-bezier(0.165, 0.84, 0.44, 1)}
header .inner .logo img{max-width:410px;width:100%;height:auto}
@media only screen and (max-width: 768px){header .inner .logo{max-width:410px}}
@media only screen and (max-width: 480px){
  header .inner .logo{max-width:100%}
  header .inner .logo img{max-width:100%}
}
header .inner>dl{
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap;
  width:100%; padding:0 0 12px; border-bottom:1px solid #1A1A1A;
  transition:.8s cubic-bezier(0.165, 0.84, 0.44, 1);
}
header .inner>dl>dt{width:152px;height:auto}
header .inner>dl>dt img{height:14px;width:auto}
header .inner>dl>dd:nth-of-type(2){width:80px;flex-shrink:0}
header .inner>dl>dd div.openbtn{overflow:hidden;display:flex;gap:2px;align-items:center;justify-content:flex-end}
header .inner>dl>dd div.openbtn span{display:inline-block;width:auto;height:14px;flex-shrink:0}
header .inner>dl>dd div.openbtn span img{height:100%;width:auto}
header .inner>dl>dd div.openbtn:hover span{animation:linkhover2 .3s cubic-bezier(0.645, 0.045, 0.355, 1)}
header .inner>dl>dd div.openbtn:hover span:nth-of-type(2){animation-delay:.1s}
header .inner>dl>dd div.openbtn:hover span:nth-of-type(3){animation-delay:.2s}
header .inner>dl>dd div.openbtn:hover span:nth-of-type(4){animation-delay:.3s}
header .inner>dl>dd.language{width:calc(100% - 202px);font-size:1rem;padding-right:30px;display:flex;justify-content:flex-end}
@media only screen and (max-width: 768px){header .inner>dl>dd.language{padding-right:12px}}
header .inner>dl>dd.language dl.accordion{position:relative}
header .inner>dl>dd.language dl.accordion dt{padding:0 6px;cursor:pointer;display:inline-flex;align-items:center;gap:6px}
header .inner>dl>dd.language dl.accordion dt img{height:14px;width:auto}
header .inner>dl>dd.language dl.accordion dt .lang-current-label{font-size:.7rem;letter-spacing:.05em;color:#1A1A1A;font-family:inherit}
header .inner>dl>dd.language dl.accordion dt[aria-expanded="true"] .lang-current-label{opacity:.6}
header .inner>dl>dd.language dl.accordion dd a.lang-opt{display:block;font-size:.84615rem;text-align:center;padding:6px 0;cursor:pointer}
header .inner>dl>dd.language dl.accordion dd a.lang-opt:not(:first-child){border-top:1px solid #333}
header .inner>dl>dd.language dl.accordion dd a.lang-opt.current{background:#767676;color:#fff}
header .inner>dl>dd.language dl.accordion dd a.lang-opt[data-lang="zh-CN"],
header .inner>dl>dd.language dl.accordion dd a.lang-opt[data-lang="zh-TW"]{font-family:"Noto Sans SC","Noto Sans TC","Noto Sans JP","Noto Sans",sans-serif}
header .inner>dl>dd.language dl.accordion dd{display:none;position:absolute;top:1.5rem;left:0;width:100%;background:#fff;border:1px solid #333;border-top:none}
header .inner>dl>dd.language dl.accordion dd a{display:block;font-size:.84615rem;text-align:center;padding:6px 0}
header .inner>dl>dd.language dl.accordion dd a:not(:first-child){border-top:1px solid #333}
header .inner>dl>dd.language dl.accordion dd a.current{background:#767676;color:#fff}
header .inner>dl>dd.language dl.accordion dd a.jpnCont.chn{font-family:"Noto Sans JP","Noto Sans SC","Noto Sans TC","Noto Sans",sans-serif}
@media only screen and (max-width: 768px){header .inner{width:90%}}

header.active{position:fixed;transition:.8s cubic-bezier(0.165, 0.84, 0.44, 1);background-color:hsla(0,0%,100%,.5)}
header.active .inner .logo{max-width:0;max-height:0;margin-bottom:0;opacity:0;transition:.8s cubic-bezier(0.165, 0.84, 0.44, 1)}

/* Drawer */
header #g-nav{
  position:fixed; z-index:999; top:0; right:-300px; width:300px; height:100vh;
  background:#3a3a3a; transition:all .8s cubic-bezier(0.165, 0.84, 0.44, 1);
}
header #g-nav.panelactive{right:0}
header #g-nav.panelactive #g-nav-list{
  position:fixed; z-index:999; width:300px; height:100vh; overflow:auto;
  -webkit-overflow-scrolling:touch; transition:all .8s cubic-bezier(0.165, 0.84, 0.44, 1);
}
header #g-nav.panelactive #g-nav-list ul li a{transform:translateY(0);overflow:hidden;transition:.8s cubic-bezier(0.165, 0.84, 0.44, 1)}
header #g-nav ul{
  position:absolute; z-index:999;
  transition:top .8s cubic-bezier(0.165, 0.84, 0.44, 1);
  top:144px; left:50%; transform:translateX(-50%); width:70%; padding-bottom:72px;
}
header #g-nav ul li{list-style:none;text-align:center;padding:18px 0;overflow:hidden}
header #g-nav ul li p.toggleBtn{cursor:pointer}
header #g-nav ul li p.toggleBtn a.btn{position:relative}
header #g-nav ul li p.toggleBtn a.btn span.cross{position:absolute;top:0;right:0;height:24px;width:24px}
header #g-nav ul li p.toggleBtn a.btn span.cross>span{display:block;height:1px;width:calc(100% - 5px);background:#fff;transition:.8s cubic-bezier(0.165, 0.84, 0.44, 1)}
header #g-nav ul li p.toggleBtn a.btn span.cross>span:nth-of-type(1){position:absolute;top:calc(50% - .5px)}
header #g-nav ul li p.toggleBtn a.btn span.cross>span:nth-of-type(2){position:absolute;top:calc(50% - .5px);transform:rotate(90deg)}
header #g-nav ul li p.toggleBtn.active a.btn span.cross>span{transition:.8s cubic-bezier(0.165, 0.84, 0.44, 1)}
header #g-nav ul li p.toggleBtn.active a.btn span.cross>span:nth-of-type(2){top:calc(50% - .5px);transform:rotate(0)}
header #g-nav ul li p.toggleBtn+ol{margin-top:12px}
header #g-nav ul li p.toggleBtn+ol li{padding:6px 0}
header #g-nav ul li p.toggleBtn+ol li a{font-size:11px;letter-spacing:0;text-align:left;color:#fff;font-weight:300}
header #g-nav ul li a{
  color:#fff; text-decoration:none; display:block; text-transform:uppercase;
  letter-spacing:.1em; font-weight:bold; transform:translateY(200px);
  transition:.8s .5s cubic-bezier(0.165, 0.84, 0.44, 1);
}
header #g-nav ul li a img{width:246px;height:auto}
header #g-nav ul li a svg{width:246px;height:auto}
header #g-nav ul li a svg path{fill:#fff}
header #g-nav ul li.sub-nav{padding:8px 0}
header #g-nav ul li.sub-nav:nth-of-type(3){padding:0 0 8px}
header #g-nav ul li.sub-nav:nth-of-type(5){padding:8px 0 18px}
header #g-nav ul li.sub-nav a{padding-left:13px;margin-left:5px;position:relative}
header #g-nav ul li.sub-nav a:before{content:"";height:1px;width:8px;background:#fff;position:absolute;left:0;top:50%;transform:translateY(-50%)}
header #g-nav ul li.sub-nav a img{width:auto;height:18px}

header .overlay{position:fixed;z-index:998;top:0;right:-120%;width:100%;height:100vh;background:rgba(0,0,0,0);transition:all .1s}
header .overlay.open{right:0}
header .openbtn{cursor:pointer}
header .closebtn{
  pointer-events:none; opacity:0; cursor:pointer; transition:all .8s;
  position:fixed; z-index:10001; top:10px; right:10px; width:50px; height:50px;
}
header .closebtn span{display:inline-block;transition:all .4s;position:absolute;right:10px;height:2px;border-radius:1px;background-color:#fff}
header .closebtn span:nth-of-type(1){top:18px;left:18px;transform:translateY(6px) rotate(-45deg);width:30%}
header .closebtn span:nth-of-type(2){opacity:0}
header .closebtn span:nth-of-type(3){top:30px;left:18px;transform:translateY(-6px) rotate(45deg);width:30%}
header .closebtn.active{opacity:1;pointer-events:auto}

header{transition:right .8s cubic-bezier(0.165, 0.84, 0.44, 1);right:0}
header.moveLeft{transition:right .8s cubic-bezier(0.165, 0.84, 0.44, 1);right:300px}
.contWrap{transition:right .8s cubic-bezier(0.165, 0.84, 0.44, 1);right:0}
.contWrap.moveLeft{transition:right .8s cubic-bezier(0.165, 0.84, 0.44, 1);right:300px}
.contWrap{position:relative;overflow-x:hidden}

/* ---------- ContWrap — page-content container ---------- */
.contWrap .inner{max-width:750px;width:90%;margin:0 auto;padding:144px 0;text-align:justify}
@media only screen and (max-width: 768px){.contWrap .inner{padding:72px 0}}

.contWrap section.inner{display:flex;flex-direction:column;align-items:flex-start;max-width:750px}
.contWrap section.inner h2{font-size:1.7rem;margin-bottom:36px}
.contWrap section.inner h2.h2Only{margin-bottom:0}
.contWrap section.inner h2 span{display:block;font-size:1.2rem;margin-top:18px}
.contWrap section.inner h2+p{margin-bottom:36px}
.contWrap section.inner h3{font-size:1.2rem}
.contWrap section.inner p{font-size:1rem}
.contWrap section.inner p span{margin-top:36px;display:block;text-align:right}
@media only screen and (max-width: 768px){
  .contWrap section.inner h2{width:100%;text-align:center;margin-bottom:36px}
  .contWrap section.inner h3{text-align:center}
  .contWrap section.inner p span{text-align:center}
}
.contWrap section.inner.txtWrap h3{line-height:1.5}
.contWrap section.inner.txtWrap p{line-height:2}

.contWrap section .inner{max-width:750px}
.contWrap section .inner h2{font-size:1.7rem;margin-bottom:36px}
.contWrap section .inner h2.h2Only{margin-bottom:0}
.contWrap section .inner h2 span{display:block;font-size:1.2rem;margin-top:18px}
.contWrap section .inner h2+p{margin-bottom:36px}
.contWrap section .inner h3{font-size:1.2rem}
.contWrap section .inner p{font-size:1rem}
.contWrap section .inner p span{margin-top:30px;display:block;text-align:right}
@media only screen and (max-width: 768px){
  .contWrap section .inner h2{text-align:center;margin-bottom:36px}
  .contWrap section .inner h3{text-align:center}
  .contWrap section .inner p span{text-align:center}
}
.contWrap section .inner.txtWrap h3{line-height:1.5}
.contWrap section .inner.txtWrap p{line-height:2}

.contWrap .caption{font-size:.7rem;line-height:1.2;vertical-align:baseline;margin-top:30px}
.contWrap .caption.txtLeft{text-align:left}
@media only screen and (max-width: 768px){.contWrap .caption{margin-top:5%}}
.contWrap sup{vertical-align:super;line-height:1;font-size:.7rem}

/* ---------- Button (link) — black border, fill-on-hover ---------- */
.contWrap .btnArea{margin:36px auto 0;max-width:350px;width:100%;display:flex;justify-content:center}
.contWrap .btnArea.alignLeft{margin:36px 0 0}
@media only screen and (max-width: 480px){.contWrap .btnArea{max-width:100%}}
.contWrap .btnArea a.btn{
  display:flex; justify-content:center; align-items:center; flex-wrap:wrap;
  position:relative; width:100%; overflow:hidden; pointer-events:auto; padding:18px;
  transition:all 1s cubic-bezier(0, 0.7, 0, 1); border:1px solid #1A1A1A;
}
.contWrap .btnArea a.btn p{letter-spacing:0;text-align:center;font-size:1.2rem}
.contWrap .btnArea a.btn p span{display:block;text-align:center;margin-top:10px}
@media only screen and (min-width: 769px){
  .contWrap .btnArea a.btn:hover{color:#fff;background:#1A1A1A;transition:all 1s cubic-bezier(0, 0.7, 0, 1)}
}

/* ---------- Footer ---------- */
.contWrap footer{background:#d2d2d2;width:100%;padding:36px 0}
.contWrap footer .inner{padding:0;margin:0 auto;width:90%;max-width:90%;display:flex;flex-direction:column;align-items:center}
.contWrap footer .inner .logo a{
  display:block; text-indent:100%; white-space:nowrap; overflow:hidden;
  max-width:232px; width:232px; aspect-ratio:232/58.42; -o-object-fit:contain; object-fit:contain;
  background:url(../img/common/footer_logo.svg) no-repeat; background-size:contain;
}
.contWrap footer .inner .logo a:before{content:"";display:block;width:100%;padding-top:25.18103%}
.contWrap footer .inner .logo a img{width:232px;height:auto}

.contWrap footer .inner .groupList{
  display:flex; justify-content:center; align-items:center; flex-wrap:wrap;
  max-width:660px; margin-top:18px;
}
.contWrap footer .inner .groupList li{font-size:.8rem;line-height:1;border-right:1px solid #767676;margin-right:6px}
.contWrap footer .inner .groupList li a{display:block;padding-right:6px}
.contWrap footer .inner .groupList li:nth-of-type(n+6){margin-top:6px}
.contWrap footer .inner .groupList li:last-of-type{margin-right:0;border-right:none}
.contWrap footer .inner .groupList li:last-of-type a{padding-right:0}
.contWrap footer .inner address{margin-top:18px;font-size:1rem}

.contWrap footer .inner nav{border-top:1px solid #1A1A1A;margin:18px auto 0;padding:18px 0 36px;width:100%}
.contWrap footer .inner nav section{margin:0 auto;max-width:750px;display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap}
.contWrap footer .inner nav section div h3{margin-bottom:12px;font-size:.9rem;letter-spacing:0}
.contWrap footer .inner nav section div h3.img a{text-indent:100%;white-space:nowrap;overflow:hidden;height:18px}
.contWrap footer .inner nav section div h3.img a.about{width:102px;background:url(../img/common/footer-about_nav.svg) no-repeat left center;background-size:102px 18px}
.contWrap footer .inner nav section div h3.img a.commitment{width:138px;background:url(../img/common/footer-commitment_nav.svg) no-repeat left center;background-size:138px 18px}
.contWrap footer .inner nav section div h3.img a.recruit{width:77px;background:url(../img/common/footer-recruit_nav.svg) no-repeat left center;background-size:77px 18px}
.contWrap footer .inner nav section div h3:last-of-type{margin-bottom:0}
.contWrap footer .inner nav section div h3+ul{margin-top:18px}
.contWrap footer .inner nav section div ul li{font-size:.8rem;margin-bottom:10px;letter-spacing:0}
.contWrap footer .inner nav section div ul li:last-of-type{margin-bottom:0}
.contWrap footer .inner nav section.graduateCont{display:none}
.contWrap footer .inner nav ul.otherCont{display:none}

.contWrap footer .inner #snsArea{display:flex;flex-direction:column;align-items:center}
.contWrap footer .inner #snsArea p{text-align:center;font-size:.785rem;margin-bottom:12px}
.contWrap footer .inner #snsArea ol{margin-bottom:36px;display:flex;align-items:flex-start;flex-wrap:wrap;align-items:flex-start}
.contWrap footer .inner #snsArea ol li.snsIcon a{display:block;position:relative;width:20px;height:20px}
.contWrap footer .inner #snsArea ol li.snsIcon a:before{display:block;position:absolute;left:0;top:0;width:100%;height:100%}
.contWrap footer .inner #snsArea ol li.snsIcon:nth-of-type(n+2){margin-left:20px}
.contWrap footer .inner #snsArea ol li.snsIcon.insta a:before{
  content:url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="m7.44,1.08c-1.17.06-1.97.24-2.67.52-.72.28-1.34.66-1.95,1.27-.61.61-.99,1.23-1.27,1.95-.27.7-.45,1.5-.51,2.67-.05,1.17-.06,1.55-.06,4.53,0,2.99.02,3.36.07,4.54.06,1.17.24,1.97.52,2.67.28.72.66,1.34,1.27,1.95.61.61,1.23.98,1.95,1.26.7.27,1.5.45,2.67.51,1.17.05,1.55.06,4.53.06,2.99,0,3.36-.02,4.54-.07,1.17-.06,1.97-.24,2.67-.52.72-.28,1.34-.66,1.95-1.27.61-.61.98-1.23,1.26-1.95.27-.7.46-1.5.51-2.67.05-1.17.06-1.55.06-4.54,0-2.99-.02-3.36-.07-4.53-.06-1.17-.24-1.97-.52-2.67-.28-.72-.66-1.34-1.27-1.95-.61-.61-1.23-.99-1.95-1.26-.7-.27-1.5-.46-2.67-.51-1.17-.05-1.55-.06-4.54-.06-2.99,0-3.36.02-4.53.07m.13,19.89c-1.07-.05-1.65-.22-2.04-.37-.51-.2-.88-.44-1.27-.82-.39-.38-.62-.75-.83-1.26-.15-.39-.33-.97-.38-2.04-.05-1.16-.07-1.51-.07-4.44,0-2.94,0-3.28.06-4.44.05-1.07.23-1.65.37-2.04.2-.51.44-.88.82-1.27.38-.39.75-.62,1.26-.83.39-.15.97-.33,2.04-.38,1.16-.05,1.51-.07,4.44-.07,2.94,0,3.28,0,4.45.06,1.07.05,1.65.22,2.04.37.51.2.88.44,1.27.82.39.38.62.75.83,1.26.15.39.33.97.38,2.04.06,1.16.07,1.51.07,4.44,0,2.94,0,3.28-.06,4.44-.05,1.07-.22,1.66-.37,2.04-.2.51-.44.88-.82,1.27-.38.38-.75.62-1.26.83-.39.15-.97.33-2.04.38-1.16.05-1.51.07-4.45.07-2.94,0-3.28,0-4.44-.06m8.97-14.84c0,.73.59,1.32,1.32,1.32.73,0,1.32-.59,1.32-1.32,0-.73-.59-1.32-1.32-1.32s-1.32.59-1.32,1.32m-10.19,5.89c0,3.12,2.54,5.64,5.66,5.64,3.12,0,5.64-2.54,5.64-5.66,0-3.12-2.54-5.64-5.66-5.64-3.12,0-5.64,2.54-5.64,5.66m1.98,0c0-2.02,1.64-3.67,3.66-3.67,2.02,0,3.67,1.63,3.67,3.66,0,2.03-1.63,3.67-3.66,3.67-2.02,0-3.67-1.63-3.67-3.66" fill="%23222222"/></svg>')
}
.contWrap footer .inner small{font-size:.7rem;text-align:center}

@media only screen and (max-width: 768px){
  .contWrap footer .inner .groupList{max-width:430px}
  .contWrap footer .inner .groupList li:nth-of-type(5){border-right:1px solid #767676}
  .contWrap footer .inner .groupList li:nth-of-type(n+4){margin-top:6px}
}
@media only screen and (max-width: 480px){
  .contWrap footer .inner .groupList li:nth-of-type(3),.contWrap footer .inner .groupList li:nth-of-type(7){border-right:1px solid #767676}
  .contWrap footer .inner .groupList li:nth-of-type(n+3){margin-top:6px}
  .contWrap footer .inner nav section div{width:100%}
  .contWrap footer .inner nav section div h3.img a{height:54px}
  .contWrap footer .inner nav section div h3.img a.about,.contWrap footer .inner nav section div h3.img a.commitment,.contWrap footer .inner nav section div h3.img a.recruit{width:100%}
  .contWrap footer .inner nav section div h3.img a.btn{position:relative}
  .contWrap footer .inner nav section div h3.img a.btn span.cross{position:absolute;top:18px;right:0;height:18px;width:18px}
  .contWrap footer .inner nav section div h3.img a.btn span.cross>span{display:block;height:1px;width:calc(100% - 5px);background:#333;transition:.8s cubic-bezier(0.165, 0.84, 0.44, 1)}
  .contWrap footer .inner nav section div h3.img a.btn span.cross>span:nth-of-type(1){position:absolute;top:calc(50% - .5px)}
  .contWrap footer .inner nav section div h3.img a.btn span.cross>span:nth-of-type(2){position:absolute;top:calc(50% - .5px);transform:rotate(90deg)}
  .contWrap footer .inner nav section div h3.img.active a.btn span.cross>span{transition:.8s cubic-bezier(0.165, 0.84, 0.44, 1)}
  .contWrap footer .inner nav section div h3.img.active a.btn span.cross>span:nth-of-type(2){top:calc(50% - .5px);transform:rotate(0)}
  .contWrap footer .inner nav section div h3+ul{display:none;margin:0 auto 18px;width:100%}
  .contWrap footer .inner nav section div h3+ul li{margin-bottom:12px}
  .contWrap footer .inner nav section div:last-of-type{margin-top:18px}
  .contWrap footer .inner nav section div:last-of-type h3{font-size:.8rem}
}

/* ---------- Pagetop (circular w/ dasharray draw-on-hover) ---------- */
#pagetop{
  overflow:hidden; width:50px; height:50px; position:fixed; cursor:pointer; z-index:10;
  bottom:18px; right:18px; transform:translateY(170%);
  transition:1s cubic-bezier(0.165, 0.84, 0.44, 1);
}
#pagetop:before{
  content:""; position:absolute; top:0; z-index:-1;
  background:#3a3a3a; border-radius:50px; width:100%; height:100%;
  transition:1s cubic-bezier(0.165, 0.84, 0.44, 1);
}
#pagetop.active{transform:translate(0);transition:1s cubic-bezier(0.165, 0.84, 0.44, 1)}
#pagetop.active:hover:before{background:#fff}
#pagetop p{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;width:100%;height:100%}
#pagetop p svg.arrow{width:50%;transform:rotate(-90deg);fill:#fff}
#pagetop svg.roundBtnLine{position:absolute;z-index:11;left:0;top:0;width:100%;height:100%}
#pagetop svg.roundBtnLine rect{
  position:absolute; top:0; left:0; width:calc(100% - 1px); height:calc(100% - 1px);
  transform:translate(0.5px, 0.5px); fill:none; stroke:#1A1A1A; stroke-width:1;
  stroke-dasharray:0,50; stroke-dashoffset:50;
  transition:all 1s cubic-bezier(0, 0.7, 0, 1); backface-visibility:hidden;
}
#pagetop:hover:before{background:#fff}
#pagetop:hover p{animation:linkhover2 .8s cubic-bezier(0.645, 0.045, 0.355, 1)}
#pagetop:hover p svg.arrow{fill:#1A1A1A}
#pagetop:hover svg.roundBtnLine rect{stroke-width:1;stroke-dasharray:50,0;stroke-dashoffset:0}

/* ---------- Breadcrumb (secondary pages) ---------- */
.contWrap .breadcrumb{
  width:90%; max-width:750px; margin:36px auto 0; padding:18px 0 0;
  border-top:1px solid #1A1A1A; font-size:.8rem; display:flex; flex-wrap:wrap;
}
.contWrap .breadcrumb li{margin-right:12px;position:relative;letter-spacing:0}
.contWrap .breadcrumb li:not(:last-child):after{content:"/";position:absolute;right:-8px}

/* ---------- Reduce motion ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}
}
