@charset "utf-8";

/*--------------------------------------
keyArea
---------------------------------------*/

.keyArea {
    min-height: 43rem;
}

.keyArea .inner {
    position: relative;
    width: 102rem;
    margin: 0 auto;
    padding: 2rem 0 4rem 0;
}

.keyArea .inner::before {
    position: absolute;
    left: 56rem;
    top: -1rem;
    width: 110rem;
    height: 53rem;
    background: url(img/mv_bg_01.png) no-repeat left top;
    background-size: contain;
    content: "";
}


.keyArea .mainTit {
    margin: 0 0 2rem 1rem;
    color: #f59d4c;
    font-size: 4.2rem;
    font-weight: 700;
    line-height: 1.4;
}

.keyArea .mainTit span {
    color: #279761;
    font-size: 3rem;
}

.keyArea .mainTit .Ttl {
    margin: 0 0 2rem 1rem;
    color: #f59d4c;
    font-size: 4.2rem;
    font-weight: 700;
    line-height: 1.4;
    display: block;
}

.keyArea .mainTxt {
    max-width: 51rem;
    padding: 2.5rem 3rem;
    background: #f7f9ec;
    border-radius: 2rem;
}

.keyArea .mainTxt p:not([class]) {
    margin: 0;
}


/*--------------------------------------
toc
---------------------------------------*/

.main-index .block-toc {
    width: 80rem;
    margin: 0 auto;
    padding: 8rem 0 0 0;
}


/*--------------------------------------
addCont02
---------------------------------------*/

.addCont02 {
    position: relative;
    padding: 10rem 0;
    background: url(img/add01_bg_01.png) repeat;
}

.addCont02::before {
    position: absolute;
    left: 0;
    top: 0;
    width: 100vw;
    height: 100%;
    background: rgb(187, 214, 150);
    background: -webkit-linear-gradient(0deg, rgba(187, 214, 150, 1) 0%, rgba(154, 188, 100, 1) 100%);
    background: linear-gradient(0deg, rgba(187, 214, 150, 1) 0%, rgb(155 194 102) 100%);
    content: "";
    pointer-events: none;
    z-index: -1;
}

.addCont02 .en {
    color: #d17119;
}

.addCont02 .addCont-title,
.addCont02 .lead {
    color: #ffffff;
}

.addCont02-company {
    margin: 0 0 10rem 0;
    padding: 4rem;
    background: #fff;
    border-radius: 2rem;
}

.addCont02-company:last-child {
    margin: 0;
}

.addCont02 table th {
    width: 24rem;
    padding: 1.5rem 2rem;
    font-size: 1.6rem;
}

.addCont02 table td {
    padding: 1.5rem 2rem;
    font-size: 1.6rem;
}

.addCont02 .block-head {
    min-height: 10rem;
    margin: 0 0 3rem 0;
    padding: 0 0 2.4rem 12rem;
    border-bottom: 5px solid #e6e8ce;
}

#company-1 .block-head {
    background: url(img/add02_ico_01.png) no-repeat left top;
    background-size: 100px auto;
}

#company-2 .block-head {
    background: url(img/add02_ico_02.png) no-repeat left top;
    background-size: 100px auto;
}

#company-3 .block-head {
    background: url(img/add02_ico_03.png) no-repeat left top;
    background-size: 100px auto;
}

.addCont02 .block-head .catch {
    padding: 1rem 0 0.5rem 0;
    color: #faa501;
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.4;
}

.addCont02 .block-head .name {
    font-size: 3.2rem;
    font-weight: 700;
    line-height: 1.4;
}

.addCont02 .fig {
    max-width: 76rem;
    margin: 0 auto;
    text-align: center;
}

.addCont02 .fig+.caption {
    text-align: center;
}

.addCont02 .block {
    position: relative;
    margin: 0 3rem;
}

.addCont02 .block.arrow {
    margin: 0 3rem 12rem 3rem;
}

.addCont02 .block.arrow::before {
    position: absolute;
    left: 50%;
    top: calc(100% + 4rem);
    transform: translateX(-50%);
    width: 7.5rem;
    height: 3.8rem;
    background-size: contain;
    content: "";
}

.addCont02 .block .box {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 0 0 4rem 0;
}

.addCont02 .block .box-fig {
    width: 28rem;
    text-align: center;
}

.addCont02 .block .box-txt {
    width: calc(100% - 28rem);
    padding: 0 0 0 3rem;
}

.addCont02 .block .box-txt .ttl {
    margin: 3rem 0 1.5rem 0;
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.4;
}

.addCont02 .block .box-txt .ttl:first-child {
    margin: 0 0 1.5rem 0;
}

.addCont02 .block .box-txt p:not([class]) {
    margin: 1em 0 0 0;
    font-size: 1.4rem;
}

.addCont02 .block .box.fig-r .box-fig {
    order: 2;
}

.addCont02 .block .box.fig-r .box-txt {
    padding: 0 3rem 0 0;
    order: 1;
}

.movie {
    max-width: 67rem;
    margin: 0 auto;
}

.movie div {
    position: relative;
    padding: 56.25% 0 0 0;
}

.movie iframe {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    border: none;
}

.movie+.caption {
    text-align: center;
}

.addCont02 .title {
    position: relative;
    margin: 16rem 0 4rem 0;
    padding: 2rem 2rem 1.5rem 2rem;
    background: #f8edc0;
    border-radius: 1rem;
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.4;
    text-align: center;
}

.addCont02 .title::before {
    position: absolute;
    left: 2rem;
    top: -2rem;
    width: 14.4rem;
    height: 3.6rem;
    background: url(img/add02_bg_02.png) no-repeat left top;
    background-size: contain;
    content: "";
}

.addCont02 .title span {
    color: #f9885c;
    font-size: 2.6rem;
}

.addCont02-company>.catch {
    margin: 4rem 2.5rem 2rem 2.5rem;
    padding: 0 0 1.2rem 0;
    border-bottom: 1px dashed #333;
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.4;
}

.addCont02-company>.catch+p:not([class]),
.addCont02-company>.catch+p:not([class])+p:not([class]) {
    margin: 1em 2.5rem 0 2.5rem;
}

.addCont02 h4:not([class])+p:not([class]),
.addCont02 h4:not([class])+p:not([class])+.caption {
    margin: 1em 2.5rem 0 2.5rem;
}

.addCont02 .btn-web {
    max-width: 33rem;
}


/*--------------------------------------
addCont03
---------------------------------------*/

.addCont03 {
    padding: 8rem 0 10rem 0;
}

.addCont03 .frame-wrap .frame-head .ttl {
    font-size: 2rem;
}


/*--------------------------------------
addCont04
---------------------------------------*/

.addCont04 {
    padding: 10rem 0;
}

.addCont04 .block {
    display: flex;
    align-items: center;
    min-height: 33rem;
    margin: 0 0 4rem 0;
    background: url(img/add04_bg_01.png) no-repeat right top;
    background-size: auto 100%;
}

.addCont04 .block .box {
    width: 54rem;
}

.addCont04 .block .box .title {
    margin: 0 0 3rem 0;
    color: #279761;
    font-size: 3.6rem;
    font-weight: 700;
    line-height: 1.4;
}

.addCont04 .block .box .title a {
    display: inline-block;
    padding: 0 4.5rem 0 0;
    background: url(img/arrow02_green.svg) no-repeat right center;
    background-size: 28px auto;
    color: inherit;
    text-decoration: none;
}


/*--------------------------------------
addCont05
---------------------------------------*/

.addCont05 {
    padding: 10rem 0;
    background: #f7f4ef;
}

.addCont05 .block {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.addCont05 .block .box {
    width: calc((100% - 4rem) / 2);
    margin: 0 0 3rem 0;
    padding: 3.5rem 2.5rem;
    background: #fff;
    border-radius: 1.8rem;
}

.addCont05 .block .box-head {
    display: flex;
    align-items: center;
    margin: 0 0 2rem 0;
    padding: 0 0 1.5rem 0;
    border-bottom: 1px dashed #279761;
}

.addCont05 .block .box-head .ttl {
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 6rem;
    padding: 0 0 0 8rem;
    background: url(img/add05_bg_01.png) no-repeat left center;
    background-size: 60px auto;
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.4;
}

.addCont05 .block .box-head .ttl a {
    display: block;
    width: 100%;
    padding: 0 4rem 0 0;
    background: url(img/arrow02_green.svg) no-repeat right center;
    background-size: 28px auto;
    color: inherit;
    text-decoration: none;
}

.addCont05 .block .box-body p:not([class]) {
    margin: 0;
}





@media screen and (max-width: 599px) {
    /*--------------------------------------
keyArea
---------------------------------------*/
    .keyArea {
        min-height: auto;
    }
    .keyArea .inner {
        width: 100%;
        background: url(img/mv_bg_01_sp.png) no-repeat right top;
        background-size: 100%;
        padding: 1rem 1rem 4rem 1rem;
    }
    .keyArea .inner::before {
        display: none;
        content: none;
    }
    .keyArea .mainTit {
        margin: 19rem 0 1.5rem 0;
        font-size: 2.4rem;
        font-weight: 700;
        line-height: 1.4;
    }
    .keyArea .mainTit span {
        display: inline-block;
        font-size: 1.9rem;
        line-height: 1.4;
    }
    .keyArea .mainTit .Ttl {
        margin: 0 0 1.5rem 0;
        font-size: 2.4rem;
        font-weight: 700;
        line-height: 1.4;
        display: inline-block;
    }
    .keyArea .mainTxt {
        max-width: 100%;
        padding: 1.5rem;
        border-radius: 1.5rem;
    }
    .keyArea .mainTxt p:not([class]) {
        margin: 0;
    }
    /*--------------------------------------
toc
---------------------------------------*/
    .main-index .block-toc {
        width: 100%;
        padding: 5rem 0 0 0;
    }
    /*--------------------------------------
addCont02
---------------------------------------*/
    .addCont02 {
        padding: 4rem 0;
        background: url(img/add01_bg_01_sp.png) repeat;
                background-size: 5rem;
    }
    .addCont02-company {
        margin: 0 auto 6rem;
        padding: 2rem 1.7rem;
        width: 97%;
    }

    .addCont02-company:last-child{
         margin: 0 auto 6rem;       
    }

    .addCont02 table th {
        width: 100%;
        padding: 1.5rem;
        font-size: 1.4rem;
    }
    .addCont02 table td {
        padding: 1.5rem;
        font-size: 1.4rem;
        text-align: center;
    }
    .addCont02 .block-head {
        min-height: 8rem;
        margin: 0 0 3rem 0;
        padding: 0 0 1.6rem 9rem;
    }
    #company-1 .block-head {
        background-size: 75px auto;
        margin-top: 2rem;
    }
    #company-2 .block-head {
        background-size: 75px auto;
    }
    #company-3 .block-head {
        background-size: 75px auto;
    }
    .addCont02 .block-head .catch {
        padding: 0 0 0.5rem 0;
        font-size: 1.6rem;
    }
    .addCont02 .block-head .name {
        font-size: 2.1rem;
    }
    .addCont02 .fig {
        max-width: 100%;
    }
    .addCont02 .block {
        margin: 0;
    }
    .addCont02 .block.arrow {
        margin: 0 0 8rem 0;
    }
    .addCont02 .block.arrow::before {
        top: calc(100% + 2rem);
    }
    .addCont02 .block .box-fig {
        width: 100%;
        margin: 0 0 2rem 0;
    }
    .addCont02 .block .box-txt {
        width: 100%;
        padding: 0;
    }
    .addCont02 .block .box-txt .ttl {
        margin: 2rem 0 1.5rem 0;
        font-size: 1.8rem;
    }
    .addCont02 .block .box.fig-r .box-fig {
        order: 1;
    }
    .addCont02 .block .box.fig-r .box-txt {
        padding: 0;
        order: 2;
    }
    .movie 
{        max-width: 100%;
    }
    .addCont02 .title {
        margin: 6rem 0 3rem 0;
        padding: 2rem 1.5rem 1.5rem 1.5rem;
        font-size: 1.6rem;
    }
    .addCont02 .title::before {
        left: 1.5rem;
        top: -2rem;
        width: 12rem;
        height: 3rem;
    }
    .addCont02 .title::after {
        top: -8rem;
    }
    .addCont02 .title span {
        font-size: 2rem;
    }
    .addCont02-company>.catch {
        margin: 2rem 0;
        padding: 0 0 0.8rem 0;
        font-size: 1.6rem;
    }
    .addCont02-company>.catch+p:not([class]),
    .addCont02-company>.catch+p:not([class])+p:not([class]) {
        margin: 1em 0 0 0;
    }
    .addCont02 h4:not([class])+p:not([class]),
    .addCont02 h4:not([class])+p:not([class])+.caption {
        margin: 1em 0 0 0;
    }
    .addCont02 .btn-web {
        max-width: 90%;
    }
    /*--------------------------------------
addCont03
---------------------------------------*/
    .addCont03 {
        padding: 4rem 0 5rem 0;
    }
    .addCont03 .frame-wrap .frame-head .ttl {
        font-size: 1.8rem;
    }
    /*--------------------------------------
addCont04
---------------------------------------*/
    .addCont04 {
        padding: 5rem 0 0 0;
    }
    .addCont04 .block {
        display: block;
        min-height: auto;
        margin: 0 0 3rem 0;
        background: none;
    }
    .addCont04 .block .box {
        width: 100%;
    }
    .addCont04 .block .box .title-wrap {
        display: flex;
        align-items: center;
        min-height: 15rem;
        padding: 0;
        background: url(img/add04_bg_01.png) no-repeat right top;
        background-size: auto 100%;
    }
    .addCont04 .block .box .title {
        margin: 0;
        font-size: 2.4rem;
    }
    .addCont04 .block .box .title a {
        padding: 0;
        background: none;
    }
    .addCont04 .block .box .title a span {
        display: inline-block;
        padding: 0.5rem;
        background: #fff;
        border-radius: 0.8rem;
    }
    .addCont04 .block .box .title a span:last-child {
        padding: 0.5rem 4rem 0.5rem 0.5rem;
        background: #fff url(img/arrow02_green.svg) no-repeat right 0.5rem center;
        background-size: 20px auto;
    }
    /*--------------------------------------
addCont05
---------------------------------------*/
    .addCont05 {
        padding: 5rem 0;
    }
    .addCont05 .block {
        display: block;
    }
    .addCont05 .block .box {
        width: 90%;
        padding: 2rem;
        margin: 0 auto 2rem;
    }
    .addCont05 .block .box-head .ttl a {
        padding: 0 3rem 0 0;
        background-size: 20px auto;
    }
}