.c-page-header{overflow:hidden;position:relative;display:grid;grid-template-rows:1fr auto;background-color:#0a0d09b3;margin-inline:auto;width:calc(100% - 40px);height:134px;margin-top:18px;border-radius:24px}@media screen and (min-width:1281px){.c-page-header{width:calc(100% - 120px);height:200px;margin-top:36px}}.c-page-header__video{overflow:hidden;position:absolute;width:100%;height:100%;pointer-events:none}.c-page-header__video video{position:absolute;width:100%;height:100%;object-fit:cover}.c-page-header__video:after{content:"";position:absolute;top:0;left:0;display:block;width:100%;height:100%;background-color:#1f2c32b3;background-image:url(https://static.nexon.co.jp/mabinogimobile/official_SUet1U2lbpVnyhZI/common/pageHeader-dot.webp);background-size:16px 16px;pointer-events:none}.c-page-header__top{position:relative;display:flex;align-items:center;justify-content:center;gap:20px}.c-page-header__breadcrumb{display:flex;align-items:center;justify-content:center;gap:5px;color:#fff0df;outline:2px solid #fff0df;width:fit-content;padding:6px 10px;border-radius:10px}@media screen and (min-width:1281px){.c-page-header__breadcrumb{padding:8px 10px}}.c-page-header__breadcrumb-icon{display:inline-block;width:16px;height:16px;background-image:url(https://static.nexon.co.jp/mabinogimobile/official_SUet1U2lbpVnyhZI/common/pageheader-icon.svg);background-size:contain;background-repeat:no-repeat}.c-page-header__breadcrumb-arrow{position:relative;display:inline-block;width:3px;height:5px}.c-page-header__breadcrumb-arrow:before,.c-page-header__breadcrumb-arrow:after{content:"";position:absolute;top:calc(50% - .5px);right:0;width:4px;height:1px;border-radius:9999px;background-color:#fff0df;transform-origin:calc(100% - .5px) 50%}.c-page-header__breadcrumb-arrow:before{rotate:45deg}.c-page-header__breadcrumb-arrow:after{rotate:-45deg}.c-page-header__breadcrumb-text{font-weight:700;font-size:12px}@media screen and (min-width:1281px){.c-page-header__breadcrumb-text{font-weight:600;font-size:13px}}.c-page-header__title{color:#fff0df;text-shadow:0 0 10px rgba(0,0,0,.5);font-weight:700;font-size:20px}@media screen and (min-width:1281px){.c-page-header__title{font-weight:600;font-size:40px}}.c-page-header__link{position:relative;background-color:#00000080;padding:0 26px;height:50px}@media screen and (min-width:1281px){.c-page-header__link{padding:0;height:52px}}.c-page-header__link-swiper{height:100%}.c-page-header__link-inner,.c-page-header__link-inner.swiper-wrapper{position:relative;width:fit-content;height:100%;margin-inline:auto}.c-page-header__link-list,.c-page-header__link-list.swiper-slide{display:flex;align-items:center;justify-content:center;width:auto;height:auto;color:#fff9;font-size:14px;padding:0 5px;transition:color .15s ease}@media screen and (min-width:1281px){.c-page-header__link-list,.c-page-header__link-list.swiper-slide{font-size:18px;padding:0 8px}}.c-page-header__link-list:not(:last-child),.c-page-header__link-list.swiper-slide:not(:last-child){margin-right:20px}@media screen and (min-width:1281px){.c-page-header__link-list:not(:last-child),.c-page-header__link-list.swiper-slide:not(:last-child){margin-right:60px}}.c-page-header__link-list:before,.c-page-header__link-list.swiper-slide:before{content:"";display:block;position:absolute;left:0;bottom:13px;width:100%;border-bottom:12px solid rgba(0,182,112,.5);border-radius:100vmax;opacity:0;transition:opacity .2s ease}.c-page-header__link-list.is-active,.c-page-header__link-list.swiper-slide.is-active{position:relative;color:#fff;font-weight:700}.c-page-header__link-list.is-active:before,.c-page-header__link-list.swiper-slide.is-active:before{opacity:1}.c-page-header__link-list.is-active .c-page-header__link-icon use,.c-page-header__link-list.swiper-slide.is-active .c-page-header__link-icon use{fill:#fff}@media(any-hover:hover){.c-page-header__link-list:hover,.c-page-header__link-list.swiper-slide:hover{position:relative;color:#fff;font-weight:700}.c-page-header__link-list:hover:before,.c-page-header__link-list.swiper-slide:hover:before{opacity:1}.c-page-header__link-list:hover .c-page-header__link-icon use,.c-page-header__link-list.swiper-slide:hover .c-page-header__link-icon use{fill:#fff}}.c-page-header__link-list span,.c-page-header__link-list.swiper-slide span{position:relative}.c-page-header__link-icon{display:inline-block;width:13px;margin-left:4px;vertical-align:top}.c-page-header__link-icon use{fill:#fff9}
