:root {
    --base-color: #faf9f7;
    --base-color2: #f2f0ed;
    --base-color3: #f9f9f9;
    --brown-color: #a69e93;
    --dark-green: #2b5e5e;
    --green-middle: #146352;
    --light-green: #e5f3f3;
    --text-color: #333333;
    --light-color: #666666;
    --lighttext-color: #908e8d;
    --white-color: #ffffff;
    --caution-color: #eb263d;
    --line-color: #cccccc;
    --line-color2: #eaeae4;
    --link-color: #508de0;
    --light-color: #666666;
    --green-gradation: linear-gradient(90deg, #1b5b5b 0%, #2b5e5e 100%);
    --transition-veryshort: 0.2s;
    --transition-short: 0.3s;
    --transition-middle: 0.7s;
    --transition-long1: 1.2s;
    --transition-long2: 2s;
    --easeInOutSine: cubic-bezier(0.39, 0.575, 0.565, 1);
    --font-en: "Minion Pro";
}

.has-error {
    color: #a94442;
}
.has-warning {
    color: #8a6d3b;
}
.has-success {
}

label.has-error {
    font-size: 0.8rem;
    margin-bottom: 0px;
    margin-top: 10px;
}
label.has-warning {
    font-size: 0.8rem;
    margin-bottom: 0px;
    margin-top: 10px;
}
label.has-success {
}

.navbar {
    margin-top: 15px;
    position: static;
}

.has-error input,
.has-error select{
    border: 1px solid #a94442;
}
.has-warning input,
.has-warning select{
    border: 1px solid #8a6d3b;
}
.has-success input,
.has-success select{
}

.clear-both{
    clear: both;
}

.iframe-wrapper {
    position: relative;
    height: 0;
    padding: 0 0 56.25%;
    overflow: hidden;
}
.iframe-wrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 1px #ddd solid;
}

/*
マージン関連
*/
.mt0{
    margin-top: 0px;
}
.mt1{
    margin-top: 1px;
}
.mt2{
    margin-top: 2px;
}
.mt3{
    margin-top: 3px;
}
.mt4{
    margin-top: 4px;
}
.mt5{
    margin-top: 5px;
}
.mt10{
    margin-top: 10px;
}
.mt15{
    margin-top: 15px;
}
.mt20{
    margin-top: 20px;
}
.mt25{
    margin-top: 25px;
}
.mt30{
    margin-top: 30px;
}
.mb5{
    margin-bottom: 5px;
}
.mb10{
    margin-bottom: 10px;
}
.mb15{
    margin-bottom: 15px;
}
.mb20{
    margin-bottom: 20px;
}
.mb25{
    margin-bottom: 25px;
}
.mb30{
    margin-bottom: 30px;
}

.mr5{
    margin-right: 5px;
}
.mr10{
    margin-right: 10px;
}
.mr15{
    margin-right: 15px;
}
.mr20{
    margin-right: 20px;
}
.mr25{
    margin-right: 25px;
}
.mr30{
    margin-right: 30px;
}
.ml5{
    margin-left: 5px;
}
.ml10{
    margin-left: 10px;
}
.ml15{
    margin-left: 15px;
}
.ml20{
    margin-left: 20px;
}
.ml25{
    margin-left: 25px;
}
.ml30{
    margin-left: 30px;
}


.pt0{
    padding-top: 0px;
}
.pt1{
    padding-top: 1px;
}
.pt2{
    padding-top: 2px;
}
.pt3{
    padding-top: 3px;
}
.pt4{
    padding-top: 4px;
}
.pt5{
    padding-top: 5px;
}
.pt10{
    padding-top: 10px;
}
.pt15{
    padding-top: 15px;
}
.pt20{
    padding-top: 20px;
}
.pt25{
    padding-top: 25px;
}
.pt30{
    padding-top: 30px;
}
.pb5{
    padding-bottom: 5px;
}
.pb10{
    padding-bottom: 10px;
}
.pb15{
    padding-bottom: 15px;
}
.pb20{
    padding-bottom: 20px;
}
.pb25{
    padding-bottom: 25px;
}
.pb30{
    padding-bottom: 30px;
}
.pt5{
    padding-top: 5px;
}
.pr10{
    padding-right: 10px;
}
.pr15{
    padding-right: 15px;
}
.pr20{
    padding-right: 20px;
}
.pr25{
    padding-right: 25px;
}
.pr30{
    padding-right: 30px;
}
.pl5{
    padding-left: 5px;
}
.pl10{
    padding-left: 10px;
}
.pl15{
    padding-left: 15px;
}
.pl20{
    padding-left: 20px;
}
.pl25{
    padding-left: 25px;
}
.pl30{
    padding-left: 30px;
}
.wd25{
    width: 25px;
}


.pcnone{
    display: none;
}

.spnone{
    display: block;
}

@media (max-width: 720px) {

    .pcnone {
        display: block;
    }

    .spnone {
        display: none;
    }

    .navbar img{
        margin-bottom: 30px;
    }

    .navbar a{
        margin-bottom: 15px;
    }
}

.breadcrumb {
    background:transparent;
    font-size: 0.8rem;
}

.cc {
    font-size: 30px;
}

/**
 * The CSS shown here will not be introduced in the Quickstart guide, but shows
 * how you can use CSS to style your Element's container.
 */
.StripeElement {
    background-color: white;
    height: 40px;
    padding: 10px 12px;
    border-radius: 4px;
    border: 1px solid #ced4da;
}

.StripeElement--invalid {
    border-color: #a94442;
}

.StripeElement--invalid-font {
    color: #a94442;
}

.StripeElement--webkit-autofill {
    background-color: #a94442 !important;
}

.ElementsApp .InputElement.is-invalid {
    color: #a94442;
}

#sub_fv ul {
    list-style: none;
}

.h_org1{
    font-size: 2rem;
    margin-bottom: 0.5rem;
    font-family: inherit;
    font-weight: 600;
    line-height: 1.5;
    color: inherit;
}

.subsc_item{
    border-bottom: 1px solid #ccc;
}

.subsc_item:last-of-type{
    border-bottom: none;
}

.marker-green {
    background: linear-gradient(transparent 60%, #aaf1e0 0%);
}

.marker-red {
    background: linear-gradient(transparent 60%, #e0b3be 0%);
}

.bold{
    font-weight: bold;
}

@media (max-width: 991px){
    .youtube {
        position: relative;
        width: calc(100% - 30px);
        padding-top: 56.25%;
        margin-left: 15px;
        margin-bottom: 40px;
        text-align: center;
    }
    .youtube iframe {
        position: absolute;
        top: 0;
        right: 0;
        width: 100%;
        height: 100%;
    }
}

iframe {
    max-width: 100%;
}

@media (max-width: 767px) {
    .sp_none{
        display: none !important;
    }
}


.btn-secondary {
    background: var(--green-gradation);
    border: 0;
    border-radius: 100vw;
    color: var(--white-color);
    display: flex;
    font-weight: 500;
    justify-content: center;
    align-items: center;
}

.btn-secondary {
    opacity: 1;
    transition: var(--transition-short);
}

.btn-secondary:hover {
    opacity: 0.7;
}

.btn-outline-secondary {
    color: #146352;
    background-color: transparent;
    background-image: none;
    border-radius: 100vw;
    border-color: #146352; }
.btn-outline-secondary:hover {
    color: #fff;
    background-color: #146352;
    border-color: #146352; }
.btn-outline-secondary:focus, .btn-outline-secondary.focus {
    box-shadow: none }
.btn-outline-secondary.disabled, .btn-outline-secondary:disabled {
    color: #146352;
    background-color: transparent; }
.btn-outline-secondary:not(:disabled):not(.disabled):active, .btn-outline-secondary:not(:disabled):not(.disabled).active,
.show > .btn-outline-secondary.dropdown-toggle {
    color: #fff;
    background-color: #146352;
    border-color: #146352; }
.btn-outline-secondary:not(:disabled):not(.disabled):active:focus, .btn-outline-secondary:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-secondary.dropdown-toggle:focus {
    box-shadow: none; }

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

a:hover {
    color: #146352;
    text-decoration: none;
    opacity: 0.5;
}

.btn-outline-dark{
    border-radius: 100vw;
}

.btn_entry_big{
    border-radius: 100vw;
}

.btn_doc_big{
    border-radius: 100vw;
}
