html { font-size: 62.5%; }

.position-absolute {
    position: absolute;
}
.position-relative {
    position: relative;
}

.overflow-x-hidden {
    overflow-x: hidden;
}

.w-60 {
    width: 60%;
}
.w-70 {
    width: 70%;
}

.w-10 {
    width: 10%;
}
.w-80 {
    width: 80%;
}
.w-100 {
    width: 100%;
}
.w-fit {
    width: fit-content;
}

.p-5 {
    padding: 5px;
}
.p-10 {
    padding: 10px;
}
.pt-10 {
    padding-top: 10px;
}
.pl-5 {
    padding-left: 5px;
}
.pl-10 {
    padding-left: 10px;
}
.prl-5 {
    padding-left: 5px;
    padding-right: 5px;
}
.prl-10 {
    padding-left: 10px;
    padding-right: 10px;
}
.prl-20 {
    padding-left: 20px;
    padding-right: 20px;
}
.ptb-5 {
    padding-top: 5px;
    padding-bottom: 5px;
}
.ptb-10 {
    padding-top: 10px;
    padding-bottom: 10px;
}
.ptb-20 {
    padding-top: 20px;
    padding-bottom: 20px;
}
.pb-20 {
    padding-bottom: 20px;
}
.pb-50 {
    padding-bottom: 50px;
}

/* 色周り */
.color-white {
    color: #fff;
}
.color-dark-blue {
    color: rgb(0, 63, 112)
}

.bg-white {
    background-color: #fff;
}
.bg-dark-blue {
    background-color: rgb(0, 63, 112);
}

.mt-3 {
    margin-top: 3px;
}
.mt-10 {
    margin-top: 10px;
}
.mt-20{
    margin-top: 20px;
}
.mt-50{
    margin-top: 50px;
}
.mb-3 {
    margin-bottom: 3px;
}
.mb-5 {
    margin-bottom: 5px;
}
.mb-10 {
    margin-bottom: 10px;
}
.mb-20 {
    margin-bottom: 20px;
}
.mb-30 {
    margin-bottom: 30px;
}
.mb-50 {
    margin-bottom: 50px;
}
.mrl-auto {
    margin-left: auto;
    margin-right: auto;
}

.fs-1rem {
    font-size: 1rem;
}

.fs-1-2rem {
    font-size: 1.2rem;
}

.fs-1-5rem {
    font-size: 1.5rem;
}
.fs-2rem {
    font-size: 2rem;
}
.fs-2-2rem {
    font-size: 2.2rem;
}
.fs-2-5rem {
    font-size: 2.5rem;
}
.fs-3rem {
    font-size: 3rem;
}
.fs-3-5rem {
    font-size: 3.5rem;
}
.fs-4rem {
    font-size: 4rem;
}

.fw-800 {
    font-weight: 800;
}
.fw-bold {
    font-weight: 700;
}
.fs-semi-bold {
    font-weight: 600;
}


/* テキストの配置 */
.text-center {
    text-align: center;
}
.text-left {
    text-align: left;
}
.text-right {
    text-align: right;
}

/* line-height */
.line-height-1-2 {
    line-height: 1.2;
}
.line-height-1-5 {
    line-height: 1.5;
}

.underline-solid {
  border-bottom: 2px solid #333;
  display: inline-block;
  padding-bottom: 5px;
}

.clip-hexagon {
  clip-path: polygon(0 0, 100% 0, 90% 100%, 0 100%);
}