:root{
    --roboto: "Roboto", sans-serif;
    --mont: "Montserrat", sans-serif;
}

body{
    font-family: var(--mont);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.25;
}

.tupp{
    text-transform: uppercase;
}

.tlc{
    text-transform: lowercase;
}

html::-webkit-scrollbar{
    width: 10px;
}

html::-webkit-scrollbar-track{
    background: #f2F2F2;
}

html::-webkit-scrollbar-thumb{
    background: var(--title);
    border-radius: 15px;
}

a{
    text-decoration: none;
    color: #000;
}

hr{
    opacity: 100%;
    -webkit-opacity: 100%;
    background-color: var(--line);
    margin: 20px 0;
}

.uptitle{
    width: fit-content;
    text-transform: uppercase;
    color: var(--red1);
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 1rem;
}

.uptitle::after{
    content: '';
    display: block;
    display: -webkit-block;
    float: right;
    width: 80px;
    height: 1.5px;
    background-color: var(--red1);
    margin: 8px 0 8px 10px;
}

.sectitle{
    text-transform: uppercase;
    color: var(--title);
    font-size: 30px;
    line-height: 1.21;
}

.sectitle strong{
    color: var(--red1);
}

.text{
    color: var(--text);
}

.text p:not(:last-child){
    margin-bottom: 1rem;
}

.telp,
.mailp{
    display: block;
}

.dbtn{
    position: relative;
    z-index: 3;
    display: flex;
    display: -webkit-flex;
    align-items: center;
    grid-gap: 19px;
    width: fit-content;
    color: var(--white);
    font-weight: 700;
    padding: 10px 40px 10px 25px;
}

.dbtn:hover{
    color: var(--white);
}

.dbtn.w,
.dbtn:hover.w{
    color: var(--main);
}

.dbtn::after{
    content: url('data:image/svg+xml;utf8,<svg width="8" height="12" viewBox="0 0 8 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1 11L6 6L1 1" stroke="white" stroke-width="2.5"/></svg>');
}

.dbtn.down::after{
    content: url('data:image/svg+xml;utf8,<svg width="17" height="16" viewBox="0 0 17 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M8.33301 11.575C8.19967 11.575 8.07467 11.5543 7.95801 11.513C7.84134 11.4717 7.73301 11.4007 7.63301 11.3L4.03301 7.7C3.83301 7.5 3.73701 7.26667 3.74501 7C3.75301 6.73334 3.84901 6.5 4.03301 6.3C4.23301 6.1 4.47067 5.996 4.74601 5.988C5.02134 5.98 5.25867 6.07567 5.45801 6.275L7.33301 8.15V1C7.33301 0.71667 7.42901 0.479337 7.62101 0.288004C7.81301 0.0966702 8.05034 0.000670115 8.33301 3.44827e-06C8.61567 -0.000663218 8.85334 0.0953369 9.04601 0.288004C9.23868 0.48067 9.33434 0.718003 9.33301 1V8.15L11.208 6.275C11.408 6.075 11.6457 5.979 11.921 5.987C12.1963 5.995 12.4337 6.09934 12.633 6.3C12.8163 6.5 12.9123 6.73334 12.921 7C12.9297 7.26667 12.8337 7.5 12.633 7.7L9.03301 11.3C8.93301 11.4 8.82467 11.471 8.70801 11.513C8.59134 11.555 8.46634 11.5757 8.33301 11.575ZM2.33301 16C1.78301 16 1.31234 15.8043 0.921008 15.413C0.529674 15.0217 0.333674 14.5507 0.333008 14V12C0.333008 11.7167 0.429008 11.4793 0.621008 11.288C0.813008 11.0967 1.05034 11.0007 1.33301 11C1.61567 10.9993 1.85334 11.0953 2.04601 11.288C2.23867 11.4807 2.33434 11.718 2.33301 12V14H14.333V12C14.333 11.7167 14.429 11.4793 14.621 11.288C14.813 11.0967 15.0503 11.0007 15.333 11C15.6157 10.9993 15.8533 11.0953 16.046 11.288C16.2387 11.4807 16.3343 11.718 16.333 12V14C16.333 14.55 16.1373 15.021 15.746 15.413C15.3547 15.805 14.8837 16.0007 14.333 16H2.33301Z" fill="white"/></svg>');
}

.dbtn.w::after{
    content: url('data:image/svg+xml;utf8,<svg width="8" height="12" viewBox="0 0 8 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1 11L6 6L1 1" stroke="rgb(0, 141, 54)" stroke-width="2.5"/></svg>');
}

.dbtn .l,
.dbtn .ll,
.dbtn::before{
    position: absolute;
    left: 0;
    mask-image: url(../../assets/img/btnmask.svg);
    -webkit-mask-image: url(../../assets/img/btnmask.svg);
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    mask-position: right center;
    -webkit-mask-position: right center;
    mask-size: cover;
    -webkit-mask-size: cover;
}

.dbtn .l{
    z-index: -1;
    inset: 0;
    background-color: var(--main);
}

.dbtn.w .l{
    background-color: var(--white);
}

.dbtn .ll,
.dbtn::before{
    transition: all .3s ease-in-out;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
}

.dbtn .ll{
    z-index: -2;
    width: calc(100% + 7px);
    height: 100%;
    background-color: var(--red2);
}

.dbtn.w .ll{
    background-color: #DBDBDB;
}

.dbtn::before{
    content: '';
    z-index: -3;
    width: calc(100% + 14px);
    height: 100%;
    background-color: var(--red3);
}

.dbtn.w::before{
    background-color: #A5A5A5;
}

.dbtn:hover .ll{
    width: calc(100% + 12px);
}

.dbtn:hover::before{
    width: calc(100% + 24px);
}

.wpcf7-not-valid-tip{
    position: absolute;
    font-size: 14px !important;
    bottom: -20px;
}

h1.entry-title{
    text-align: center;
    margin: 30px 0;
}

.exp{
    position: absolute;
    z-index: 1;
    inset: auto 0 2rem 0;
    width: fit-content;
    display: flex;
    display: -webkit-flex;
    flex-direction: column;
    -ms-flex-direction: column;
    align-items: center;
    grid-gap: 20px;
    text-align: center;
    color: var(--white);
    font-family: var(--roboto);
    font-size: 16px;
    font-weight: 500;
    line-height: 22px;
    margin: 0 auto;
}

.exp::before{
    content: '';
    width: 22px;
    height: 38px;
    border: 1px solid var(--white);
    border-radius: 41px;
    background: #FFFFFF33;
}

.exp::after{
    content: '';
    position: absolute;
    inset: 8px 0 auto 0;
    width: 4px;
    aspect-ratio: 1/1;
    border-radius: 50%;
    background-color: transparent;
    animation: 2.5s ease-in-out infinite forwards scrll;
    -webkit-animation: 2.5s ease-in-out infinite forwards scrll;
    -moz-animation: 2.5s ease-in-out infinite forwards scrll;
    -ms-animation: 2.5s ease-in-out infinite forwards scrll;
    -o-animation: 2.5s ease-in-out infinite forwards scrll;
    margin: 0 auto;
}

@keyframes scrll{0%{background-color:var(--white)}20%{top:5px}40%{top:30px}60%{top:26px}80%{background-color:transparent}}
@-webkit-keyframes scrll{0%{background-color:var(--white)}20%{top:5px}40%{top:30px}60%{top:26px}80%{background-color:transparent}}
@-moz-keyframes scrll{0%{background-color:var(--white)}20%{top:5px}40%{top:30px}60%{top:26px}80%{background-color:transparent}}
@-ms-keyframes scrll{0%{background-color:var(--white)}20%{top:5px}40%{top:30px}60%{top:26px}80%{background-color:transparent}}
@-o-keyframes scrll{0%{background-color:var(--white)}20%{top:5px}40%{top:30px}60%{top:26px}80%{background-color:transparent}}

.pathbox{
    display: flex;
    display: -webkit-flex;
    align-items: center;
    grid-gap: 2rem;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    padding: 8px 0;
}

.pathbox .back{
    display: flex;
    display: -webkit-flex;
    align-items: center;
    grid-gap: 9px;
    color: #0E143A;
    font-size: 16px;
    font-weight: 700;
    line-height: 20px;
    letter-spacing: -0.536px;
    background: none;
}

.pathbox .back::before{
    content: url('data:image/svg+xml;utf8,<svg width="9" height="13" viewBox="0 0 9 13" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M8 12L2 6.5L8 1" stroke="rgb(14,20,58)" stroke-width="2"/></svg>');
}

.pathbox .path,
.pathbox .path>*:not(:last-child){
    display: flex;
    display: -webkit-flex;
    align-items: center;
    grid-gap: 5px;
}

.pathbox .path{
    border-left: 1px solid var(--line);
    padding: 8px 0 8px 2rem;
}

.pathbox .path>*{
    color: #626F7C;
}

.pathbox .path>*:not(:last-child)::after{
    content: '/';
}

.pathbox .path>*:last-child{
    color: var(--main);
    font-weight: 700;
}

.pagination{
    display: flex;
    display: -webkit-flex;
    align-items: center;
    grid-gap: 1rem;
}

.pagination>*{
    display: flex;
    display: -webkit-flex;
    align-items: center;
    justify-content: center;
    -webkit-justify-content: center;
    color: var(--white);
    font-weight: 700;
    width: 40px;
    height: 40px;
    background-color: #f2f2f2;
}

.pagination>*:not(:first-child):not(:last-child):hover,
.pagination>*:not(:first-child):not(:last-child).active{
    background-color: var(--main);
}

.pagination>*:first-child,
.pagination>*:last-child{
    background-color: var(--main);
}

@media(max-width:768px){
    .pathbox,
    .pathbox .path{
        flex-wrap: wrap;
        -ms-flex-wrap: wrap;
    }
}