@charset "UTF-8";

/* top-hero */
.top-hero{
    display: flex;
    flex: 1;
    justify-content: center;
    align-items: center;
    min-width: 530px;
    height: 38vw;
    background: url(../img/home/img-top-hero-bg.svg) center / cover no-repeat;
}

.top-hero-inner{
    position: relative;
    display: flex;
    flex-flow: column;
    justify-content: center;
    max-width: 1310px;
    width: 100%;
    height: 100%;
    margin: auto;
    padding: 0 15px;
}

.top-hero-inner ul{
    display: flex;
    gap: 0 25px;
}

.top-hero-inner ul li{
    width: 209px;
}

.top-hero-inner .fig{
    position: absolute;
    right: 0;
    bottom: 0;
    min-width: 485px;
    width: 32vw;
}

.top-hero-txt{
    padding-bottom: 12px;
    font-size: 28px;
    font-weight: bold;
    color: #003128;
}

.top-hero-txt strong{
    display: block;
    font-size: 62px;
}

/* row-ttl */
.row-ttl-wrap{
    display: flex;
    align-items: flex-end;
    color: #003128;
    line-height: 0.95;
}

.row-ttl{
    font-size: 65px;
}

.row-ttl-ja{
    margin-left: 17px;
    font-weight: bold;
}

/* search */
.-search .top{
    padding-top: 75px;
    padding-bottom: 76px;
    background: #8CB808;
    /* background: linear-gradient(0.25turn, #96b639 0%, #008129 100%); */
    
}

.-search .c-ttl{
    margin-bottom: 29px;
    padding-left: 30px;
    background: url(../img/cmn/img-ic-search.svg) center left / 24px auto no-repeat;
}

.-search .cont-list{
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    gap: 18px;
}

.-search .cont .head{
    display: flex;
    align-items: center;
    gap: 10px;
    height: 80px;
    padding: 0 20px;
    color: #fff;
    background: #008129 url(../img/cmn/img-ic-arrow-white.svg) center right 20px / 15px auto no-repeat;
    transition: .3s ease-in-out;
}

.-search .cont:hover .head{
    background-color: #003128;
}

.-search .cont .head .ic{
    width: 57px;
}

.-search .cont .list-box{
    height: calc(100% - 80px);
    background: #fff;
    padding: 7px 17px;
}

.-search .btm{
    padding: 41px 0 55px;
    background: #003128;
    color: #fff;
}

.-search .serv-list{
    gap: 19px 16px;
}

.-search .serv-list li{
    max-width: 364px;
    width: calc((100% / 3) - (16px * 2 / 3));
    height: 55px;
    border-bottom: solid 1px #637968;
}

.-search .serv-list li a{
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
    padding: 0 11px;
    font-weight: bold;
    background: transparent url(../img/cmn/img-ic-arrow-white.svg) center right 11px / 15px auto no-repeat;
    transition: .3s ease-in-out;
}

.-search .serv-list li a:hover{
    background-color: #8CB808;
}

/* choice */
.-choice{
    padding: 75px 0 88px;
    background: #fff;
}

.-choice .head{
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 40px;
    margin-bottom: 38px;
}

.-choice .lead{
    flex-shrink: 0;
    line-height: 1.9;
}

.-choice .choice-list{
    gap: 24px;
}

.-choice .choice-list li section,
.-choice .choice-list li a{
    height: 100%;
}

.-choice .choice-list li a{
    display: flex;
    flex-direction: column;
    padding: 28px;
    border-radius: 5px;
    background: #fff;
    box-shadow: 0 8px 22px rgba(0, 49, 40, .12);
    transition: .3s ease-in-out;
}

.-choice .choice-list li a:hover{
    transform: translateY(-6px);
    box-shadow: 0 14px 30px rgba(0, 49, 40, .18);
}

.-choice .tag{
    display: inline-block;
    width: fit-content;
    margin-bottom: 18px;
    padding: 3px 14px;
    font-size: 14px;
    color: #fff;
    background: #8CB808;
}

.-choice .c-ttl{
    margin-bottom: 16px;
}

.-choice .choice-list p{
    flex-grow: 1;
    margin-bottom: 27px;
}

.-choice .out-link{
    align-self: flex-start;
    font-weight: bold;
    color: #008129;
}

/* faq */
.-faq{
    padding: 75px 0 88px;
    background: #F7F7F7;
    text-align: center;
}

.-faq .head{
    margin-bottom: 38px;
}

.-faq .lead{
    margin-top: 18px;
    line-height: 1.9;
}

.-faq-list{
    gap: 24px;
    text-align: left;
}

.-faq-list li a,
.-faq-card{
    height: 100%;
}

.-faq-list li a{
    display: block;
    transition: .3s ease-in-out;
}

.-faq-list li a:hover{
    transform: translateY(-6px);
}

.-faq-card{
    padding: 28px;
    border-radius: 5px;
    background: #fff;
    box-shadow: 0 8px 22px rgba(0, 49, 40, .12);
    transition: .3s ease-in-out;
}

.-faq-list li a:hover .-faq-card{
    box-shadow: 0 14px 30px rgba(0, 49, 40, .18);
}

.-faq-q{
    margin-bottom: 18px;
    font-size: 18px;
    font-weight: bold;
    color: #003128;
}

.-faq-a{
    padding-top: 18px;
    border-top: solid 1px #D8D8D8;
}

.-faq-q .-en,
.-faq-a .-en{
    display: block;
    margin-bottom: 6px;
    font-size: 20px;
    font-weight: 500;
    color: #008129;
}

.-faq .c-btn{
    margin: 40px auto 0;
}

/* download */
.download-sec{
    padding: 75px 0 88px;
    background: #fff;
}

.download-sec .head{
    margin-bottom: 38px;
    text-align: center;
}

.download-sec .head .bold{
    margin-bottom: 12px;
}

.download-sec .c-ttl{
    color: #003128;
}

.download-sec .lead{
    margin-top: 20px;
    line-height: 1.9;
}

.download-box{
    gap: 46px;
    padding: 44px;
    border-radius: 5px;
    background: #F7F7F7;
    box-shadow: 0 8px 22px rgba(0, 49, 40, .10);
}

.download-img{
    flex-shrink: 0;
    width: 52%;
    border-radius: 5px;
    overflow: hidden;
    background: #fff;
}

.download-body{
    flex-grow: 1;
}

.download-body .c-ttl{
    margin-bottom: 24px;
}

.download-list{
    margin-bottom: 32px;
}

.download-list li:not(:last-of-type){
    margin-bottom: 14px;
}

.download-body .c-btn{
    max-width: 364px;
    width: 100%;
}

/* consult-cta */
.consult-cta{
    padding: 88px 0 96px;
    background: linear-gradient(0.25turn, #003128 0%, #00533F 100%);
    color: #fff;
}

.consult-cta-inner{
    max-width: 820px;
    margin: auto;
    text-align: center;
}

.consult-cta-label{
    margin-bottom: 12px;
    font-weight: bold;
    color: #8CB808;
}

.consult-cta .c-ttl{
    line-height: 1.5;
}

.consult-cta .lead{
    margin-top: 24px;
    line-height: 1.9;
}

.consult-cta-btns{
    gap: 20px;
    margin-top: 38px;
}

.consult-cta-btns .c-btn:first-of-type a{
    color: #003128;
    background-color: #fff;
    background-image: url(../img/cmn/img-arrow-d_green.svg);
}

.consult-cta-btns .c-btn:first-of-type a:hover{
    color: #fff;
    background-color: #8CB808;
    background-image: url(../img/cmn/img-ic-arrow-white.svg);
}

.consult-cta-btns .c-btn:last-of-type a{
    background-color: #008129;
}

.consult-cta-btns .c-btn:last-of-type a:hover{
    background-color: #8CB808;
}

.consult-cta-note{
    margin-top: 22px;
    font-size: 14px;
    color: #D8D8D8;
}

/* article */
.article-fv{
    padding: 92px 0 78px;
    background: #F7F7F7;
}

.article-fv .inner{
    max-width: 920px;
}

.article-meta{
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 24px;
    color: #008129;
    font-size: 14px;
    font-weight: bold;
}

.article-meta span{
    display: inline-block;
    padding: 4px 14px;
    color: #fff;
    background: #008129;
}

.article-fv h1{
    font-size: 40px;
    line-height: 1.5;
    font-weight: bold;
    color: #003128;
}

.article-fv .lead{
    margin-top: 28px;
    line-height: 2;
}

.article-summary,
.article-section{
    padding: 72px 0;
    background: #fff;
}

.article-summary{
    background: #F7F7F7;
}

.article-content{
    max-width: 920px;
    margin: auto;
}

.article-content > .c-ttl{
    position: relative;
    margin-bottom: 28px;
    padding-bottom: 18px;
    color: #003128;
}

.article-content > .c-ttl::after{
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 72px;
    height: 2px;
    background: #008129;
}

.article-content p{
    line-height: 2;
}

.article-content p:not(:last-child){
    margin-bottom: 18px;
}

.article-card-list{
    gap: 20px;
}

.article-card{
    padding: 26px 22px;
    border-radius: 5px;
    background: #F7F7F7;
    box-shadow: 0 8px 22px rgba(0, 49, 40, .08);
}

.article-card .c-ttl{
    margin-bottom: 14px;
}

.article-card p{
    font-size: 15px;
    line-height: 1.85;
}

.article-table{
    overflow-x: auto;
    margin-top: 24px;
}

.article-table table{
    width: 100%;
    min-width: 760px;
    border-collapse: collapse;
    background: #fff;
}

.article-table th,
.article-table td{
    padding: 18px;
    border: solid 1px #D8D8D8;
    vertical-align: top;
    line-height: 1.7;
}

.article-table thead th{
    color: #fff;
    background: #003128;
}

.article-table tbody th{
    width: 20%;
    color: #003128;
    background: #F2F7E5;
}

.article-check-list{
    padding: 28px;
    border-radius: 5px;
    background: #F7F7F7;
}

.article-check-list li:not(:last-of-type){
    margin-bottom: 14px;
}

.article-cta{
    padding: 80px 0 90px;
    background: #F7F7F7;
}

.article-cta-box{
    max-width: 860px;
    margin: auto;
    padding: 56px 40px;
    border-radius: 5px;
    color: #fff;
    text-align: center;
    background: linear-gradient(0.25turn, #003128 0%, #00533F 100%);
}

.article-cta-label{
    margin-bottom: 12px;
    font-weight: bold;
    color: #8CB808;
}

.article-cta .lead{
    margin-top: 22px;
    line-height: 1.9;
}

.article-cta-btns{
    gap: 20px;
    margin-top: 34px;
}

.article-cta-btns .c-btn:first-of-type a{
    color: #003128;
    background-color: #fff;
    background-image: url(../img/cmn/img-arrow-d_green.svg);
}

.article-cta-btns .c-btn:first-of-type a:hover{
    color: #fff;
    background-color: #8CB808;
    background-image: url(../img/cmn/img-ic-arrow-white.svg);
}

.article-cta-btns .c-btn:last-of-type a{
    background-color: #008129;
}

.article-cta-btns .c-btn:last-of-type a:hover{
    background-color: #8CB808;
}

/* faq-common-cta */
.faq-common-cta{
    padding: 72px 0;
    background: #F7F7F7;
}

.faq-common-cta-head{
    max-width: 820px;
    margin: 0 auto 34px;
    text-align: center;
}

.faq-common-cta-head .c-ttl{
    margin-bottom: 18px;
    color: #003128;
    line-height: 1.5;
}

.faq-common-cta-head .lead{
    line-height: 1.9;
}

.faq-common-cta-list{
    max-width: 1040px;
    margin: auto;
    gap: 24px;
}

.faq-common-cta-card{
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 30px 26px;
    border-radius: 5px;
    background: #fff;
    box-shadow: 0 8px 22px rgba(0, 49, 40, .10);
    transition: .3s ease-in-out;
}

.faq-common-cta-card:hover{
    transform: translateY(-4px);
    box-shadow: 0 14px 30px rgba(0, 49, 40, .14);
}

.faq-common-cta-card .c-ttl{
    margin-bottom: 14px;
}

.faq-common-cta-card p{
    flex-grow: 1;
    margin-bottom: 24px;
    line-height: 1.85;
}

.faq-common-cta-card .c-btn{
    max-width: 100%;
    width: 100%;
    height: 56px;
}

.faq-common-cta-card .c-btn a{
    padding: 0 30px 0 24px;
    font-size: 15px;
}

.faq-common-cta-note{
    max-width: 820px;
    margin: 30px auto 0;
    padding-top: 22px;
    border-top: solid 1px #D8D8D8;
    text-align: center;
    line-height: 1.9;
    color: #003128;
}

/* issues */
.issues-card-list{
    gap: 20px;
}

.issues-card a{
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 28px 22px;
    border-top: solid 5px #008129;
    border-radius: 5px;
    background: #fff;
    box-shadow: 0 8px 22px rgba(0, 49, 40, .10);
    transition: .3s ease-in-out;
}

.issues-card a:hover{
    transform: translateY(-6px);
    box-shadow: 0 14px 30px rgba(0, 49, 40, .16);
}

.issues-card .c-ttl{
    margin-bottom: 14px;
}

.issues-card p{
    flex-grow: 1;
    margin-bottom: 24px;
    font-size: 15px;
    line-height: 1.85;
}

.issues-card .out-link{
    align-self: flex-start;
    font-weight: bold;
    color: #008129;
}

.issues-choice .btn-block{
    height: auto;
    margin-top: 34px;
}

.issues-related{
    background: #F7F7F7;
}

.issues-related-list{
    gap: 24px;
}

.issues-related-card a{
    display: block;
    height: 100%;
    padding: 28px;
    border-radius: 5px;
    background: #fff;
    box-shadow: 0 8px 22px rgba(0, 49, 40, .10);
    transition: .3s ease-in-out;
}

.issues-related-card a:hover{
    transform: translateY(-6px);
    box-shadow: 0 14px 30px rgba(0, 49, 40, .16);
}

.issues-related-card span{
    display: inline-block;
    margin-bottom: 14px;
    padding: 3px 12px;
    font-size: 13px;
    font-weight: bold;
    color: #fff;
    background: #008129;
}

.issues-related-card h3{
    margin-bottom: 14px;
    font-size: 18px;
    font-weight: bold;
    line-height: 1.6;
    color: #003128;
}

.issues-related-card p{
    font-size: 15px;
    line-height: 1.85;
}

/* option */
.option-table table{
    min-width: 980px;
}

.option-table tbody tr{
    transition: .3s ease-in-out;
}

.option-table tbody tr:hover{
    background: #F7F7F7;
}

.option-table tbody th{
    width: 16%;
}

.option-card-list{
    gap: 20px;
}

.option-card{
    padding: 28px 22px;
    border-top: solid 5px #008129;
    border-radius: 5px;
    background: #F7F7F7;
    box-shadow: 0 8px 22px rgba(0, 49, 40, .08);
}

.option-card .c-ttl{
    margin-bottom: 18px;
}

.option-card dl{
    line-height: 1.8;
}

.option-card dt{
    display: inline-block;
    margin-bottom: 6px;
    padding: 2px 10px;
    font-size: 13px;
    font-weight: bold;
    color: #fff;
    background: #008129;
}

.option-card dd{
    margin-bottom: 16px;
}

.option-card dd:last-of-type{
    margin-bottom: 0;
}

/* faq-index */
.faq-nav{
    position: sticky;
    top: 80px;
    padding: 18px 0;
    background: #fff;
    box-shadow: 0 8px 22px rgba(0, 49, 40, .08);
    z-index: 5;
}

.faq-nav ul{
    display: flex;
    gap: 12px;
}

.faq-nav a{
    display: block;
    padding: 10px 18px;
    border-radius: 33px;
    color: #003128;
    font-weight: bold;
    background: #F2F7E5;
    transition: .3s ease-in-out;
}

.faq-nav a:hover{
    color: #fff;
    background: #008129;
}

.faq-category:nth-of-type(odd){
    background: #F7F7F7;
}

.faq-card-list{
    gap: 24px;
}

.faq-card a{
    display: block;
    height: 100%;
    padding: 28px;
    border-radius: 5px;
    background: #fff;
    box-shadow: 0 8px 22px rgba(0, 49, 40, .10);
    transition: .3s ease-in-out;
}

.faq-card a:hover{
    transform: translateY(-6px);
    box-shadow: 0 14px 30px rgba(0, 49, 40, .16);
}

.faq-card span{
    display: inline-block;
    margin-bottom: 14px;
    padding: 3px 12px;
    font-size: 13px;
    font-weight: bold;
    color: #fff;
    background: #008129;
}

.faq-card h3{
    margin-bottom: 14px;
    padding-right: 28px;
    font-size: 19px;
    font-weight: bold;
    line-height: 1.6;
    color: #003128;
    background: url(../img/cmn/img-arrow-green.svg) top 8px right / 15px auto no-repeat;
}

.faq-card p{
    font-size: 15px;
    line-height: 1.85;
}

.faq-guide-btns{
    gap: 20px;
    margin-top: 34px;
}

/* what-is */
.what-is-fv{
    padding: 54px 0 78px;
    background: #F7F7F7;
}

.breadcrumb{
    margin-bottom: 34px;
    font-size: 13px;
}

.breadcrumb ol{
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.breadcrumb li:not(:last-of-type)::after{
    content: "/";
    margin-left: 8px;
    color: #8CB808;
}

.breadcrumb a{
    color: #008129;
}

.what-is-fv-row{
    gap: 54px;
}

.what-is-fv-body{
    flex: 1;
}

.what-is-label{
    margin-bottom: 14px;
    font-weight: bold;
    color: #008129;
}

.what-is-fv h1{
    font-size: 40px;
    line-height: 1.5;
    font-weight: bold;
    color: #003128;
}

.what-is-fv .lead{
    margin-top: 26px;
    line-height: 2;
}

.what-is-fv-img{
    flex-shrink: 0;
    width: 42%;
    border-radius: 5px;
    overflow: hidden;
    box-shadow: 0 8px 22px rgba(0, 49, 40, .10);
}

.what-is-two-col{
    max-width: 1040px;
    margin: auto;
    gap: 54px;
}

.what-is-text{
    flex: 1;
}

.what-is-text .c-ttl{
    margin-bottom: 28px;
}

.what-is-text p{
    line-height: 2;
}

.what-is-text p:not(:last-child){
    margin-bottom: 18px;
}

.what-is-diagram{
    flex-shrink: 0;
    width: 360px;
    padding: 34px;
    border-radius: 5px;
    background: #F7F7F7;
    box-shadow: 0 8px 22px rgba(0, 49, 40, .08);
}

.what-is-diagram .c-ttl{
    margin-bottom: 24px;
}

.what-is-diagram li{
    position: relative;
    padding: 18px;
    border-radius: 5px;
    color: #fff;
    font-weight: bold;
    text-align: center;
    background: #003128;
}

.what-is-diagram li:not(:last-child){
    margin-bottom: 34px;
}

.what-is-diagram li:not(:last-child)::after{
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -25px;
    width: 0;
    height: 0;
    margin: auto;
    border-style: solid;
    border-width: 12px 8px 0 8px;
    border-color: #8CB808 transparent transparent transparent;
}

.what-is-origin-list,
.what-is-choice-list,
.what-is-faq-list{
    gap: 24px;
}

.what-is-origin-card,
.what-is-choice-card{
    padding: 28px;
    border-radius: 5px;
    background: #fff;
    box-shadow: 0 8px 22px rgba(0, 49, 40, .10);
}

.what-is-icon{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    margin-bottom: 18px;
    border-radius: 50%;
    color: #fff;
    font-weight: bold;
    background: #008129;
}

.what-is-origin-card .c-ttl,
.what-is-choice-card .c-ttl{
    margin-bottom: 14px;
}

.what-is-origin-card p,
.what-is-choice-card p,
.what-is-choice-card dd{
    font-size: 15px;
    line-height: 1.85;
}

.what-is-choice-card dl{
    margin: 20px 0;
}

.what-is-choice-card dt{
    display: inline-block;
    margin-bottom: 8px;
    padding: 2px 10px;
    font-size: 13px;
    font-weight: bold;
    color: #fff;
    background: #008129;
}

.what-is-faq-card a{
    display: block;
    height: 100%;
    padding: 24px 52px 24px 24px;
    border-radius: 5px;
    color: #003128;
    font-weight: bold;
    line-height: 1.6;
    background: #fff url(../img/cmn/img-arrow-green.svg) center right 24px / 15px auto no-repeat;
    box-shadow: 0 8px 22px rgba(0, 49, 40, .10);
    transition: .3s ease-in-out;
}

.what-is-faq-card a:hover{
    transform: translateY(-6px);
    box-shadow: 0 14px 30px rgba(0, 49, 40, .16);
}

.what-is-download{
    padding: 72px 0;
    background: #F7F7F7;
}

.what-is-download-box{
    max-width: 860px;
    margin: auto;
    padding: 48px 40px;
    border-radius: 5px;
    text-align: center;
    background: #fff;
    box-shadow: 0 8px 22px rgba(0, 49, 40, .10);
}

.what-is-download-box .c-ttl{
    margin-bottom: 18px;
    color: #003128;
}

.what-is-download-box p{
    margin-bottom: 28px;
    line-height: 1.9;
}

.what-is-download-box .c-btn{
    margin: auto;
}

/* succession */
.succession-card-list,
.succession-option-list{
    gap: 20px;
}

.succession-card,
.succession-option-card{
    padding: 28px 22px;
    border-radius: 5px;
    background: #fff;
    box-shadow: 0 8px 22px rgba(0, 49, 40, .10);
    transition: .3s ease-in-out;
}

.succession-card:hover,
.succession-option-card:hover{
    transform: translateY(-6px);
    box-shadow: 0 14px 30px rgba(0, 49, 40, .16);
}

.succession-card .c-ttl,
.succession-option-card .c-ttl{
    margin-bottom: 14px;
}

.succession-card p,
.succession-option-card dd{
    font-size: 15px;
    line-height: 1.85;
}

.succession-local-box{
    flex-shrink: 0;
    width: 360px;
    padding: 34px;
    border-radius: 5px;
    background: #fff;
    box-shadow: 0 8px 22px rgba(0, 49, 40, .10);
}

.succession-local-box .c-ttl{
    margin-bottom: 22px;
}

.succession-local-box li:not(:last-of-type){
    margin-bottom: 14px;
}

.succession-vertical-list{
    display: grid;
    gap: 18px;
}

.succession-vertical-card{
    padding: 28px;
    border-left: solid 5px #008129;
    border-radius: 5px;
    background: #F7F7F7;
    box-shadow: 0 8px 22px rgba(0, 49, 40, .08);
}

.succession-vertical-card .c-ttl{
    margin-bottom: 12px;
}

.succession-vertical-card p{
    margin-bottom: 18px;
}

.succession-option-card dl{
    line-height: 1.8;
}

.succession-option-card dt{
    display: inline-block;
    margin: 14px 0 6px;
    padding: 2px 10px;
    font-size: 13px;
    font-weight: bold;
    color: #fff;
    background: #008129;
}

.succession-option-card dt:first-of-type{
    margin-top: 0;
}

.succession-options .btn-block{
    height: auto;
    margin-top: 34px;
}

/* info */
.-info{
    padding: 66px 0 88px;
    background: #F7F7F7;
}

.tab-view .tab-list{
    gap: 9px;
    margin-top: 21px;
}

.tab-view .tab-list li{
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 366px;
    height: 45px;
    background: #008129;
    color: #fff;
    cursor: pointer;
    transition: .3s ease-in-out;
}

.tab-view .tab-list li:hover{
    background: #8CB808;
}

.tab-view .tab-list li.-active{
    background: #8CB808;
}

.tab-view .tab-list li.-active:before{
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: -15px;
    width: 0;
    height: 0;
    margin: auto;
    border-style: solid;
    border-width: 15px 8.5px 0 8.5px;
    border-color: #8CB808 transparent transparent transparent;
}

.tab-view .tab-cont-list{
    margin-top: 18px;
}

.tab-cont-list a{
    display: block;
    padding: 26px 21px;
    border-bottom: solid 1px #D8D8D8;
    background: url(../img/cmn/img-arrow-green.svg) center right 21px / 15px auto no-repeat;
    transition: .3s ease-in-out;
}

.tab-cont-list a:hover{
    background-color: #E4E4E4;
}

.tab-cont-list .head{
    display: flex;
    gap: 8px;
    margin-bottom: 13px;
}

/* how-to */
.-how-to{
    padding-bottom: 88px;
    background: #F7F7F7;
}

.-how-to .c-ttl{
    margin-bottom: 31px;
}

.how-to-list{
    gap: 14px;
}

.how-to-list li{
    display: flex;
    flex-direction: column;
    max-width: 362px;
    width: 100%;
}

.how-to-list li a{
    display: flex;
    flex-flow: column;
    height: 100%;
}

.how-to-list li p{
    display: flex;
    flex-grow: 1;
    align-items: center;
    justify-content: center;
    height: auto;
    padding: 16px 0;
    font-weight: bold;
    background: #fff;
}

/* stage */
.-stage{
    padding: 73px 0 95px;
    background: linear-gradient(0.25turn, #96b639 0%, #008129 100%);
}

.stage-list{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 17px;
    margin-top: 38px;
}

.stage-list li{
    background-color: #fff;
    border-radius: 5px;
    overflow: hidden;
}

.stage-list .row{
    gap: 17px;
    padding: 40px;
}

.stage-list .row .img{
    flex-shrink: 0;
}

.stage-list .text-field{
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.stage-list .text-field em{
    padding-left: 28px;
    background: url(../img/cmn/img-ic-arrow-green.svg) center left / 17px auto no-repeat;
}

/* staff */
.-staff{
    padding: 49px 0 89px;
    background: linear-gradient(180deg, #fff 0%, #fff 40%, #F7F7F7 40%, #F7F7F7 100%);
}

.-staff .staff-list{
    gap: 60px 32px;
    margin-top: 8px;
}

.-staff .staff-list > li{
    width: 350px;
    background: #fff;
}

.staff-list .body{
    padding: 29px;
}

.staff-list .sub-name{
    display: inline-block;
    margin-top: 26px;
}

.staff-list .c-ttl{
    font-weight: normal;
}

.staff-list .comment{
    padding: 13px 11px;
    background: #F7F7F7;
}

.staff-list .comment em{
    display: block;
}

.staff-list .license-list{
    margin-top: 18px;
}

/* flow */
.-flow{
    padding: 75px 0 82px;
}

.-flow .flow-list{
    gap: 39px 0;
    margin-top: 60px;
}

.-flow .flow-list li{
    position: relative;
    width: 255px;
}

.-flow .flow-list li .img{
    margin-bottom: 22px;
}

.-flow .arrow-tag{
    position: absolute;
    top: 0;
    left: 0;
    transform: translateY(-50%);
    width: 128px;
}

.-flow .c-ttl{
    display: flex;
    align-items: center;
    height: 79px;
}

.-flow .c-btn.-s{
    width: 100%;
    margin-top: 14px;
}

@media screen and (max-width:1251px) {
    /* top-hero */
    .top-hero-txt{
        font-size: 26px;
    }
    
    .top-hero-txt strong{
        font-size: 58px;
    }
    
    /* row-ttl */
    
    .row-ttl{
        font-size: 61px;
    }
}

@media screen and (max-width:1099px) {

    /* top-hero */
    .top-hero{
        min-width: auto;
        height: calc(100vh - 50px);
    }

    .top-hero-inner{
        justify-content: start;
        align-items: center;
        padding: 27px 5.8% 0;
    }

    .top-hero-inner ul{
        position: relative;
        display: block;
        width: 100%;
    }

    .top-hero-inner ul li{
        position: absolute;
        width: 23vw;
        top: 18vw;
    }

    .top-hero-inner ul li:first-of-type{
        top: 0;
        left: 0;
        right: 0;
        margin: auto;
    }

    .top-hero-inner ul li:nth-of-type(2){
        left: 14vw;
    }

    .top-hero-inner ul li:nth-of-type(3){
        right: 14vw;
    }

    .top-hero-inner .fig{
        position: absolute;
        right: 0;
        left: 0;
        bottom: 0;
        min-width: auto;
        width: 63.2%;
        max-width: 420px;
        margin: auto;
    }

    .top-hero-txt{
        padding-bottom: 12px;
        font-size: max(1.8vw, 18px);
        text-align: center;
    }

    .top-hero-txt strong{
        font-size: max(3.8vw, 38px);
    }

    /* search */
    .-search .top{
        padding-top: 31px;
        padding-bottom: 49px;
    }

    .-search .c-ttl{
        margin-bottom: 24px;
    }

    .-search .cont-list{
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 1fr 1fr;
        gap: 18px;
    }

    .-search .btm{
        padding: 27px 0 43px;
    }

    .-search .serv-list{
        gap: 0;
    }

    .-search .serv-list li{
        max-width: none;
        width: 100%;
        height: 65px;
    }

    .-search .serv-list li a{
        font-weight: 400;
    }

    .-search .serv-list li a:hover{
        background-color: #8CB808;
    }

    /* stage */
    .-stage{
        padding: 40px 0 60px;
    }

    .stage-list .row{
        padding: 21px;
    }

    .stage-list .row .img{
        flex-shrink: 0;
        width: 38%;
    }

    /* staff */
    .staff-list .body {
        padding: 16px;
    }
        
    /* flow */
    .-flow{
        padding: 27px 0 25px;
    }

    .-flow .flow-list{
        margin-top: 37px;
    }

    .-flow .flow-list li{
        position: relative;
        width: calc(50% - 19.5px);
    }

    .-flow .arrow-tag{
        position: absolute;
        top: 0;
        left: 0;
        transform: translateY(-50%);
        width: 128px;
    }

    .-flow .c-ttl{
        display: flex;
        align-items: center;
        height: auto;
    }

    .-flow .c-btn.-s{
        width: 100%;
        margin-top: 14px;
    }

}

@media screen and (max-width:767px) {
    /* top-hero */
    .top-hero{
        height: auto;
        min-height: calc(100vh - 50px);
    }

    .top-hero-inner ul li{
        position: relative;
        width: 39vw;
        top: 29vw;
    }

    .top-hero-inner ul li:nth-of-type(2){
        left: 0vw;
        top: -8vw;
    }

    .top-hero-inner ul li:nth-of-type(3){
        right: -48vw;
        top: -46vw;    
    }

    .top-hero-inner .fig{
        position: relative;
        width: 90vw;
        max-width: 420px;
        margin-top: -65vw;
    }

    .top-hero-txt{
        padding-bottom: 12px;
        font-size: max(1.8vw, 18px);
        text-align: center;
    }

    .top-hero-txt strong{
        font-size: max(3.8vw, 38px);
    }
    
    /* row-ttl */
    .row-ttl{
        font-size: 31px;
    }

    .row-ttl-ja{
        margin-left: 13px;
        font-size: 20px;
    }

    /* search */
    .-search .top{
        padding-top: 31px;
        padding-bottom: 49px;
    }

    .-search .c-ttl{
        margin-bottom: 24px;
    }

    .-search .cont-list{
        display: block;
    }

    .-search .cont-list .cont:not(:last-of-type){
        margin-bottom: 18px;
    }

    .-search .cont-list li{
        font-size: 15px;
    }

    .-search .cont .head{
        height: 70px;
        padding: 0 16px;
    }

    .-search .cont .list-box{
        height: calc(100% - 70px);
    }

    .-search .btm{
        padding: 8px 0 43px;
    }

    .-search .serv-list{
        gap: 0;
    }

    .-search .serv-list li{
        width: 100%;
    }

    .-search .serv-list li a{
        font-weight: 400;
    }

    /* choice */
    .-choice{
        padding: 36px 0 48px;
    }

    .-choice .head{
        display: block;
        margin-bottom: 24px;
    }

    .-choice .lead{
        margin-top: 14px;
        font-size: 15px;
    }

    .-choice .choice-list{
        display: block;
    }

    .-choice .choice-list li:not(:last-of-type){
        margin-bottom: 18px;
    }

    .-choice .choice-list li a{
        padding: 24px 20px;
    }

    /* faq */
    .-faq{
        padding: 36px 0 48px;
    }

    .-faq .head{
        margin-bottom: 24px;
    }

    .-faq .lead{
        margin-top: 14px;
        font-size: 15px;
    }

    .-faq-list{
        display: block;
    }

    .-faq-list li:not(:last-of-type){
        margin-bottom: 18px;
    }

    .-faq-card{
        padding: 24px 20px;
    }

    .-faq-q{
        font-size: 17px;
    }

    .-faq .c-btn{
        max-width: 254px;
        width: 100%;
        margin-top: 28px;
    }

    /* download */
    .download-sec{
        padding: 36px 0 48px;
    }

    .download-sec .head{
        margin-bottom: 24px;
    }

    .download-sec .head .bold{
        margin-bottom: 8px;
    }

    .download-sec .lead{
        margin-top: 14px;
        font-size: 15px;
    }

    .download-box{
        padding: 24px 20px;
    }

    .download-img{
        width: 100%;
        margin-bottom: 24px;
    }

    .download-body .c-ttl{
        margin-bottom: 18px;
    }

    .download-list{
        margin-bottom: 24px;
    }

    .download-body .c-btn{
        max-width: 254px;
        margin: auto;
    }

    /* consult-cta */
    .consult-cta{
        padding: 48px 0 56px;
    }

    .consult-cta-label{
        margin-bottom: 8px;
    }

    .consult-cta .lead{
        margin-top: 18px;
        font-size: 15px;
    }

    .consult-cta-btns{
        margin-top: 28px;
    }

    .consult-cta-btns .c-btn{
        max-width: 254px;
        width: 100%;
        margin: auto;
    }

    .consult-cta-btns .c-btn:not(:last-of-type){
        margin-bottom: 14px;
    }

    .consult-cta-note{
        margin-top: 18px;
        font-size: 13px;
    }

    /* article */
    .article-fv{
        padding: 46px 0 42px;
    }

    .article-meta{
        display: block;
        margin-bottom: 18px;
    }

    .article-meta time{
        display: block;
        margin-top: 10px;
    }

    .article-fv h1{
        font-size: 26px;
    }

    .article-fv .lead{
        margin-top: 20px;
        line-height: 1.9;
    }

    .article-summary,
    .article-section{
        padding: 42px 0;
    }

    .article-content > .c-ttl{
        margin-bottom: 22px;
        padding-bottom: 14px;
    }

    .article-content p{
        line-height: 1.9;
    }

    .article-card-list{
        display: block;
    }

    .article-card:not(:last-of-type){
        margin-bottom: 16px;
    }

    .article-card{
        padding: 22px 18px;
    }

    .article-table{
        margin-right: -5.8%;
        padding-right: 5.8%;
    }

    .article-check-list{
        padding: 22px 18px;
    }

    .article-cta{
        padding: 42px 0 50px;
    }

    .article-cta-box{
        padding: 36px 20px;
    }

    .article-cta .lead{
        margin-top: 18px;
        font-size: 15px;
    }

    .article-cta-btns{
        margin-top: 28px;
    }

    .article-cta-btns .c-btn{
        max-width: 254px;
        width: 100%;
        margin: auto;
    }

    .article-cta-btns .c-btn:not(:last-of-type){
        margin-bottom: 14px;
    }

    /* faq-common-cta */
    .faq-common-cta{
        padding: 42px 0 50px;
    }

    .faq-common-cta-head{
        margin-bottom: 26px;
        text-align: left;
    }

    .faq-common-cta-head .c-ttl{
        margin-bottom: 14px;
    }

    .faq-common-cta-list{
        display: block;
    }

    .faq-common-cta-card{
        padding: 24px 20px;
    }

    .faq-common-cta-card:not(:last-of-type){
        margin-bottom: 16px;
    }

    .faq-common-cta-card .c-btn{
        max-width: 254px;
        margin: auto;
    }

    .faq-common-cta-note{
        margin-top: 24px;
        text-align: left;
    }

    /* issues */
    .issues-card-list,
    .issues-related-list{
        display: block;
    }

    .issues-card:not(:last-of-type),
    .issues-related-card:not(:last-of-type){
        margin-bottom: 16px;
    }

    .issues-card a,
    .issues-related-card a{
        padding: 24px 20px;
    }

    .issues-choice .btn-block{
        display: block;
        margin-top: 26px;
    }

    .issues-choice .btn-block a{
        width: 100%;
    }

    /* option */
    .option-card-list{
        display: block;
    }

    .option-card:not(:last-of-type){
        margin-bottom: 16px;
    }

    .option-card{
        padding: 24px 20px;
    }

    /* faq-index */
    .faq-nav{
        position: static;
        overflow-x: auto;
        padding: 12px 0;
    }

    .faq-nav ul{
        width: max-content;
        padding-right: 5.8%;
    }

    .faq-nav a{
        padding: 9px 14px;
        font-size: 14px;
    }

    .faq-card-list{
        display: block;
    }

    .faq-card:not(:last-of-type){
        margin-bottom: 16px;
    }

    .faq-card a{
        padding: 24px 20px;
    }

    .faq-guide-btns{
        margin-top: 26px;
    }

    .faq-guide-btns .c-btn{
        max-width: 254px;
        width: 100%;
        margin: auto;
    }

    .faq-guide-btns .c-btn:not(:last-of-type){
        margin-bottom: 14px;
    }

    /* what-is */
    .what-is-fv{
        padding: 30px 0 44px;
    }

    .breadcrumb{
        margin-bottom: 24px;
    }

    .what-is-fv-row{
        display: block;
    }

    .what-is-fv h1{
        font-size: 28px;
    }

    .what-is-fv .lead{
        margin-top: 20px;
        line-height: 1.9;
    }

    .what-is-fv-img{
        width: 100%;
        margin-top: 28px;
    }

    .what-is-two-col{
        display: block;
    }

    .what-is-text .c-ttl{
        margin-bottom: 22px;
    }

    .what-is-diagram{
        width: 100%;
        margin-top: 28px;
        padding: 24px 20px;
    }

    .what-is-origin-list,
    .what-is-choice-list,
    .what-is-faq-list{
        display: block;
    }

    .what-is-origin-card,
    .what-is-choice-card,
    .what-is-faq-card:not(:last-of-type){
        margin-bottom: 16px;
    }

    .what-is-origin-card,
    .what-is-choice-card{
        padding: 24px 20px;
    }

    .what-is-download{
        padding: 42px 0;
    }

    .what-is-download-box{
        padding: 34px 20px;
    }

    .what-is-download-box .c-btn{
        max-width: 254px;
        width: 100%;
    }

    /* succession */
    .succession-card-list,
    .succession-option-list{
        display: block;
    }

    .succession-card,
    .succession-option-card{
        padding: 24px 20px;
    }

    .succession-card:not(:last-of-type),
    .succession-option-card:not(:last-of-type){
        margin-bottom: 16px;
    }

    .succession-local-box{
        width: 100%;
        margin-top: 28px;
        padding: 24px 20px;
    }

    .succession-vertical-card{
        padding: 24px 20px;
    }

    .succession-options .btn-block{
        display: block;
        margin-top: 26px;
    }

    .succession-options .btn-block a{
        width: 100%;
    }

    /* info */
    .-info{
        padding: 34px 0 19px;
    }

    .tab-view .tab-list{
        position: relative;
        min-height: 45px;
        gap: 0;
        margin: 15px auto 0;
    }

    .tab-view .tab-list li{
        position: absolute;
        top: 0;
        justify-content: start;
        padding: 0 14px;
        z-index: 0;
    }

    .tab-view .tab-list li.-active{
        z-index: 10;
    }

    .tab-view .tab-list li.-active:before{
        content: '';
        position: absolute;
        left: auto;
        right: 14px;
        bottom: auto;
        border-width: 8px 4.5px 0 4.5px;
        border-color: #fff transparent transparent transparent;
    }

    .tab-view .tab-cont-list{
        margin-top: 18px;
    }

    .tab-cont-list a{
        display: block;
        padding: 26px 21px;
        border-bottom: solid 1px #D8D8D8;
        background: url(../img/cmn/img-arrow-green.svg) center right 21px / 15px auto no-repeat;
        transition: .3s ease-in-out;
    }

    .tab-cont-list a:hover{
        background-color: #E4E4E4;
    }

    .tab-cont-list .head{
        display: flex;
        gap: 8px;
        margin-bottom: 13px;
    }

    .-info .c-btn{
        margin: 26px auto 0;
    }

    /* how-to */
    .-how-to{
        padding-bottom: 51px;
    }

    .-how-to .c-ttl{
        margin-bottom: 15px;
    }

    .how-to-list li:not(:last-of-type){
        margin-bottom: 17px;
    }

    .how-to-list li p{
        padding: 16px 5px;
    }

    /* stage */
    .stage-list{
        display: block;
        margin-top: 20px;
    }

    .stage-list li:not(:last-of-type){
        margin-bottom: 11px;
    }

    .stage-list .row{
        padding: 29px 14px 23px;
    }

    .stage-list .row .img{
        flex-shrink: 0;
        width: 84%;
        margin: 0 auto 19px;
    }

    .stage-list .c-ttl{
        margin-left: 12px;
    }

    /* staff */
    .-staff{
        padding: 32px 0 40px;
        background: linear-gradient(180deg, #fff 0%, #fff 166px, #F7F7F7 166px, #F7F7F7 100%);
    }

    .-staff .staff-list{
        margin-top: 17px;
    }

    .-staff .staff-list > li{
        width: 100%;
        padding: 0 22px;
        background: linear-gradient(180deg, transparent  0%, transparent  234px, #fff 234px, #fff 100%);
    }

    .-staff .staff-list > li:not(:last-of-type){
        margin-bottom: 52px;
    }

    .-staff .staff-list > li .img{
        margin: auto;
    }

    .staff-list .body{
        padding: 0 0 22px;
    }

    .staff-list .sub-name{
        margin-top: 20px;
    }

    .staff-list .c-ttl{
        font-weight: normal;
    }

    .staff-list .comment{
        margin-top: 15px;
        padding: 13px 11px;
    }

    .staff-list .license-list{
        margin-top: 18px;
    }

    /* flow */
    .-flow{
        padding: 27px 0 25px;
    }

    .-flow > .inner > .c-ttl{
        text-align: center;
    }

    .-flow .flow-list{
        margin-top: 44px;
    }

    .-flow .flow-list li{
        position: relative;
        width: 100%;
    }

    .-flow .flow-list li:not(:last-of-type){
        margin-bottom: 44px;
    }

    .-flow .flow-list li .img{
        margin-bottom: 0;
    }

    .-flow .c-ttl{
        height: auto;
        padding: 10px 0;
    }

    .-flow .c-btn.-s{
        max-width: 254px;
        width: 100%;
        margin: 10px auto 0;
    }

}