﻿a,
abbr,
acronym,
address,
applet,
article,
aside,
audio,
b,
big,
blockquote,
body,
canvas,
caption,
center,
cite,
code,
dd,
del,
details,
dfn,
div,
dl,
dt,
em,
embed,
fieldset,
figcaption,
figure,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
html,
i,
iframe,
img,
ins,
kbd,
label,
legend,
li,
mark,
menu,
nav,
object,
ol,
output,
p,
pre,
q,
ruby,
s,
samp,
section,
small,
span,
strike,
strong,
sub,
summary,
sup,
table,
tbody,
td,
tfoot,
th,
thead,
time,
tr,
tt,
u,
ul,
var,
video {
    font: inherit;
    font-size: 100%;
    margin: 0;
    padding: 0;
    vertical-align: baseline;
    border: 0
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block
}

html {
    font-size: 62.5%
}

ul {
    list-style: none
}

body {
    font-family: Noto Sans JP, YuGothic, Yu Gothic, ヒラギノ角ゴシック, Hiragino Sans, sans-serif;
    font-size: 1.6rem;
    font-weight: 400;
    color: #354768
}

body.drawer-active {
    overflow: hidden
}

body:before {
    z-index: 4;
    content: "";
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .7);
    opacity: 0;
    transition: .3s;
    display: none
}

body.header-nav-active:before {
    opacity: 1;
    display: block
}

body.header-nav-active #header {
    background-color: #fff
}

@media screen and (min-width:768px) {
    body {
        min-width: 80pc
    }
}

@media screen and (max-width:767px) {
    body {
        font-size: 1.4rem
    }
}

a {
    text-decoration: none;
    color: #354768;
    outline: 0
}

img {
    display: block;
    max-width: 100%;
    height: auto;
    backface-visibility: hidden;
    image-rendering: auto
}

@media screen and (max-width:767px) {
    img {
        width: 100%
    }
}

@media screen and (max-width:767px) {
    .pc {
        display: none
    }
}

@media screen and (min-width:768px) {
    .sp {
        display: none
    }
}

@media screen and (min-width:768px) {
    .wrap {
        max-width: 885pt;
        margin: auto;
        padding: 0 10px
    }
}

@media screen and (max-width:767px) {
    .wrap {
        padding: 0 30px
    }
}

:root {
    --header: 90px;
    scroll-padding: calc(var(--header)+30px);
    scroll-behavior: smooth
}

@media screen and (max-width:767px) {
    :root {
        --headerSP: 13.3333333333vw
    }
}

#header {
    position: fixed;
    z-index: 5;
    left: 50%;
    box-sizing: border-box;
    width: 100%;
    height: var(--header);
    position: sticky;
    padding: 0 2.5vw;
    top: 0
}

#header.header--service {
    background-color: #f4f4f6
}

#header.is-fixed {
    background-color: #fff
}

@media screen and (max-width:767px) {
    #header {
        height: var(--headerSP)
    }
}

@media screen and (min-width:768px) {
    #header {
        min-width: 75pc
    }
}

@media screen and (max-width:767px) {
    #header {
        padding: 0 5.3333333333vw
    }
}

.header-inner {
    display: flex;
    align-items: center;
    height: 90px
}

@media screen and (min-width:768px) {
    .header-inner {
        max-width: 95pc;
        margin: 0 auto
    }
}

@media screen and (max-width:767px) {
    .header-inner {
        height: 13.3333333333vw
    }
}

.header-logo {
    min-width: 0;
    max-width: 15pc;
    margin-right: 6.6448%
}

.header-logo a,
.header-logo svg {
    display: block
}

@media screen and (min-width:768px) {
    .header-logo {
        flex: 1;
        min-width: 170px
    }
}

@media screen and (max-width:767px) {
    .header-logo {
        max-width: 45.3333333333vw;
        margin-right: auto
    }
}

.global-nav {
    flex-shrink: 0;
    min-width: 0;
    margin-right: auto
}

.global-nav>ul {
    font-weight: 700;
    display: flex;
    justify-content: space-between
}

.global-nav>ul>li {
    display: block;
    min-width: 0
}

.global-nav>ul>li:first-child {
    margin-left: 0
}

.global-nav>ul>li>a {
    font-size: 1.5rem;
    line-height: 1;
    display: block;
    transition: all .3s;
    position: relative
}

.global-nav>ul>li>a:after {
    position: absolute;
    content: "";
    left: 0;
    right: 0;
    bottom: -9pt;
    width: 0;
    margin: auto;
    height: 4px;
    background-color: #0169b6;
    transition: .3s
}

.global-nav>ul>li>a:hover {
    opacity: .7
}

.global-nav>ul>li>a:hover:after {
    width: 100%
}

.global-nav>ul>li>a span {
    position: relative;
    display: inline-block;
    padding-right: 9pt
}

.global-nav>ul>li>a span:after {
    position: absolute;
    top: 6px;
    right: 0;
    display: inline-block;
    width: 9px;
    height: 6px;
    content: "";
    background: url(../images/common/icon_arrow.svg)center/contain no-repeat
}

@media screen and (max-width:767px) {
    .global-nav {
        display: none
    }
}

@media screen and (min-width:768px) {
    .global-nav>ul>li {
        margin-left: clamp(20px, 2vw, 32px)
    }
}

@media screen and (min-width:768px) {
    .ul-wrap {
        position: absolute;
        z-index: 1;
        top: 100%;
        right: 0;
        left: 0;
        visibility: hidden;
        width: 100%;
        box-sizing: border-box;
        padding: 35px 0 70px;
        transition: opacity .2s ease-in-out, transform .35s cubic-bezier(0.215, 0.61, 0.355, 1);
        transform: translate(0, -20px);
        opacity: 0;
        background-color: #fff
    }

    .ul-wrap.is-show {
        visibility: visible;
        transform: translate(0, 0);
        opacity: 1
    }
}

#drawer-trigger {
    position: relative;
    z-index: 7;
    width: 8vw;
    height: 8vw;
    cursor: pointer;
    transition: .6s;
    border-radius: 50%
}

#drawer-trigger span {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: block;
    width: 4.2666666667vw;
    height: .5333333333vw;
    margin: auto;
    transition: .6s;
    background-color: #354768
}

.ul-wrap-list {
    max-width: 885pt;
    margin: 0 auto;
    box-sizing: border-box;
    padding-left: 170px
}

.ul-wrap-list__list>li:nth-child(7)>a>span {
    font-size: 11px
}

.ul-wrap-list__list>li:nth-child(18):before {
    list-style-type: none
}

.ul-wrap-list:not(:last-child) {
    margin-bottom: 3pc
}

.ul-wrap-list.--nolink ul li a span {
    padding-left: 0
}

.ul-wrap-list.--nolink ul li a:before {
    content: none
}

.ul-wrap-list__ttl {
    font-size: 1.6rem;
    font-weight: 700;
    display: inline-block;
    letter-spacing: .1em;
    transition: .3s;
    position: relative;
    color: #0169b6
}

.--green .ul-wrap-list__ttl {
    color: #299564
}

.--orange .ul-wrap-list__ttl {
    color: #e68f41
}

.ul-wrap-list__ttl:before {
    position: absolute;
    top: 0;
    bottom: 0;
    right: -21px;
    display: inline-block;
    width: 11px;
    height: 9px;
    margin: auto;
    content: "";
    transition: .3s;
    background: url(../images/common/arrow_black.svg)center/contain no-repeat;
    filter: invert(25%) sepia(93%) saturate(1688%) hue-rotate(186deg) brightness(94%) contrast(103%)
}

.--green .ul-wrap-list__ttl:before {
    filter: invert(45%) sepia(76%) saturate(344%) hue-rotate(101deg) brightness(91%) contrast(99%)
}

.--orange .ul-wrap-list__ttl:before {
    filter: invert(67%) sepia(89%) saturate(865%) hue-rotate(329deg) brightness(94%) contrast(91%)
}

.ul-wrap-list__ttl:hover:before {
    right: -31px
}

.ul-wrap-list__list {
    display: flex;
    flex-flow: wrap;
    margin-left: 36px;
    list-style: none;
    row-gap: .5em;
    column-gap: 20px;
    margin-top: .5em
}

.ul-wrap-list__list li {
    width: calc((100% - 80px)/5);
    counter-increment: a
}

.ul-wrap-list__list a {
    display: block;
    font-size: 1.4rem;
    letter-spacing: .1em;
    font-weight: 400;
    transition: .3s;
    position: relative;
    color: #000
}
.ul-wrap-list__list a.building {
    position: relative; /* これが必要 */
}

.ul-wrap-list__list a:before {
    position: absolute;
    top: 1px;
    left: 0;
    font-weight: 700;
    line-height: 1;
    font-size: 1.6rem;
    letter-spacing: 0;
    content: counter(a, decimal-leading-zero);
    color: #000
}

.ul-wrap-list__list li:nth-last-of-type(2) a::before,
.ul-wrap-list__list li:nth-last-of-type(1) a::before {
    content: none;
}


.ul-wrap-list__list a.arrow:before {
    top: 3px;
    left: 2px;
    content: "";
    width: 15px;
    height: 15px;
    background: url(../images/common/arrow_square_blue.svg)center/contain no-repeat
}

.before .ul-wrap-list__list li:nth-last-of-type(2) a::before {
    content: ""; 
    display: block;
    position: absolute;
    top: 1px;
    left: 2px;
    width: 15px;
    height: 20px;
    background: url(../images/common/building_blue.svg) center/contain no-repeat;
}
.before .ul-wrap-list__list li:nth-last-of-type(1) a::before{
    content: ""; /* これだけでOK */
    display: block;
    position: absolute;
    top: 1px;
    left: 1px;
    width: 15px;
    height: 20px;
    background: url(../images/common/sp-blue.svg) center/contain no-repeat;
}
@media screen and (max-width:767px) {
    .ul-wrap-list__list a.arrow:before {
        top: 2px !important;
        left: 0;
        border: 1px solid #fff;
        border-radius: 2px;
        box-sizing: border-box
    }
    .before .ul-wrap-list__list li:nth-last-of-type(2) a::before {
        top: 0px !important;
        left: 0;
        /* border: 1px solid #fff; */
        border-radius: 2px;
        box-sizing: border-box;
            background: url(../images/common/sp-building.svg) center/contain no-repeat;
    }
    .before .ul-wrap-list__list li:nth-last-of-type(1) a::before{
        top: 0px !important;
        left: 0;
        /* border: 1px solid #fff; */
        border-radius: 2px;
        box-sizing: border-box;
        background: url(../images/common/sp-smh.svg) center/contain no-repeat;
    }
  
}

.ul-wrap-list__list.--blue a:before {
    font-weight: 700;
    color: #3669b6
}

.ul-wrap-list__list a.building:before{
    top: 3px;
    left: 2px;
    content: "";
    width: 15px;
    height: 15px;
    background: url(../images/common/building_blue.svg) center / contain no-repeat;
}

.ul-wrap-list__list>li:nth-child(18) a:before {
    content: "";
    counter-increment: none
}

.ul-wrap-list__list>li:nth-child(18) a span {
    padding-left: 9pt
}

.--green .ul-wrap-list__list a,
.--orange .ul-wrap-list__list a {
    color: #000
}

.--no-mark a:before {
    position: absolute;
    top: 1px;
    left: 0;
    line-height: 1;
    font-size: 1.6rem;
    letter-spacing: 0;
    display: none !important;
    color: #000
}

.--hyphen a:before {
    content: "-" !important
}

.--green .ul-wrap-list__list a:before {
    color: #299564
}

.--orange .ul-wrap-list__list a:before {
    color: #000
}

.ul-wrap-list__list a span {
    padding-left: 24px
}

.--no-mark a span,
.ul-wrap-list__list a span {
    display: inline-block;
    position: relative;
    padding-bottom: 4px
}

.--no-mark a span {
    padding-left: 0
}

.ul-wrap-list__list a span:before {
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
    height: 1px;
    width: 0;
    display: block;
    content: "";
    transition: .3s;
    background-color: #0169b6
}

.--green .ul-wrap-list__list a span:before {
    background-color: #299564
}

.--orange .ul-wrap-list__list a span:before {
    background-color: #e68f41
}

.ul-wrap-list__list a:hover {
    color: #0169b6
}

.--green .ul-wrap-list__list a:hover {
    color: #299564
}

.--orange .ul-wrap-list__list a:hover {
    color: #e68f41
}

.ul-wrap-list__list a:hover span:before {
    width: 100%
}

.ul-wrap-list__list a:hover:before {
    color: #0169b6
}

.--green .ul-wrap-list__list a:hover:before {
    color: #299564
}

.--orange .ul-wrap-list__list a:hover:before {
    color: #e68f41
}

@media screen and (min-width:768px) {
    #drawer-trigger {
        display: none
    }
    
}

.drawer-active #drawer-trigger span {
    background-color: transparent
}

#drawer-trigger span:after,
#drawer-trigger span:before {
    position: absolute;
    display: block;
    width: 100%;
    height: inherit;
    content: "";
    transition: .3s;
    background-color: #354768
}

#drawer-trigger span:before {
    top: -1.6vw
}

.drawer-active #drawer-trigger span:before {
    top: 0;
    transform: rotate(45deg)
}

#drawer-trigger span:after {
    top: 1.6vw
}

.drawer-active #drawer-trigger span:after {
    top: 0;
    transform: rotate(-45deg)
}

.header-btn {
    flex: 0 0 275px;
    min-width: 0;
    margin-left: 2vw
}

.header-btn a {
    font-size: 1.5rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: fit-content;
    width: 100%;
    min-height: 50px;
    padding: 10px 15px;
    transition: .3s;
    color: #fff;
    border-radius: 50px;
    background-color: #0169b6;
    filter: drop-shadow(0 0 15px rgba(0, 0, 0, 0.2))
}

.header-btn a:hover {
    background-color: #ff8b21
}

@media screen and (max-width:767px) {
    .header-btn {
        display: none
    }
    .ul-wrap-list__list>li:nth-child(18) a span{
        padding-left: 24px;
    }
}

#drawer-nav {
    position: fixed;
    z-index: 6;
    top: 13.3333333333vw;
    right: 0;
    bottom: 0;
    overflow-y: auto;
    box-sizing: border-box;
    width: 100%;
    height: calc(100vh - 13.3333333333vw);
    padding: 0 8vw 60px;
    transition: .5s;
    pointer-events: none;
    opacity: 0;
    color: #fff;
    background-color: #0169b6
}

#drawer-nav.active {
    pointer-events: all;
    opacity: 1
}

@media screen and (min-width:768px) {
    #drawer-nav {
        display: flex;
        flex-flow: column
    }

    #drawer-nav.active {
        display: none
    }
}

@media screen and (max-width:767px) {
    #drawer-nav {
        padding: 40px 8vw 60px
    }
}

.drawer-nav__wrap {
    max-width: 750pt;
    margin: 0 auto
}

.drawer-menu li+li {
    margin-top: .7em
}

.drawer-menu>ul {
    font-size: 1.8rem
}

.drawer-menu>ul a {
    color: #fff;
    font-weight: 700
}

.drawer-menu>ul a.downArrow {
    display: inline-flex;
    align-items: center
}

.drawer-menu>ul a.downArrow:after {
    border: 0;
    border-bottom: solid 2px #fff;
    border-right: solid 2px #fff;
    content: "";
    display: inline-block;
    height: 6px;
    margin-left: 20px;
    transform: rotate(45deg);
    transform-origin: center;
    transition: .3s;
    width: 6px
}

.drawer-menu>ul a.downArrow.active:after {
    transform: rotate(225deg);
    margin-top: 5px
}

.drawer-menu .ul-wrap {
    margin-top: 24px;
    padding-left: 20px
}

.drawer-menu .ul-wrap a {
    display: block;
    text-decoration: underline
}

.drawer-menu .ul-wrap .ul-wrap-list__ttl {
    font-size: 1.4rem;
    color: #fff
}

.drawer-menu>ul>li {
    margin-bottom: 3pc
}

.drawer-menu .ul-wrap-list {
    padding-left: 0
}

.drawer-menu .ul-wrap-list:not(:last-child) {
    margin-bottom: 2pc
}

.drawer-menu .ul-wrap-list__list {
    margin-left: 0;
    row-gap: 9pt;
    column-gap: 5px
}

.drawer-menu .ul-wrap-list__list li {
    width: calc((100% - 5px)/2)
}

.drawer-menu .ul-wrap-list__list li+li {
    margin-top: 0
}

.drawer-menu .ul-wrap-list__list a {
    font-size: 1.2rem;
    font-weight: 400
}

.drawer-menu .ul-wrap-list__list a:before {
    top: 3px;
    font-size: 1.2rem;
    color: #fff
}

.fixed-nav {
    position: fixed;
    z-index: 3;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: 20px;
    box-sizing: border-box;
    width: 490px;
    margin: 0 auto;
    padding: 0 20px 20px
}

.fixed-nav img:hover {
    opacity: .8
}

@media screen and (max-width:767px) {
    .fixed-nav {
        flex-direction: column-reverse;
        gap: 1.3333333333vw;
        width: 100%;
        padding: 0 15px 20px
    }
}

@media screen and (min-width:768px) {
    .fixed-nav a {
        max-width: 490px;
        margin-left: auto
    }
}

#footer {
    padding: 5pc 0 0;
    color: #fff;
    background-color: #0a1426
}

@media screen and (max-width:767px) {
    #footer {
        padding: 8.2666666667vw 0 0
    }
}

.footer__wrap {
    max-width: 75pc;
    margin: 0 auto
}

@media screen and (min-width:768px) {
    .footer__wrap {
        box-sizing: border-box;
        padding: 0 10px
    }
}

.footer-flex {
    margin-bottom: 40px
}

@media screen and (min-width:768px) {
    .footer-flex {
        display: flex
    }
}

@media screen and (max-width:767px) {
    .footer-flex {
        margin-bottom: 8.5333333333vw
    }
}

.footer-logo {
    max-width: 111px
}

@media screen and (min-width:768px) {
    .footer-logo {
        margin-bottom: 1pc
    }
}

@media screen and (max-width:767px) {
    .footer-logo {
        max-width: 25.3333333333vw;
        margin: 0 auto 6.9333333333vw
    }
}

@media screen and (min-width:768px) {
    .footer-address {
        margin-right: 74px;
        padding-right: 86px;
        border-right: 1px solid #666a72
    }
}

@media screen and (max-width:767px) {
    .footer-address {
        margin-bottom: 8vw;
        padding: 0 8vw 7.7333333333vw;
        border-bottom: 1px solid #666a72
    }
}

.footer-address__ttl {
    font-size: 1.6rem;
    margin-bottom: 1em;
    text-align: left
}

@media screen and (max-width:767px) {
    .footer-address__ttl {
        font-size: 1pc;
        font-size: 4.2666666667vw
    }
}

.footer-address__list {
    font-size: 1.2rem;
    margin-bottom: 1pc;
    padding: 2em 0
}

.footer-address__list li+li {
    margin-top: 1em
}

.footer-address__list span {
    letter-spacing: .13em
}

@media screen and (max-width:767px) {
    .footer-address__list {
        font-size: 9pt;
        font-size: 3.2vw
    }
}

.footer-address__flex {
    display: flex
}

@media screen and (min-width:768px) {
    .footer-address__flex {
        align-items: flex-end;
        justify-content: space-between
    }
}

@media screen and (max-width:767px) {
    .footer-address__flex {
        align-items: center;
        flex-flow: column;
        gap: 1.3333333333vw;
        margin-bottom: 2.6666666667vw
    }
}

.footer-address__tel {
    font-family: Barlow, Noto Sans JP, YuGothic, Yu Gothic, ヒラギノ角ゴシック, Hiragino Sans, sans-serif;
    font-size: 1.4rem;
    letter-spacing: .13em
}

.footer-address__tel span {
    font-size: 2.5rem;
    letter-spacing: .1em
}

@media screen and (max-width:767px) {
    .footer-address__tel {
        font-size: 14px;
        font-size: 3.7333333333vw
    }
}

@media screen and (max-width:767px) {
    .footer-address__tel span {
        font-size: 25px;
        font-size: 6.6666666667vw
    }
}

.footer-address__time {
    font-size: 1.2rem
}

.footer-address__time span {
    font-family: Barlow, Noto Sans JP, YuGothic, Yu Gothic, ヒラギノ角ゴシック, Hiragino Sans, sans-serif;
    font-size: 1.8rem
}

@media screen and (max-width:767px) {
    .footer-address__time {
        font-size: 9pt;
        font-size: 3.2vw
    }
}

@media screen and (min-width:768px) {
    .footer-address__time span {
        margin-left: 4px
    }
}

@media screen and (max-width:767px) {
    .footer-address__time span {
        font-size: 18px;
        font-size: 4.8vw
    }
}

.footer-address__notice p {
    font-size: 1.2rem;
    color: #aaadb1
}

@media screen and (min-width:768px) {
    .footer-address__notice p {
        letter-spacing: .15em
    }
}

@media screen and (max-width:767px) {
    .footer-address__notice p {
        font-size: 9pt;
        font-size: 3.2vw;
        text-align: center
    }
}

@media screen and (min-width:768px) {
    .footer-service {
        max-width: 363px
    }
}

@media screen and (max-width:767px) {
    .footer-service {
        margin-bottom: 8vw;
        padding: 0 8vw 7.7333333333vw;
        border-bottom: 1px solid #666a72
    }
}

.footer-service__ttl {
    font-size: 1.5rem;
    margin-bottom: 1.8em;
    padding-bottom: 1.1em;
    border-bottom: 1px solid #666a72
}

.footer-service__ttl a {
    transition: .3s;
    color: #fff
}

.footer-service__ttl a:hover {
    opacity: .7
}

.footer-service__nav ul {
    margin-bottom: 42px
}

.footer-service__nav li+li {
    margin-top: .8em;
    display: flex
}

.footer-service__nav a {
    display: flex;
    gap: .6em;
    transition: .3s;
    align-items: center
}

.footer-service__nav a:hover {
    opacity: .7
}

.footer-service__nav a span {
    font-size: 1.4rem;
    color: #fff
}

.footer-service__nav a .footer-movie {
    position: relative;
    padding-left: 24px
}

.footer-service__nav a .footer-movie:before {
    top: 3px;
    left: 0;
    content: "";
    width: 15px;
    height: 15px;
    background: url(../images/common/arrow_square_blue.svg)center / contain no-repeat;
    position: absolute;
    display: block
}
.footer-service__nav a .footer-building {
    position: relative;
    padding-left: 24px
}

.footer-service__nav a .footer-building:before {
    top: 1px;
    left: 0;
    content: "";
    width: 15px;
    height: 21px;
    background: url(../images/common/building_blue.svg)center / contain no-repeat;
    position: absolute;
    display: block
}
.footer-service__nav a .footer-smh {
    position: relative;
    padding-left: 24px
}

.footer-service__nav a .footer-smh:before {
    top: 3px;
    left: 0;
    content: "";
    width: 15px;
    height: 19px;
    background: url(../images/common/sp-blue.svg)center / contain no-repeat;
    position: absolute;
    display: block
}



.footer-service__nav img {
    width: 15px;
    height: 9pt
}

@media screen and (min-width:768px) {
    .footer-service__nav a span {
        letter-spacing: .1em
    }
}

@media screen and (max-width:767px) {
    .footer-service__nav a span {
        font-size: 14px;
        font-size: 3.7333333333vw
    }
}

@media screen and (max-width:767px) {
    .footer-service__nav+.footer-nav {
        padding: 0
    }

    .footer-service__nav+.footer-nav li {
        width: 100%
    }
}

.footer-nav__main--top a:before {
    position: absolute;
    content: "";
    background: url(../images/common/home.svg)center center /contain;
    width: 20px;
    height: 20px;
    left: -25px;
    bottom: 3px
}

.footer-nav__main {
    font-size: 1.5rem
}

.footer-nav__main li {
    margin-bottom: 10px;
    font-weight: 700;
    font-size: 1.6rem
}

.footer-nav__main li span {
    font-size: 1.4rem;
    font-weight: 400
}

.footer-nav__main--top {
    font-size: 2rem;
    margin-left: 25px;
    font-weight: 700;
    position: relative;
    margin-bottom: 42px !important
}

.footer-nav__main a {
    transition: .3s;
    color: #fff;
    font-size: 1.4rem
}

.footer-nav__main a:hover {
    opacity: .7
}

.footer-nav__main-ttl {
    color: #fff
}

.footer-nav__main-ttl li {
    margin-bottom: 10px;
    font-weight: 700;
    font-size: 1.6rem
}

.footer-nav__main-ttl a {
    transition: .3s;
    color: #fff
}

.footer-nav__main-ttl a:hover {
    opacity: .7
}

@media screen and (min-width:768px) {
    .footer-nav {
        margin-left: auto
    }
}

@media screen and (max-width:767px) {
    .footer-nav {
        padding: 0 8vw
    }
}

.footer-nav ul {
    display: flex;
    font-size: 1pc;
    font-weight: 700;
    row-gap: 40px
}

.footer-nav ul li .footer-nav__item a {
    font-size: 1.4rem
}

.footer-nav__item {
    margin-top: 20px;
    row-gap: 8px !important;
    font-weight: 400 !important
}

.footer-nav li {
    width: 100%
}

.footer-nav a {
    font-size: 1.5rem;
    transition: .3s;
    letter-spacing: .1em;
    color: #fff
}

.footer-nav a:hover {
    opacity: .7
}

@media screen and (min-width:768px) {
    .footer-nav ul {
        flex-flow: column
    }
}

@media screen and (max-width:767px) {
    .footer-nav ul {
        flex-flow: wrap
    }
}

@media screen and (max-width:767px) {
    .footer-nav a {
        font-size: 15px;
        font-size: 4vw
    }
}

.counter-list {
    counter-reset: a
}

.counter-list li {
    list-style: none;
    counter-increment: a
}

.counter {
    display: inline-block
}

.counter-list .counter:before {
    content: counter(a, decimal-leading-zero);
    color: #1e90ff;
    background: linear-gradient(to bottom, #0169b6, #354768);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 700;
    margin-right: 5px;
    font-family: Barlow, Noto Sans JP, YuGothic, Yu Gothic, ヒラギノ角ゴシック, Hiragino Sans, sans-serif;
    font-size: 1pc;
    line-height: 1;
    display: inline-block
}

.counter-list li:nth-child(1) .counter:before {
    font-size: 17px;
    margin-right: 6px;
    letter-spacing: .13em
}

.counter-list li:nth-child(10) .counter:before {
    letter-spacing: .2em
}

.counter-list li:nth-child(11) .counter:before {
    font-size: 1pc
}

.counter-list li:nth-child(n+11) .counter {
    letter-spacing: .2em
}

.counter-list li:nth-child(11) .counter {
    letter-spacing: .28em
}

.copyright {
    margin: 0 40px;
    padding: 1em 0;
    text-align: center;
    color: #aaadb1
}

.copyright small {
    font-family: Barlow, Noto Sans JP, YuGothic, Yu Gothic, ヒラギノ角ゴシック, Hiragino Sans, sans-serif;
    font-size: 1rem;
    line-height: 1
}

@media screen and (max-width:767px) {
    .copyright {
        margin: 0 8vw;
        padding: 1em 0 2em
    }
}

@media screen and (min-width:768px) {
    .copyright small {
        letter-spacing: .13em
    }
}

mark {
    background: linear-gradient(transparent 60%, #ffe082 60%)
}

.wp-block-image {
    max-width: 850px;
    margin: 40px auto;
    text-align: center
}

@media screen and (max-width:767px) {
    .wp-block-image {
        margin: 5.3333333333vw auto
    }
}

b {
    font-weight: 700
}

.text-center {
    text-align: center
}

.text-right {
    text-align: right
}

.text-left {
    text-align: left
}

@media screen and (min-width:768px) {
    .u-flex {
        display: flex;
        align-items: center;
        justify-content: space-between
    }
}

@media screen and (max-width:767px) {
    .u-text--30-sp {
        font-size: 3rem !important
    }
}

@media screen and (min-width:768px) {
    .u-mt--00 {
        margin-top: 0 !important
    }
}

@media screen and (min-width:768px) {
    .u-mt--30 {
        margin-top: 30px !important
    }
}

@media screen and (min-width:768px) {
    .u-mt--40 {
        margin-top: 40px !important
    }
}

@media screen and (max-width:767px) {
    .u-mt--20-sp {
        margin-top: 20px !important
    }
}

@media screen and (max-width:767px) {
    .u-mt--40-sp {
        margin-top: 40px !important
    }
}

@media screen and (min-width:768px) {
    .u-mt--50 {
        margin-top: 50px !important
    }
}

@media screen and (min-width:768px) {
    .u-mt--66 {
        margin-top: 66px !important
    }
}

@media screen and (min-width:768px) {
    .u-mb--20 {
        margin-bottom: 20px !important
    }
}

@media screen and (max-width:767px) {
    .u-mb--20-sp {
        margin-bottom: 20px !important
    }
}

@media screen and (min-width:768px) {
    .u-mb--30 {
        margin-bottom: 30px !important
    }
}

@media screen and (min-width:768px) {
    .u-ml--05 {
        margin-left: 5px !important
    }
}

@media screen and (min-width:768px) {
    .u-pt--140 {
        padding-top: 140px
    }
}

@media screen and (max-width:767px) {
    .u-pb--10-sp {
        padding-bottom: 10px
    }
}

@media screen and (min-width:768px) {
    .u--w-380 {
        width: 380px !important
    }
}

@media screen and (min-width:768px) {
    .u--w-400 {
        width: 25pc !important
    }
}

@media screen and (min-width:768px) {
    .fixed-nav {
        width: 360px;
        height: 328px;
        bottom: 10px;
        right: 10px
    }

    .fixed-nav .btn {
        width: 360px;
        z-index: 2
    }

    .fixed-nav .btn,
    .fixed-nav .img {
        position: absolute;
        bottom: 0;
        right: 0
    }

    .fixed-nav .img {
        width: 261px;
        z-index: 1
    }

    .fixed-nav .close {
        width: 36px;
        position: absolute;
        top: -20px;
        right: 10px;
        cursor: pointer
    }

    .fixed-nav .close.active,
    .fixed-nav .img.active {
        display: none
    }

    img:hover {
        opacity: 1
    }

    a {
        transition: .3s
    }
}

.span__small{
    font-size: 14px;
}