@media (min-width: 768px){
	body{font-size: 16px;}
}
a,a:hover,a:focus,a:active{color: inherit;text-decoration:none}
/* span {font-size: inherit !important;} */
table {width:100%; border-collapse:collapse;}
img {border:0; vertical-align:top;max-width: 100%;}

b,strong {
    font-weight: bolder
}

small {
    font-size: 80%
}

.mt-4 {
    margin-top: calc(var(--gap)*4) !important
}

.mb-4 {
    margin-bottom: calc(var(--gap)*4) !important
}

.mr-4 {
    margin-right: calc(var(--gap)*4) !important
}

.ml-4 {
    margin-left: calc(var(--gap)*4) !important
}

.text-light-navy {
    color: var(--light-navy) !important
}

.text-basic-navy {
    color: var(--basic-navy) !important
}

.text-blue,.colBlue {
    color: var(--primary) !important
}

.text-red,.colRed {
    color: var(--red) !important
}

.text-body {
    color: #333 !important
}

.text-dark {
    color: #111 !important
}

.text-white {
    color: #fff !important
}

.text-ylw {
    color: var(--basic-ylw) !important
}

.text-muted {
    color: #999 !important
}

.text-darkgray {
    color: #6c6c6c !important
}

.text-mint {
    color: var(--mint) !important
}

.text-purple {
    color: var(--purple) !important
}

.text-light-mint {
    color: var(--light-mint) !important
}

.text-light-purple {
    color: var(--light-purple) !important
}

.text-pink {
    color: var(--light-pink) !important
}

.text-brw {
    color: var(--brw) !important
}

.fw400 {
    font-weight: 400 !important
}

.fw500 {
    font-weight: 500 !important
}

.fw600 {
    font-weight: 600 !important
}

.bg-gray {
    background-color: #f4f4f4 !important
}

.bg-yellow {
    background-color: var(--basic-ylw) !important
}

.bg-primary {
    background-color: var(--primary) !important
}

.bg-navy {
    /* background-color: var(--basic-navy) !important */
    background: #174097!important
}

.bg-light-navy {
    background-color: var(--light-navy) !important
}

.bg-sky {
    background-color: var(--sky) !important
}

.bg-light-yellow {
    background-color: var(--light-ylw) !important
}

.bg-light-red {
    background-color: #ffeae1 !important
}

.bg-light-mint {
    background-color: var(--light-mint) !important
}

.bg-light-purple {
    background-color: var(--light-purple) !important
}

.bg-light-pink {
    background-color: var(--light-pink) !important
}

.bg-mint {
    background-color: var(--mint) !important
}

.bg-purple {
    background-color: var(--purple) !important
}

.rounded {
    border-radius: 24px !important
}

.mT40 {
    margin-top: calc(var(--gap)*10) !important
}

.mT48 {
    margin-top: calc(var(--gap)*12) !important
}

.mt-auto {
    margin-top: auto !important
}

.ml-auto {
    margin-left: auto !important
}
.intro .tit04 {
    font-weight: 700;
    line-height: 150%;
    letter-spacing: -0.72px
}
.tit01 {
    font-size: 40px
}

@media(max-width: 1240.98px) {
    .tit01 {
        font-size:32px
    }
}

@media(max-width: 767.98px) {
    .tit01 {
        font-size:24px
    }
}

.tit02 {
    font-size: 24px;
    margin-top: 1.5em
}

@media(max-width: 767.98px) {
    .tit02 {
        font-size:22px
    }
}

.tit03 {
    font-size: 28px
}

@media(max-width: 767.98px) {
    .tit03 {
        font-size:20px
    }
}

.tit04 {
    font-size: 24px
}

.tit04.mt-gap {
    margin-top: 2.5em
}

@media(max-width: 767.98px) {
    .tit04 {
        font-size:18px
    }
}

.tit05 {
    font-size: 20px
}

@media(max-width: 767.98px) {
    .tit05 {
        font-size:16px
    }
}

.tit06 {
    font-size: 18px;
    font-weight: 600;
    line-height: 1.5
}

@media(max-width: 767.98px) {
    .tit06 {
        font-size:14px
    }
}

.major .content {
    margin-top: 3em
}

@media(max-width: 991.98px) {
    .major .content {
        margin-top:32px
    }
}

/* .major .tit02 {
    margin-bottom: 24px
} */

@media(max-width: 991.98px) {
    .major .tit02 {
        margin-bottom:16px
    }
}
.tit01,.tit02,.tit03,.tit04,.tit05,.tit06,.display-2 {
    font-weight: 500;
    line-height: 1.3;
    color: #111;
    word-break: keep-all
}

.display-2 {
    font-size: 46px;
    font-weight: 800
}

@media(max-width: 1240.98px) {
    .display-2 {
        font-size:36px
    }
}

@media(max-width: 767.98px) {
    .display-2 {
        font-size:24px
    }
}

.tit01 {
    font-size: 40px
}

@media(max-width: 1240.98px) {
    .tit01 {
        font-size:32px
    }
}

@media(max-width: 767.98px) {
    .tit01 {
        font-size:24px
    }
}

/* .tit02 {
    font-size: 32px;
    margin-top: 1.5em
} */

@media(max-width: 767.98px) {
    .tit02 {
        font-size:22px
    }
}

.tit03 {
    font-size: 28px
}

@media(max-width: 767.98px) {
    .tit03 {
        font-size:20px
    }
}

.tit04 {
    font-size: 24px
}

.tit04.mt-gap {
    margin-top: 2.5em
}

@media(max-width: 767.98px) {
    .tit04 {
        font-size:18px
    }
}

.tit05 {
    font-size: 16px
}

@media(max-width: 767.98px) {
    .tit05 {
        font-size:16px
    }
}

.tit06 {
    font-size: 18px;
    font-weight: 600;
    line-height: 1.5
}

@media(max-width: 767.98px) {
    .tit06 {
        font-size:14px
    }
}

.text-sm {
    font-size: 16px;
    font-weight: 400
}

@media(max-width: 767.98px) {
    .text-sm {
        font-size:14px
    }
}

.text-xs {
    font-size: 14px;
    font-weight: 400
}

@media(max-width: 767.98px) {
    .text-xs {
        font-size:12px
    }
}
.label {
    display: inline-block;
    padding: 6px 8px;
    font-size: 14px;
    color: #fff !important;
    background-color: var(--primary);
    border-radius: 16px;
    line-height: 1.5
}

.label.gray {
    background: #b6b6b6
}

.label.wh {
    background: #fff;
    color: var(--primary) !important
}

.label.md {
    font-size: 16px
}

.label.ylw {
    background: var(--basic-ylw);
    color: var(--basic-navy) !important
}

.label.bg-yellow {
    color: #111 !important
}

@media(max-width: 767.98px) {
    .label {
        font-size:12px
    }

    .label.md {
        font-size: 14px
    }
}
.txtC {
    text-align: center !important
}

.txtR {
    text-align: right !important
}

.txtL {
    text-align: left !important
}
.mt-1 {
    margin-top: calc(var(--gap)*1) !important
}

.mb-1 {
    margin-bottom: calc(var(--gap)*1) !important
}

.mr-1 {
    margin-right: calc(var(--gap)*1) !important
}

.ml-1 {
    margin-left: calc(var(--gap)*1) !important
}

.pt-1 {
    padding-top: calc(var(--gap)*1) !important
}

.pb-1 {
    padding-bottom: calc(var(--gap)*1) !important
}

.pr-1 {
    padding-right: calc(var(--gap)*1) !important
}

.pl-1 {
    padding-left: calc(var(--gap)*1) !important
}

.mt-2 {
    margin-top: calc(var(--gap)*2) !important
}

.mb-2 {
    margin-bottom: calc(var(--gap)*2) !important
}

.mr-2 {
    margin-right: calc(var(--gap)*2) !important
}

.ml-2 {
    margin-left: calc(var(--gap)*2) !important
}

.pt-2 {
    padding-top: calc(var(--gap)*2) !important
}

.pb-2 {
    padding-bottom: calc(var(--gap)*2) !important
}

.pr-2 {
    padding-right: calc(var(--gap)*2) !important
}

.pl-2 {
    padding-left: calc(var(--gap)*2) !important
}

.mt-3 {
    margin-top: calc(var(--gap)*3) !important
}

.mb-3 {
    margin-bottom: calc(var(--gap)*3) !important
}

.mr-3 {
    margin-right: calc(var(--gap)*3) !important
}

.ml-3 {
    margin-left: calc(var(--gap)*3) !important
}

.pt-3 {
    padding-top: calc(var(--gap)*3) !important
}

.pb-3 {
    padding-bottom: calc(var(--gap)*3) !important
}

.pr-3 {
    padding-right: calc(var(--gap)*3) !important
}

.pl-3 {
    padding-left: calc(var(--gap)*3) !important
}

.mt-4 {
    margin-top: calc(var(--gap)*8) !important
}

.mb-4 {
    margin-bottom: calc(var(--gap)*4) !important
}

.mr-4 {
    margin-right: calc(var(--gap)*4) !important
}

.ml-4 {
    margin-left: calc(var(--gap)*4) !important
}

.pt-4 {
    padding-top: calc(var(--gap)*4) !important
}

.pb-4 {
    padding-bottom: calc(var(--gap)*4) !important
}

.pr-4 {
    padding-right: calc(var(--gap)*4) !important
}

.pl-4 {
    padding-left: calc(var(--gap)*4) !important
}

.mt-5 {
    margin-top: calc(var(--gap)*5) !important
}

.mb-5 {
    margin-bottom: calc(var(--gap)*5) !important
}

.mr-5 {
    margin-right: calc(var(--gap)*5) !important
}

.ml-5 {
    margin-left: calc(var(--gap)*5) !important
}

.pt-5 {
    padding-top: calc(var(--gap)*5) !important
}

.pb-5 {
    padding-bottom: calc(var(--gap)*5) !important
}

.pr-5 {
    padding-right: calc(var(--gap)*5) !important
}

.pl-5 {
    padding-left: calc(var(--gap)*5) !important
}

.mt-6 {
    margin-top: calc(var(--gap)*6) !important
}

.mb-6 {
    margin-bottom: calc(var(--gap)*6) !important
}

.mr-6 {
    margin-right: calc(var(--gap)*6) !important
}

.ml-6 {
    margin-left: calc(var(--gap)*6) !important
}

.pt-6 {
    padding-top: calc(var(--gap)*6) !important
}

.pb-6 {
    padding-bottom: calc(var(--gap)*6) !important
}

.pr-6 {
    padding-right: calc(var(--gap)*6) !important
}

.pl-6 {
    padding-left: calc(var(--gap)*6) !important
}
.w250 {
    width: 250px !important
}

.w120 {
    width: 120px !important
}

.w76 {
    width: 76px !important;
    display: inline-block !important
}
.m0 {
    margin: 0 !important
}

.mT0 {
    margin-top: 0px !important
}

.mT03 {
    margin-top: 3px !important
}

.mT5 {
    margin-top: 5px !important
}

.mT10 {
    margin-top: 10px !important
}

.mT15 {
    margin-top: 15px !important
}

.mT20 {
    margin-top: 20px !important
}

.mT30 {
    margin-top: 30px !important
}

.mB0 {
    margin-bottom: 0 !important
}

.mw120 {
    max-width: 120px !important
}

.mw200 {
    max-width: 200px !important
}

.mw240 {
    max-width: 240px !important
}

.mw300 {
    max-width: 300px !important
}

.mw500 {
    max-width: 500px !important
}

.mx-none {
    max-width: none !important
}

caption,.text-hide {
    font: 0/0 a;
    color: rgba(0,0,0,0);
    text-shadow: none;
    background-color: rgba(0,0,0,0);
    border: 0;
    padding: 0;
    margin: 0
}

.clearfix:after {
    content: "";
    display: table;
    clear: both
}

.floatL {
    float: left
}

.floatR {
    float: right
}

.grid-2 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1em
}

@media(max-width: 1240.98px) {
    .grid-2 {
        grid-template-columns:repeat(1, 1fr)
    }
}

.grid-3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1em
}

@media(max-width: 1240.98px) {
    .grid-3 {
        grid-template-columns:repeat(1, 1fr)
    }
}

.grid-4 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1em
}

@media(max-width: 991.98px) {
    .grid-4 {
        grid-template-columns:repeat(2, 1fr)
    }
}

.grid-5 {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 1em
}

@media(max-width: 991.98px) {
    .grid-5 {
        grid-template-columns:repeat(2, 1fr)
    }
}