@charset "utf-8";

/* root */
:root {
  --color-muted:       #777;
  --color-line:        #ddd;
  --color-line-soft:   #ececec;
  --color-bg:          #f7f7f7;
  --color-dark:        #242b33;
  --color-blue:        #0066B3;
  --color-green:       #BAD868;
  --color-mint:        #1CBECA;
  --color-orange:      #F15A22;

  --inner:       166rem;
  --sub_inner:   146rem;
  --inner-pad:   2rem;
  --shadow-sm:   0 .6rem 1.6rem rgba(0,0,0,.08);
  --shadow-md:   0 1.2rem 3.2rem rgba(0,0,0,.12);

  /* partners marquee — controlled via tokens */
  --partners-item-w: 22rem;
  --partners-gap:    4.8rem;
}


/* common */
.a11y, .blind {width:1px; height:1px; overflow:hidden; position:absolute; top:-9999em; left:-9999em; display:block; text-indent:-9999em; font-size:0 !important; line-height:0 !important;}
.pc_block {display:block;}
.m_block {display:none;}

body {min-width:320px; overflow-x:hidden;}
.inner{width:100%; max-width:var(--inner); margin:0 auto; padding:0 var(--inner-pad);}

/* header */
.site-header { position: fixed; top: 0; left: 0; z-index: 1000; width: 100%; height: 10rem; background: transparent; transition: background-color .3s ease, backdrop-filter .3s ease, box-shadow .3s ease, transform .3s ease; }
.site-header__inner { height: 100%; display: flex; align-items: center; justify-content: space-between; gap: 2rem; }
.site-logo { position: relative; display: block; width: 26.2rem; height: 4rem; flex-shrink: 0; filter: brightness(0) invert(1); }
.site-logo::before { content: ""; position: absolute; inset: 0; display: block; background: url(../img/layout/logo.svg) no-repeat center center / 100% 100%; }

.gnb-wrap { display: flex; align-items: center; gap: 4rem; height:100%; }
.gnb { height: 100%; }
.gnb__list { height: 100%; display: flex; align-items: center; gap: 5rem; }
.gnb__item { position: relative; height: 100%; display: flex; align-items: center; }
.gnb__link { position: relative; display: inline-flex; align-items: center; gap: .5rem; height: 100%; color: #fff; font-size: 1.8rem; font-weight: 700; letter-spacing: -.02em; transition: color .3s ease; white-space: nowrap; }
.gnb__link[target="_blank"]::after {content: "";display: inline-block;width: 1.4rem;height: 1.4rem;margin-left: 0.5rem;background: url('../img/default/arrow_top-right.svg') no-repeat center center / 1rem; transition: color .3s ease;  vertical-align: middle;filter: brightness(1) invert(1);position: relative;top: -0.5rem;}
.gnb__item:hover .gnb__link{ color: var(--color-mint); }
.gnb__item:hover .gnb__link[target="_blank"]::after {background: url('../img/default/arrow_top-right-mint.svg') no-repeat center center / 1.9rem; filter:none; }
/* .gnb__link::before { content: ""; position: absolute; left: 0; bottom: 3.2rem; width: 0; height: .2rem; background: currentColor; transition: width .25s ease; }
.gnb__item:hover > .gnb__link::before, .gnb__link:focus-visible::before { width: 100%; } */
.gnb__sub { position: absolute; top: 8rem; left: 50%; transform: translateX(-50%) translateY(-1rem); min-width: 20rem; padding: 3rem; background: var(--color-blue); border-radius: 1rem; box-shadow: 0 1.6rem 4rem rgba(0,0,0,.22); opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .22s ease, transform .22s ease, visibility .22s ease; z-index: 200; display: flex; gap:0.5rem; flex-direction: column; justify-content: center; align-items: center; }
.gnb__sub::before {content: "";position: absolute;top: -0.5rem;left: 50%;transform: translateX(-50%);width: 1rem;height: 1rem;border-radius: 50%;background: var(--color-mint);}
.gnb__sub-link {display: block;padding: 1rem .4rem;font-size: 1.6rem; color: #fff;  text-align: center; line-height: 1.3;}
.gnb__sub-link:hover{ color: var(--color-mint); }
.gnb__item:hover > .gnb__sub { opacity: 1; visibility: visible; pointer-events: auto; transform: translateX(-50%) translateY(0); }
.gnb__item:nth-child(3) > .gnb__sub { min-width: 30rem; }
.header-utils { display:flex; align-items:center; }
.header-utils__link, .header-utils__btn { width:3.6rem; height:3.6rem; display:inline-flex; align-items:center; justify-content:center; border-radius:50%; background:url('../img/layout/menu_btn.svg') no-repeat center center;}
.header-utils__link { filter:brightness(0) invert(1); }
.header-utils__btn { filter:brightness(0) invert(1); }

.site-header.is-sub { background: #fff; backdrop-filter: none; border-bottom: 1px solid #eee;}
.site-header.is-sub .site-logo { filter: none; }
.site-header.is-sub .gnb__link { color: #222; }
.site-header.is-sub .gnb__item:hover .gnb__link{ color: var(--color-mint); }
.site-header.is-sub .gnb__link[target="_blank"]::after { filter: none }
.site-header.is-sub .header-utils__link, .site-header.is-sub .header-utils__btn { filter:none; }

.site-header.is-fixed { background: #fff; backdrop-filter: none; box-shadow: 0 .8rem 2rem rgba(0,0,0,.06); }
.site-header.is-fixed .site-logo { filter: none; }
.site-header.is-fixed .gnb__link { color: #222; }
.site-header.is-fixed .gnb__item:hover .gnb__link{ color: var(--color-mint); }
.site-header.is-fixed .gnb__link[target="_blank"]::after { filter: none }
.site-header.is-fixed .header-utils__link, .site-header.is-fixed .header-utils__btn { filter:none; }


@media (min-width:1201px) { 
  .header-utils__link { display:inline-flex; } 
  .header-utils__btn { display:none; } 
}
@media (max-width:1200px) { 
  :root { --header-h:8rem; } 
  .gnb { display:none; } 
  .header-utils__link { display:none; } 
  .header-utils__btn { display:inline-flex; } 
  .site-header{height:8rem;}
  .site-logo{width: 22rem; height: 3rem;}
}
@media (max-width:768px) { 
  :root { --header-h:7.2rem; --inner-pad:1.6rem; }
   .site-logo { min-width:auto; gap:1rem; } 
   .site-logo__text { font-size:1.4rem; } 
   .header-utils { gap:.8rem; }
}

.mob-gnb-overlay { position:fixed; inset:0; background:rgba(0,0,0,.45); z-index:1099; opacity:0; visibility:hidden; transition:opacity .3s ease, visibility .3s ease; }
.mob-gnb-overlay.is-open { opacity:1; visibility:visible; }
.mob-gnb { position:fixed; top:0; right:0; z-index:1100; width:min(36rem, 90vw); height:100%; background:#fff; display:flex; flex-direction:column; transform:translateX(100%); transition:transform .35s cubic-bezier(.4,0,.2,1); overflow:hidden; visibility:hidden; }
.mob-gnb.is-open { transform:translateX(0); visibility:visible; }
.mob-gnb__head { display:flex; align-items:center; justify-content:space-between; padding:2rem 1rem 2rem 2rem; border-bottom:1px solid var(--color-line-soft); flex-shrink:0; }
.mob-gnb__title { font-size: 1.8rem; font-weight: 700; font-family: 'OnemobileT'; }
.mob-gnb__close {background:#f0f0f0; width:4rem; height:4rem; display:inline-flex; align-items:center; justify-content:center; border-radius:50%; font-size:2.4rem; color:#555; line-height:1; transition:background .2s ease; }
.mob-gnb__body { flex:1; overflow-y:auto; -webkit-overflow-scrolling:touch; padding-bottom:4rem;    background: url(../img/default/emblemRode.svg) no-repeat right 1rem bottom 1rem / 18rem; }
.mob-gnb__item { position:relative; border-bottom:1px solid var(--color-line-soft); }
.mob-gnb__link { width:100%; display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1.8rem 2.4rem; font-size:1.6rem; font-weight:700; color:#111; letter-spacing:-.02em; text-align:left; background:#fff; transition:background .15s ease, color .15s ease; }
.mob-gnb__item.has-sub > .mob-gnb__link::after { content:""; width:1rem; height:1rem; border-right:.2rem solid currentColor; border-bottom:.2rem solid currentColor; flex-shrink:0; margin-top:-.4rem; transform:rotate(45deg); transition:transform .25s ease, margin-top .25s ease; }
.mob-gnb__item.is-open > .mob-gnb__link { color:var(--color-mint); background:#f9f9f9}
.mob-gnb__item.is-open > .mob-gnb__link::after { transform:rotate(-135deg); margin-top:.2rem; }
.mob-gnb__item:not(.has-sub) > .mob-gnb__link[target="_blank"]::after { content:""; display:inline-block; width:1.4rem; height:1.4rem; flex-shrink:0; margin-left:.6rem; background:url('../img/default/arrow_top-right.svg') no-repeat center center / 1rem; }
.mob-gnb__panel { display:none;  padding:.8rem 0 1.2rem; }
.mob-gnb__panel > li > .mob-gnb__sub-link { display:flex; align-items:center; gap:.8rem; padding:1.1rem 2.4rem 1.1rem 3.4rem; font-size:1.5rem; font-weight:500; transition:color .15s ease; }
.mob-gnb__panel > li > .mob-gnb__sub-link::before { content:""; width:.5rem; height:.5rem; border-radius:50%; background:var(--color-mint); flex-shrink:0; opacity:.55; transition:opacity .15s ease; }
.mob-gnb__panel > li > .mob-gnb__sub-link:hover { color:var(--color-mint); }
.mob-gnb__panel > li > .mob-gnb__sub-link:hover::before { opacity:1; }
@media (min-width:1201px) { .mob-gnb, .mob-gnb-overlay { display:none !important; } }


/* footer */
.site-footer { background: #2C3236; color: rgba(255,255,255,.78); padding: 5rem 0 7rem; }
.site-footer__top {display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding-bottom: 2.6rem; border-bottom: 1px solid #484D51;}
.footer-links { display: flex; flex-wrap: wrap; gap: 2.4rem; }
.footer-links a { font-weight: 500; color: rgba(255,255,255,.76); transition: color .2s ease; }
.footer-links a:hover { color: #fff; }
.footer-links a.is-point { color: var(--color-mint); font-size: 1.7rem;  font-weight: 600;}

.footer-family-wrap {position: relative;min-width: 25rem;}
.footer-family {display: flex;align-items: center;justify-content: space-between;width: 100%;color: rgba(255, 255, 255, .82);transition: border-color .25s ease;font-size: 1.6rem;}
.footer-family:hover { border-color: rgba(255,255,255,.42); }
.footer-family__arrow { width:1.8rem; height:1.8rem; background: url(../img/default/arrow_updown.svg) no-repeat center center / 100%; transition: transform .25s ease; }
.footer-family[aria-expanded="true"] .footer-family__arrow { transform: rotate(180deg); }
.footer-family-list {position: absolute;right: 0;bottom: calc(100% + 3.2rem);min-width: 26rem;padding: 1rem;background: #fff;border-radius: 1rem;box-shadow: 0 1.2rem 3.2rem rgba(0,0,0,.18);border: 1px solid #eee;opacity: 0;visibility: hidden;transform: translateY(1rem);transition: opacity .25s ease, visibility .25s ease, transform .25s ease;z-index: 10;}
.footer-family-wrap.is-open .footer-family-list {opacity: 1; visibility: visible; transform: translateY(0);}
.footer-family-list li + li { margin-top: .4rem; }
.footer-family-list a {display: flex; align-items: center; justify-content: space-between; padding: 1.2rem 1.4rem; border-radius: 1rem; font-size: 1.4rem; color: #222; transition: background .2s ease;}
.footer-family-list a:hover { background: #f5f6f7; }

.site-footer__bottom {padding-top: 3rem; display: flex; align-items: flex-start; justify-content: space-between; gap: 3.5rem;}
.footer-brand { display: flex; align-items: center; gap: 1.6rem; color: rgba(255,255,255,.5); }
.footer-brand .f-logo { width: 22rem; height: 3.6rem; background: url(../img/layout/logo.svg) no-repeat center center / 100%; mix-blend-mode: luminosity; }
.footer-info {flex: 1;color: #fff;font-style: normal;margin-top: 0.5rem;}
.footer-copy {margin-top: 2rem;font-size: 1.4rem;color: rgba(255,255,255,.45);letter-spacing: -0.02em;}


/* Footer responsive */
@media (max-width: 1200px) { .site-footer__bottom { flex-direction: column; align-items: flex-start; } }
@media (max-width: 768px) {
  .site-footer__top { flex-direction: column; align-items: flex-start; gap: 3.5rem; border-bottom:0;padding-bottom: 0; }
  .footer-links a{font-size:1.5rem;}
  .footer-links a.is-point{font-size:1.5rem;}
  .footer-family-wrap{min-width:100%;}
  .footer-family{border: 1px solid #484D51; padding: 1.5rem; border-radius: 1rem;}
  .footer-family-list { left: 0; right: auto; min-width: 100%; bottom: 5.2rem;}
  .footer-info{margin-top:0;font-size: 1.5rem;}
}
@media (max-width: 480px) { .footer-links { gap: 1.6rem; } }



/*quick link*/
.ql-btn {position: fixed; right: 2.5rem;  bottom: 4%; z-index: 100; width: 15rem; height: 15rem;}
.ql-ring {position: absolute; inset: 0; width: 100%; height: 100%; animation: ql-spin 15s linear infinite;}
.ql-ring text {font-size: 1.1rem;fill: var(--color-mint);font-weight: 700;letter-spacing: 1.2px;}
.ql-inner { position: absolute; inset: 2.2rem; border-radius: 50%; background: linear-gradient(130deg, #BAD868 0%, #0066B3 56%, #1CBECA 100%); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1rem; transition: filter .25s ease;box-shadow: var(--shadow-sm);}
.ql-icon{width:2.4rem; height:2.4rem;background:url(../img/layout/icon_quicklink.svg) no-repeat center center / contain;}
.ql-label{font-size:1.6rem; color:#fff;}
.ql-btn:hover .ql-ring { animation-play-state: paused; }
.ql-btn:hover .ql-inner { filter: brightness(1.1); }

@keyframes ql-spin {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

@media (max-width:1640px){
  .ql-btn{right: 1rem; bottom: 2rem;}
}

@media (max-width:980px){
  .ql-btn{width: 13rem; height: 13rem;}
  .ql-inner{gap: 0.8rem;}
  .ql-icon{width:1.8rem; height:1.8rem;}
  .ql-label{font-size:1.5rem;}
}


/* sub layout */
#s-container {position:relative; padding:10rem 0 0; min-width:32rem;}
#s-container .inner{max-width:var(--sub_inner)}
/* subtop navigation */
.sub-vis{position:relative;padding:8rem 0 4rem;background:#f5f5f5;overflow:hidden;}
.sub-vis::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 20% 30%, rgba(172,212,170,.18) 0, rgba(172,212,170,0) 18%),radial-gradient(circle at 75% 20%, rgba(115,203,221,.18) 0, rgba(115,203,221,0) 16%),radial-gradient(circle at 78% 72%, rgba(249,162,107,.16) 0, rgba(249,162,107,0) 14%);}
.sub-vis .inner{position:relative;z-index:1;}
.sub-vis__head{position: relative; min-height: 22rem; display: flex; flex-direction: column; align-items: center; justify-content: center;}
.sub-vis__head:after{content:'';position:absolute;left: 10rem;bottom: -5.5rem;width: 30rem;height:23rem;background:url(../img/layout/sub_visdesc-bottom.svg) no-repeat center center;}
.sub-vis__head:before{content:'';position:absolute;right: 32rem;top: -7.5rem;width: 38rem;height:24rem;background:url(../img/layout/sub_visdesc-top.svg) no-repeat center center;}
.sub-vis__title{font-size: 3.8rem;line-height:1.3;font-weight:700;font-family: 'OnemobileT';text-align:center;}
.sub-vis__logo{position:absolute;right:0;bottom: 0;display: flex; align-items: center; gap: 1rem;}
/* .sub-vis__logo-img {width:13rem; height:10rem; background:url(../img/default/emblemLogo.svg) no-repeat center center / 13rem; animation: emblemWholeIdle 2.8s ease-in-out 1.7s infinite;} */
.sub-vis__logo-img{ width: 23rem; height: 23rem; background: url(../img/default/emblemLogo.svg) no-repeat center center / 23rem; animation: emblemWholeIdle 2.8s ease-in-out 1.7s infinite; opacity: 0.2;}
@keyframes emblemWholeIdle {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-0.2rem) rotate(2deg); }
}
/* .sub-vis__logo-txt{width:24.8rem;height:9.8rem;background:url(../img/layout/sub_vistxt.svg) no-repeat center center;transform: translateY(0.9rem);} */

.sub-loc{}
.sub-loc__list{display:flex;align-items:center;border: 1px solid #e9e9e9;border-radius:1rem;overflow:visible;background: #F6F8FA; padding:0 1rem;}
.sub-loc__item{position:relative;flex:0 0 auto;}
.sub-loc__item + .sub-loc__item::before{content:"";position:absolute;left:0;top:50%;width:1px;height:1.6rem;background: #e5e5e5;transform:translateY(-50%);z-index: 1;}

.sub-loc__item--home{width:7rem;}
.sub-loc__home{display:flex;align-items:center;justify-content:center;height: 7rem;background:url(../img/layout/icon_home.svg) no-repeat center center;}

.sub-loc__item--depth{min-width:33rem;}
.sub-loc__drop{position:relative;}
.sub-loc__btn{position:relative;width:100%;height: 7rem;padding:0 4.8rem 0 2rem;color: #000;font-size:1.6rem;font-weight:700;text-align:left;background: #f6f8fa;border:0;cursor:pointer;transition: color .15s ease;}
.sub-loc__btn::after{content:"";position:absolute;right:2rem;top:50%;transform: translateY(-50%); width:3rem;height:3rem; background:url(../img/layout/sub_nav-arrow.svg) no-repeat center center; transition:transform .25s ease;}
.sub-loc__drop.is-open .sub-loc__btn::after{transform:translateY(-50%) rotate(-180deg);}
.sub-loc__drop.is-open .sub-loc__btn{color:var(--color-mint);}

.sub-loc__menu{position:absolute;left:-1px;top: calc(100% - 0.5rem);width:calc(100% + 2px);background:#fff;border: 1px solid #e9e9e9;border-radius:0 0 1rem 1rem;box-shadow:0 1rem 2rem rgba(0,0,0,.08);display:none;z-index:20;}
.sub-loc__drop.is-open .sub-loc__menu{display:block;}
.sub-loc__menu li{display:block;}
.sub-loc__link{display:block;padding: 1.5rem 2rem; font-size:1.6rem; line-height:1.4;transition:background .2s ease,color .2s ease;}
.sub-loc__link:hover{background:#f7f7f7;color:#111;}
.sub-loc__link.is-current{font-weight:700;background: #f6f8fa;color: var(--color-mint);}
.sub-loc__menu li:last-child .is-current{border-radius: 0 0 1rem 1rem;} 

.blind{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}

@media (max-width:1200px){
  #s-container{padding:8rem 0 0;}
  .sub-vis__logo{display:none;}
  .sub-vis__head:after{left: 0;bottom: -5.5rem;width: 30rem;height:23rem;}
  .sub-vis__head:before{right:0;top: -7.5rem;width: 38rem;height:24rem;}
  .sub-vis__title{font-size:3.2rem;}
  .sub-vis__head{min-height:20rem;}
}

@media (max-width:980px){
  .sub-loc__item--depth.first{display:none;}
  .sub-loc__item--depth{ min-width: 0;  flex: 1 1 auto;}
}

@media (max-width:640px){
  .sub-vis__head {min-height: 16rem;}
  .sub-vis__head:before {display:none;}
  .sub-vis__head:after{display:none;}
  .sub-vis__title{font-size:2.6rem;}
  .sub-loc__item--home{width:6rem;}
  .sub-loc__home{height:6rem; bacgkround-size:1.4rem;}
  .sub-loc__btn{height:6rem; padding: 0 4.2rem 0 2rem;}
  .sub-loc__btn::after{right:1.5rem;}
}

/* subcontents */
#sub-content {position:relative; padding:0 0 18rem;}
#stance, #stance-cn {position:relative; width:100%; min-height:48rem; padding-top:10rem; background:#ffffff;}

@media screen and (max-width:640px){
	#stance, #stance-cn{padding-top: 7rem;}
}