@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;700&display=swap');
@import url('https://use.typekit.net/ojm8wuy.css');

*{
    box-sizing: border-box;
}
body {
    max-width: 2000px;
    width: 100%;
    margin: auto;
    font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
    font-size: 15px;
    font-weight: 400;
    font-style: normal;
    line-height: 1.6;
    color: #5D5F63;
    letter-spacing: 1px;
}
p{
    margin: 0 0 0.5em;
    padding: 0;
}
img{
    max-width: 100%;
    height: auto;
}
a {
    text-decoration: none;
    transition: all 0.4s ease-out;
}
a:hover {
    opacity: 0.8;
    transition: all 0.4s ease-out;
}

li {
    list-style: none;
}
hr{
    color:#cccccc;
}

.txt-small{
    font-size: 0.8em !important;
}
.txt-big{
    font-size: 1.25em !important;
}
.txt-center{
    text-align: center;
}
.txt-left{
    text-align: left;
}
.txt-right{
    text-align: right;
}
.txt-bold{
    font-weight: bold;
}
.txt-normal{
    font-weight: normal;
}
.txt-lighter{
    font-weight: lighter;
}

.w-half{
    width: 50% !important;
}
.w-large{
    width: 70% !important;
}
.w-full{
    width: 100% !important;
}

/**** header ****/
header{
    background: #fff;
    padding: 1em;
    text-align: center;
}

/**** footer ****/
footer{
    background: #fff;
    padding: 1em;
    text-align: center;
}
.foot-logo{
    margin: 0.5em 0 1em;
}

/**** main ****/
.inner{
    max-width: 850px;
    width: 90%;
    margin: auto;
}
.inner-ctn {
    max-width: 1210px;
    width: 90%;
    margin: auto;
    box-sizing: border-box;
}
.inner-ctn form{
    margin: 0 auto;
}
.bg-white {
    background-color: #fff;
    border-radius: 20px;
    padding: 2em 2em 4em;
    box-sizing: border-box;
}
.bg-green {
    background-color: #3CB378;
    padding: 100px 0 100px;
}

.ttl-style {
    text-align: center;
    font-family: "mozaic-geo-variable", sans-serif;
    font-variation-settings: "wght" 100;
    font-size: 5em;
    margin: 0 auto;
    color: #3CB378;
    padding: 20px 0 10px;
    letter-spacing: 3px;
    line-height: 1.1;
}
.ttl-style + p {
    text-align: center;
    font-size: 1.9em;
    font-weight: bold;
    margin: 0 0 25px;
}
.ttl-hr {
    height: 3px;
    background: #3CB378;
    border: none;
    max-width: 43px;
    width: 100%;
    margin: 0 auto 3em;
}
.ttl{
    font-size: 1.1em;
    margin: 0 0 0.5em;
    font-weight: bold;
}

.ttl-box{
    background-color: #E1E1E1;
    border-radius: 10px;
    margin: 2em auto 1em;
    padding: 1em;
    display: block;
    text-align: center;
}
.ttl-box .ttl-etc{
    font-size: 1.2em;
    font-weight: bold;
    margin: 0;
}
.ttl-box p{
    margin: 0.5em 0 0;
}

.hero{
    margin: 1em 0 2em;
}
.intro{
    margin: 1em 0 2em;
}
p a{
    color: #EE5B59;
    text-decoration: underline;
    text-underline-offset: 0.1em;
    font-weight: bold;
}
.privacy{
    font-weight: bold;
    margin: 2em 0;
}
.red {
    color: #EE5B59;
    font-weight: bold;
}
.required{
    background: #EE5B59;
    color: #fff;
    padding: 0.1em 0.5em;
    border-radius: 0.2em;
    display: inline-block;
    margin: 0 0.5em;
    font-size: 0.8em;
}
.alert{
    color: #EE5B59;
    font-weight: bold;
    background: #ffdbdb;
    padding: 0.5em 0.5em;
    margin: 0 auto;
    display: inline-block;
}
.border {
    background-color: #f5f5f5;
    border: solid 1px #e5e5e5;
    border-radius: 10px;
    margin: 2em auto 1em;
    padding: 1em;
    display: block;
}
.border-red {
    border: solid 1px #EE5B59;
    padding: 1.5em;
}
.accept-box{
    text-align: center;
    font-weight: bold;
    background-color: #f5f5f5;
    border: solid 1px #c3c3c3;
    border-radius: 10px;
    margin: 2em auto 1em;
    padding: 1em;
    display: block;
}
.accept-box a{
    color: #EE5B59;
    text-decoration: underline;
    text-underline-offset: 0.1em;
}


form table{
    width: 100%;
    margin: 1em auto;
}
form table th,
form table td{
    border-bottom: solid 2px #DEDFE0;
    background: none;
    padding: 1em 0;
}
form table th{
    text-align: left;
    width: 300px;
    padding: 1em;
}

form select{
    -webkit-appearance:none;
    background: #ffffff url(../images/ico_arrow.png) 98% center/0.7em no-repeat;
}
form input,
form textarea,
form select{
    border: solid 2px #DEDFE0;
    border-radius: 0.3em;
    width: 100%;
    font-size: 1em;
    color: inherit;
}
form input:not([type="radio"]):not([type="checkbox"]):not([type="file"]),
form textarea,
form select{
    margin: 0.5em 0;
    padding: 0.8em 1em;
}
form input[type="radio"],
form input[type="checkbox"]{
    width: auto;
    transform: scale(1.3);
    accent-color: #399969;
}
form input[type="file"]{
    width: auto;
    border: none;
    border-radius: 0;
}
.submit-box{
    text-align: center;
    margin: 3em auto 1em;
}
.submit-box input[type="button"]{
    display: inline-block;
    padding: 1em 1.5em;
    font-weight: bold;
    cursor: pointer;
    background: #DEDFE0;
    border: none;
    border-radius: 0.3em;
    margin: 0 0.5em;
    transition: .3s;
    width: auto;
}
.submit-box input.submit{
    background: #ffd55d;
}
.submit-box input[type="button"]:hover{
    opacity: 0.7;
    transition: .3s;
}


/**** レスポンシブ対応 ****/
.sp-only {
    display: none;
}

@media (max-width: 769px) {
    .pc-only {
        display: none;
    }
    .sp-only {
        display: block;
    }

    body{
        font-size: 2.8vw;
    }
    .bg-green{
        padding: 2em 0;
    }
    .bg-white{
        padding: 1em 0 2em;
    }
    form table th,
    form table td{
        display: block;
        width: 100%;
    }
    form table th{
        border-bottom: none;
        padding: 1em 0 0.5em;
    }
    form table td{
        padding: 0 0 1em;
    }
    form input:not([type="radio"]):not([type="checkbox"]),
    form textarea,
    form select{
        padding: 0.6em 0.6em;
    }
    form input[type="radio"],
    form input[type="checkbox"]{
        transform: scale(1.2);
    }

}