* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    color: var(--textcolor);
}

:root {
    --themecolor: #8EC31E;
    --subcolor: #fff;
    --textcolor: #132847;
    --bordercolor: #7070701A;
    --fz-ttl: clamp(2.4rem, 6vw, 6rem);
    --fz-ttl-after: clamp(1.2rem, 1.5vw, 1.4rem);
    --fz-ttl-sub: clamp(1.6rem, 4vw, 3.6rem);
    --fz-txt: clamp(1.4rem, 3vw, 1.8rem);
    --fz-nav: clamp(1.2rem, 2vw, 1.4rem);
    --fz-btn: clamp(1.2rem, 2.5vw, 1.6rem);
    --fz-footer: clamp(1.2rem, 2vw, 1.4rem);
    --m-large: clamp(7rem, 10vw, 12rem);

    /* sp */
    --fz-sp-nav: 3.6rem
}

html {
    font-family: "Zen Kaku Gothic New", "Jost", sans-serif;
    font-size: 62.5%;
    scroll-behavior: smooth;
    max-width: 2000px;
    margin: 0 auto;
}

.body {
    color: var(--textcolor);
    a {
        cursor: pointer;
    }
}

/* 下層ページ共通 */
.header {
    background: none;
}

.header-curve {
    position: absolute;
    top: 0;
    width: 100%;
    height: 15%;
    border-radius: 0 0 0 70%;
    background-color: #8EC31E4D;
}

.page-wrap {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 clamp(2rem, 5vw, 20rem);
}

.page-ttl {
    font-size: var(--fz-ttl);
}

.page-ttl-en {
    font-size: var(--fz-ttl-after);
    padding-bottom: var(--m-large);
    border-bottom: 1px solid var(--bordercolor);
    color: var(--themecolor);
    font-weight: bold;
}

.page-ttl-sub {
    font-size: var(--fz-ttl-sub);
}

.page-ttl-en.__detail {
    border-bottom: none;
}

.page-top-txt {
    text-align: center;
    font-size: var(--fz-txt);
    color: var(--textcolor);
    font-weight: 100;
    margin-bottom: 8rem;
}

.page-txt {
    font-size: var(--fz-txt);
}

.btn.__detail {
    opacity: 1;
    border: 2px solid var(--bordercolor);
    color: var(--textcolor);
}

.btn.__detail:hover {
    color: var(--subcolor);
}

/* works */
.works-page-content {
    max-width: 500px;
}

.works-inner.__detail {
    justify-content: space-evenly;
    gap: 8rem;
}

.works-inner.__detail + .works-inner.__detail {
    margin-top: 8rem;
}

/* recruit */
.recruit.__detail {
    padding-top: 0;
}

.page-txt.__recruit {
    /* border-bottom: 1px solid red; */
    background: linear-gradient(transparent 70%, #ff7474 70%);
    display: inline-block;
}

.table.__recruit tr {
    border-top: 1px solid #8EC31E4D;
}

.table.__recruit tr:last-of-type {
    border-bottom: 1px solid #8EC31E4D;
}

/* contact */
#form {
    font-size: var(--fz-txt);
}

.contact-heading {
    margin-bottom: 40px;
}

.contact-label {
    font-weight: bold;
    display: flex;
    align-items: center;
}

.contact-label::before {
    display: inline-block;
    margin: 0 20px;
	width: 10px;
	height: 10px;
	content: '';
	border-radius: 100%;
	background: var(--themecolor);
}

.contact-span {
    color: red;
    margin-left: 20px;
    font-weight: bold;
    font-style: normal;
}

textarea {
    padding: 25px;
}

.contact-textbox {
    margin-bottom: 80px;
    width: 100%;
    height: 65px;
    background: rgba(142, 195, 30, 0.1);
    border-radius: 30px;
    padding: 0 25px;
}

.contact-textarea {
    margin-bottom: 80px;
    width: 100%;
    height: 200px;
    background: rgba(142, 195, 30, 0.1);
    border-radius: 30px;
}

.button {
    display: grid;
    width: 150px;
    height: 50px;
    background: var(--themecolor);
    border-radius: 30px;
    border: 2px solid var(--themecolor);
    margin: auto;
    align-items: center;
}

.submit {
    color: var(--subcolor);
    transition: .3s;
    opacity: 0.2;
}

/* thanks */
.page-border {
    border: 1px solid var(--bordercolor);
    margin: clamp(3rem, 5vw, 8rem) 0;
}

.page-wrap.__thanks {
    text-align: center;
}

.btn.__thanks {
    max-width: clamp(200px, 20vw, 250px);
}

/* privacy, site */
.page-content {
    max-width: 1280px;
    margin: 8rem auto 0;
    padding: 0 clamp(2rem, 5vw, 20rem);
    font-size: var(--fz-txt);
}

.page-content p {
    line-height: 1.8;
}

.policy-ttl {
    margin-top: 8rem;
}

.policy-txt {
    margin-top: 4rem;
}

