@charset "UTF-8";

/*````````````````````````````````````````*/
@media only screen and (min-width: 769px) {
    /*````````````````````````````````````````*/

    /*================*/
    .pc {
        display: block;
    }

    .sp {
        display: none;
    }

    section.visual {}

    section.visual>.inner {
        width: 100%;
    }

    /*----*/
    section.visual .ground {
        position: relative;
        width: 100%;
        height: 100%;
    }

    section.visual .ground .box-fig {
        position: relative;
        width: 94%;
        max-width: 1920px;
        max-height: 1100px;
        overflow: hidden;
        padding: 2.7vw 0;
        margin: auto;
    }

    section.visual .ground .box-fig h2 {
        height: 0;
    }

    section.visual .ground .box-fig h2 span {
        font-size: 0;
    }

    section.visual .ground .box-fig img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 1.5vw;
    }

    /*スクロールダウン全体の場所*/
    section.visual .ground .box-fig .scrolldown2 {
        /*描画位置※位置は適宜調整してください*/
        position: absolute;
        bottom: 20px;
        left: 50%;
    }

    section.visual .ground .box-fig .scrolldown2 .anm-scrolldown-01 {
        content: "";
        position: absolute;
        bottom: 0;
        left: -3px;
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background: var(--color-01);
    }

    /* 線の描写 */
    section.visual .ground .box-fig .scrolldown2:after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        width: 1px;
        height: 100px;
        background: var(--color-01);
    }

    /*----*/
    section.visual .box-fig .mission {
        width: 90vw;
        position: absolute;
        bottom: -90px;
        left: 6%;
    }

    section.visual .box-fig .mission .area-note {
        max-width: 385px;
        max-height: 90px;
        background-image: url(/top/img/copy_pc.png);
        background-size: contain;
        position: absolute;
        bottom: 20vw;
        left: 5vw;
    }

    section.visual .box-fig .mission .area-note .note {
        width: 500px;
        padding: 280px 0 0 0;
    }

    /*----*/
    section.visual .box-fig .mission .area-link {
        padding: 0 0 140px 0;
        opacity: 0;
        -webkit-transition-property: top, opacity;
        transition-property: top, opacity;
        -webkit-transition-duration: 0.4s;
        transition-duration: 0.4s;
        -webkit-transition-timing-function: linear;
        transition-timing-function: linear;
    }

    section.visual .box-fig .mission .area-link .border-button {
        border-bottom: 4px solid var(--color-01);
        border-right: 4px solid var(--color-01);
    }

    section.visual .box-fig .mission .area-link .border-button:hover {
        border-bottom: 0;
        border-right: 0;
    }

    section.visual .box-fig .mission .area-link .border-button.bb-type1 p span {
        letter-spacing: 0.1em;
    }

    section.visual .box-fig .mission .area-link .border-button.bb-type1 p span::after {
        content: '';
        position: absolute;
        top: 5px;
        right: -20px;
        display: block;
        width: 16px;
        height: 16px;
        background: url(/common/img/ico_pdf_red.png) no-repeat center;
        background-size: contain;
    }

    section.visual .box-fig .mission .area-link .border-button p i {
        width: 50px;
        aspect-ratio: 50 / 20;
    }

    section.visual .box-fig .mission .area-link .border-button.bb-type1 {
        max-width: 300px;
        width: 30%;
        box-sizing: initial;
    }

    section.visual .box-fig .mission .area-link.appear {
        opacity: 1;
    }

    /*----*/

    /*================*/
    section.topics {}

    section.topics>.inner {
        width: 100%;
    }

    /*----*/
    section.topics .area-ttl {
        padding: 85px 0 0 0;
        width: 1000px;
        margin: 0 auto 0 auto;
    }

    section.topics .area-ttl h2 {
        text-indent: 8px;
    }

    section.topics .area-ttl h2 span {
        background-image: url(/top/img/char_title_topics.svg);
    }

    /*----*/
    section.topics .area-list {
        padding: 0 0 35px 0;
    }

    section.topics .area-list .item-indicator {
        padding: 0 0 25px 0;
        width: 1080px;
        margin: 0 auto 0 auto;
    }

    section.topics .area-appeal .itemlist {
        width: 100%;
        overflow: hidden;
    }

    section.topics .area-list .itemlist .outer {
        position: relative;
        font-size: 0;
        letter-spacing: 0;
        white-space: nowrap;
        margin: 0 0 0 calc(50% - 500px);
    }

    section.topics .area-list .itemlist .each {
        display: inline-block;
        vertical-align: top;
        width: 360px;
        padding: 0 40px 0 0;
        white-space: normal;
        text-indent: 0;
    }

    section.topics .area-list .itemlist .each a {
        color: rgba(0, 0, 0, 1);
    }

    section.topics .area-list .itemlist .each .skin {
        width: 100%;
        height: 100%;
    }

    section.topics .area-list .itemlist .each .photo {
        width: 100%;
        aspect-ratio: 600 / 376;
        border-radius: 20px;
        overflow: hidden;
        background-color: rgba(40, 40, 40, 1);
    }

    section.topics .area-list .itemlist .each .photo figure {
        background-position: 50% 50%;
        background-size: contain;
        transition-property: transform;
        transition-duration: 0.2s;
        transition-timing-function: linear;
        transform-origin: 50% 50%;
        transform: scale(1, 1);
    }

    section.topics .area-list .itemlist .each a:hover .photo figure {
        -webkit-transform: scale(1.04, 1.04);
        transform: scale(1.04, 1.04);
    }

    section.topics .area-list .itemlist .each .date {
        padding: 20px 0 15px 0;
    }

    section.topics .area-list .itemlist .each .date p {
        font-size: 14px;
        font-weight: 700;
        color: var(--color-01);
    }

    section.topics .area-list .itemlist .each .mytitle {}

    section.topics .area-list .itemlist .each .mytitle .txt {
        line-height: 2.0;
        font-size: 14px;
        font-weight: 700;
    }

    section.topics .area-list .itemlist .each .mytitle .txt span {}

    section.topics .area-list .itemlist .each a:hover .mytitle .txt span {
        text-decoration: underline;
    }

    section.topics .area-list .itemlist .each .mytitle .txt i {
        display: none;
        vertical-align: bottom;
        width: 30px;
        aspect-ratio: 1/1;
        background-repeat: no-repeat;
        background-position: 0 0;
        background-size: 100% auto;
        margin: 0 0 0 5px;
    }

    section.topics .area-list .itemlist .each .mytitle .txt i.external {
        background-image: url(/common/img/ico_externallink_01.svg);
    }

    section.topics .area-list .itemlist .each .mytitle .txt i.pdf {
        background-image: url(/common/img/ico_pdflink_01.svg);
    }

    section.topics .area-list .itemlist .each[data-topictype="2"] .mytitle .txt i.external {
        display: inline-block;
    }

    section.topics .area-list .itemlist .each[data-topictype="3"] .mytitle .txt i.pdf {
        display: inline-block;
    }

    /*----*/
    section.topics .area-jump {
        width: 1000px;
        margin: 0 auto 0 auto;
    }

    /*----*/
    /* section.topics.empty {
    display: none;
} */
    section.topics.only {}

    section.topics.only .area-list .item-indicator {
        visibility: hidden;
    }

    section.topics.normal {}

    /*================*/
    section.business {}

    section.business>.inner {
        width: 100%;
    }

    /*----*/
    section.business .area-ttl-main {
        padding: 88px 0 34px 0;
        width: 1000px;
        margin: 0 auto 0 auto;
    }

    section.business .area-ttl-main h2 {
        text-indent: 4px;
    }

    section.business .area-ttl-main h2 span {
        background-image: url(/top/img/char_title_ourbusiness.svg);
    }

    /*----*/
    section.business .area-capt {
        padding: 0 0 22px 0;
        width: 1000px;
        margin: 0 auto 0 auto;
    }

    section.business .area-capt p {
        line-height: 1.55;
        font-size: 38px;
        font-weight: 300;
        letter-spacing: 0.11em;
    }

    /*----*/
    section.business .area-note {
        padding: 0 520px 26px 0;
        width: 1000px;
        margin: 0 auto 0 auto;
    }

    section.business .area-note p {
        line-height: 2.2;
        font-size: 16px;
        font-weight: 400;
        letter-spacing: 0.1em;
    }

    /*----*/
    section.business .area-fig {
        position: absolute;
        left: 50%;
        top: 0;
        width: 1000px;
        height: 0;
        margin: 0 0 0 calc(1000px / -2);
    }

    section.business .area-fig .each {
        position: absolute;
        left: 614px;
        top: 62px;
        width: 414px;
        aspect-ratio: 822/882;
    }

    section.business .area-fig .each figure {
        background-image: url(/top/img/grph_business.png);
    }

    /*----*/
    section.business .area-link {
        padding: 0 0 100px 0;
        width: 1000px;
        margin: 0 auto 0 auto;
    }

    /*----*/
    section.business .area-sector {}

    section.business .area-sector .lineup {
        position: relative;
    }

    section.business .area-sector .item-indicator {
        padding: 20px 100px 20px 0;
        width: 1000px;
        margin: 0 auto 0 auto;
    }

    section.business .area-sector .itemlist {
        width: 100%;
        overflow: hidden;
    }

    section.business .area-sector .itemlist .outer {
        position: relative;
        font-size: 0;
        letter-spacing: 0;
        white-space: nowrap;
        margin: 0 0 0 calc(50% - 500px);
    }

    section.business .area-sector .itemlist .each {
        display: inline-block;
        vertical-align: top;
        width: 940px;
        padding: 0 40px 0 0;
        white-space: normal;
        text-indent: 0;
    }

    section.business .area-sector .itemlist .each a {
        color: rgba(0, 0, 0, 1);
    }

    section.business .area-sector .itemlist .each .base {
        width: 100%;
        height: 100%;
        padding: 46px 46px 46px 46px;
        background-color: var(--color-02);
        border-radius: 20px;
    }

    section.business .area-sector .itemlist .each .skin {
        position: relative;
    }

    section.business .area-sector .itemlist .each .box-fig {
        position: absolute;
        right: 0;
        top: 0;
        width: 346px;
        aspect-ratio: 676/522;
        border-radius: 20px;
        overflow: hidden;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
    }

    section.business .area-sector .itemlist .each .box-fig figure {
        -webkit-transition-property: transform;
        transition-property: transform;
        -webkit-transition-duration: 0.2s;
        transition-duration: 0.2s;
        -webkit-transition-timing-function: linear;
        transition-timing-function: linear;
        -webkit-transform-origin: 50% 50%;
        transform-origin: 50% 50%;
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);
    }

    section.business .area-sector .itemlist .each a:hover .box-fig figure {
        -webkit-transform: scale(1.04, 1.04);
        transform: scale(1.04, 1.04);
    }

    section.business .area-sector .itemlist .each .box-ttl {
        width: 420px;
        height: 62px;
    }

    section.business .area-sector .itemlist .each .box-ttl p {
        line-height: 1.2;
        font-size: 34px;
        font-weight: 500;
        letter-spacing: 0.2em;
        color: var(--color-01);
        white-space: nowrap;
    }

    section.business .area-sector .itemlist .each[data-idx="2"] .box-ttl p {
        letter-spacing: 0.01em;
    }

    section.business .area-sector .itemlist .each .box-capt {
        width: 420px;
        height: 88px;
    }

    section.business .area-sector .itemlist .each .box-capt p {
        line-height: 1.65;
        font-size: 23px;
        font-weight: 300;
        letter-spacing: 0.15em;
        white-space: nowrap;
    }

    section.business .area-sector .itemlist .each .box-note {
        width: 420px;
        height: 114px;
    }

    section.business .area-sector .itemlist .each .box-note p {
        line-height: 2.0;
        font-size: 14px;
        font-weight: 400;
        letter-spacing: 0.1em;
    }

    /*----*/
    section.business .area-ttl-sub {
        padding: 56px 0 0 0;
        width: 1000px;
        margin: 0 auto 0 auto;
    }

    section.business .area-ttl-sub h2 {
        text-indent: 2px;
    }

    section.business .area-ttl-sub h2 span {
        background-image: url(/top/img/char_title_ourproject.svg);
    }

    /*----*/
    section.business .area-project {
        position: relative;
        padding: 0 0 90px 0;
    }

    section.business .area-project .item-indicator {
        width: 1000px;
        padding: 0 30px 20px 0;
        margin: -56px auto 0 auto;
    }

    section.business .area-project .itemlist {
        width: 100%;
        overflow: hidden;
    }

    section.business .area-project .itemlist .outer {
        position: relative;
        font-size: 0;
        letter-spacing: 0;
        white-space: nowrap;
        margin: 0 0 0 calc(50% - 500px);
    }

    section.business .area-project .itemlist .each {
        display: inline-block;
        vertical-align: top;
        width: 494px;
        height: 232px;
        padding: 0 20px 0 0;
        white-space: normal;
        text-indent: 0;
    }

    section.business .area-project .itemlist .each a {
        color: rgba(0, 0, 0, 1);
    }

    section.business .area-project .itemlist .each .base {
        width: 100%;
        height: 100%;
        background-color: var(--color-02);
        border-radius: 20px;
        overflow: hidden;
    }

    section.business .area-project .itemlist .each .skin {
        position: relative;
        width: 100%;
        height: 100%;
    }

    section.business .area-project .itemlist .each .box-fig {
        position: absolute;
        right: 0;
        top: 0;
        height: 100%;
        aspect-ratio: 388/460;
    }

    section.business .area-project .itemlist .each .box-fig figure {
        -webkit-transition-property: transform;
        transition-property: transform;
        -webkit-transition-duration: 0.2s;
        transition-duration: 0.2s;
        -webkit-transition-timing-function: linear;
        transition-timing-function: linear;
        -webkit-transform-origin: 50% 50%;
        transform-origin: 50% 50%;
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);
    }

    section.business .area-project .itemlist .each a:hover .box-fig figure {
        -webkit-transform: scale(1.04, 1.04);
        transform: scale(1.04, 1.04);
    }

    section.business .area-project .itemlist .each .box-logo {
        height: 110px;
        padding: 15px 0 0 20px;
    }

    section.business .area-project .itemlist .each .box-logo p {
        display: inline-block;
        vertical-align: top;
        position: relative;
        width: 184px;
        aspect-ratio: 330/174;
    }

    section.business .area-project .itemlist .each .box-logo p .mrk {
        position: absolute;
        right: -50px;
        bottom: 10px;
        width: 28px;
        height: 28px;
    }

    section.business .area-project .itemlist .each .box-logo p .mrk>b {
        background-image: url(/common/img/ico_externallink_01.svg);
    }

    section.business .area-project .itemlist .each .box-logo p span {}

    section.business .area-project .itemlist .each .box-note {
        padding: 8px 218px 0 32px;
    }
	section.business .area-project .itemlist .each#uhuhu_huna .box-note.overtxt{
		padding-right: 210px;
		padding-left: 22px;
	}
    section.business .area-project .itemlist .each .box-note p {
        line-height: 2.2;
        font-size: 13px;
        font-weight: 500;
        letter-spacing: 0.18em;
    }
    section.business .area-project .itemlist .each#uhuhu_huna .box-note.overtxt p {
        letter-spacing: 0.05em;
    }
	section.business .area-project .itemlist .each#uhuhu_huna .box-note.overtxt .txt_lay{
		display: inline-block;
		letter-spacing: 0;
		text-indent: -0.5em;
	}	
    /*================*/
    section.activity {}

    section.activity>.inner {}

    /*----*/
    section.activity .area-ttl {
        padding: 80px 0 45px 0;
    }

    section.activity .area-ttl h2 {
        text-indent: 7px;
    }

    section.activity .area-ttl h2 span {
        background-image: url(/top/img/char_title_note.svg);
    }

    /*----*/
    section.activity .area-capt {
        padding: 0 0 40px 0;
    }

    section.activity .area-capt p {
        line-height: 1.55;
        font-size: 38px;
        font-weight: 300;
        letter-spacing: 0.11em;
    }

    /*----*/
    section.activity .area-jump {
        display: flex;
        justify-content: center;
        flex-wrap: nowrap;
        align-items: stretch;
        gap: 0 60px;
        padding: 0 0 100px 0;
    }

    section.activity .area-jump .each {}

    section.activity .area-jump .each dl {
        width: 320px;
    }

    section.activity .area-jump .each dl>dt {
        padding: 0 0 10px 0;
        text-align: center;
    }

    section.activity .area-jump .each dl>dt p {
        line-height: 1.0;
        font-size: 16px;
        font-weight: 700;
        letter-spacing: 0.1em;
        white-space: nowrap;
        color: var(--color-01);
    }

    section.activity .area-jump .each dl>dd {}

    section.activity .area-jump .each dl>dd .framing {
        position: relative;
        width: 100%;
        aspect-ratio: 640/280;
        overflow: hidden;
        background-color: rgba(255, 255, 255, 1);
    }

    section.activity .area-jump .each dl>dd .framing a {}

    section.activity .area-jump .each dl>dd .framing figure {
        opacity: 1;
        -webkit-transition-property: transform;
        transition-property: transform;
        -webkit-transition-duration: 0.2s;
        transition-duration: 0.2s;
        -webkit-transition-timing-function: linear;
        transition-timing-function: linear;
        -webkit-transform-origin: 50% 50%;
        transform-origin: 50% 50%;
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);
    }

    section.activity .area-jump .each.n1 dl>dd .framing figure {
        background-image: url(/top/img/bnr_kuramachilab.png);
    }

    section.activity .area-jump .each.n2 dl>dd .framing figure {
        background-image: url(/top/img/bnr_recruitinfo.png);
    }

    section.activity .area-jump .each dl>dd .framing a:hover figure {
        opacity: 0.6;
        -webkit-transform: scale(1.04, 1.04);
        transform: scale(1.04, 1.04);
    }

    section.activity .area-jump .each dl>dd .framing .hem {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        border-style: solid;
        border-width: 6px;
        border-color: var(--color-01);
    }

    /*================*/
    section.recruit {}

    section.recruit>.inner {}

    /*----*/
    section.recruit .area-ttl {
        padding: 90px 0 60px 0;
    }

    section.recruit .area-ttl h2 {
        text-indent: 7px;
    }

    section.recruit .area-ttl h2 span {
        background-image: url(/top/img/char_title_recruit.svg);
    }

    /*----*/
    section.recruit .area-capt {
        padding: 0 0 15px 0;
    }

    section.recruit .area-capt p {
        line-height: 1.55;
        font-size: 38px;
        font-weight: 300;
        letter-spacing: 0.11em;
    }

    /*----*/
    section.recruit .area-note {
        width: 480px;
        padding: 0 0 20px 0;
    }

    section.recruit .area-note p {
        line-height: 2.2;
        font-size: 16px;
        font-weight: 400;
        letter-spacing: 0.1em;
    }

    /*----*/
    section.recruit .area-link {
        padding: 0 0 125px 0;
    }

    section.recruit .area-link .box-call {
        padding: 0 0 15px 0;
    }

    section.recruit .area-link .box-call p {
        font-size: 13px;
        letter-spacing: 0.1em;
    }

    /*----*/
    section.recruit .area-pic {
        position: absolute;
        left: 540px;
        top: 180px;
        width: 0;
        height: 0;
    }

    section.recruit .area-pic .each {
        position: absolute;
        opacity: 0;
        -webkit-transition-property: opacity;
        transition-property: opacity;
        -webkit-transition-duration: 0.7s;
        transition-duration: 0.7s;
        -webkit-transition-timing-function: linear;
        transition-timing-function: linear;
    }

    section.recruit .area-pic .each.appear {
        opacity: 1;
    }

    section.recruit .area-pic .each.n1 {
        left: 0;
        top: 28px;
        width: 294px;
        aspect-ratio: 645/639;
    }

    section.recruit .area-pic .each.n2 {
        left: 214px;
        top: -90px;
        width: 200px;
        aspect-ratio: 384/394
    }

    section.recruit .area-pic .each figure {
        border-radius: 20px;
    }

    section.recruit .area-pic .each.n1 figure {
        background-image: url(/top/img/pic_recruit_01.png);
    }

    section.recruit .area-pic .each.n2 figure {
        background-image: url(/top/img/pic_recruit_02.png);
    }

    /*````````````````````````````````````````*/
}

@media only screen and (max-width: 768px) {
    /*````````````````````````````````````````*/

    /*================*/
    .pc {
        display: none;
    }

    .sp {
        display: block;
    }

    section.visual {}

    section.visual>.inner {
        width: 100%;
    }

    /*----*/
    section.visual .ground {
        position: relative;
        width: 100%;
        height: 100%;
    }

    section.visual .ground .box-fig {
        position: relative;
        width: 90vw;
        height: auto;
        margin: 4.7vw auto;
    }

    section.visual .ground .box-fig h2 {
        height: 0;
    }

    section.visual .ground .box-fig h2 span {
        font-size: 0;
    }

    section.visual .ground .box-fig img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 3vw;
    }

    /*----*/
    section.visual .box-fig .mission {
        position: absolute;
        width: 90vw;
        bottom: -6vw;
        left: -7vw;
    }

    section.visual .mission .area-note {
        padding: 0 0 11vw 6vw;
    }

    section.visual .mission .area-note .note {
        width: 77vw;
        padding: 65vw 0 0 0;
    }

    section.visual .mission .area-note .note .belt {
        display: inline-block;
        vertical-align: top;
        position: relative;
        margin: 3.3vw 0 0 0;
        -webkit-transition-property: transform;
        transition-property: transform;
        -webkit-transition-duration: 0.3s;
        transition-duration: 0.3s;
        -webkit-transition-timing-function: ease-in;
        transition-timing-function: ease-in;
        -webkit-transform-origin: 0 50%;
        transform-origin: 0 50%;
        -webkit-transform: scale(0, 1);
        transform: scale(0, 1);
    }

    section.visual .mission .area-note .note .belt:nth-of-type(1) {
        margin: 0 0 0 0;
    }

    section.visual .mission .area-note .note .belt.act1 {
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);
    }

    section.visual .mission .area-note .note .belt p {
        position: relative;
        padding: 0 0 1vw 4vw;
        color: rgba(255, 255, 255, 1);
        background-color: rgba(51, 51, 51, 1);
    }

    section.visual .mission .area-note .note .belt p span {
        line-height: 1.7;
        font-size: 6.3vw;
        font-weight: 200;
        letter-spacing: 0.15em;
        white-space: nowrap;
    }

    section.visual .mission .area-note .note .belt p i {
        position: absolute;
        right: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(51, 51, 51, 1);
        -webkit-transition-property: width;
        transition-property: width;
        -webkit-transition-duration: 0.3s;
        transition-duration: 0.3s;
        -webkit-transition-timing-function: ease-in;
        transition-timing-function: ease-in;
    }

    section.visual .mission .area-note .note .belt.act2 p i {
        width: 0;
    }

    /*----*/
    section.visual .mission .area-link {
        padding: 0 0 7vw 7vw;
        opacity: 0;
        -webkit-transition-property: top, opacity;
        transition-property: top, opacity;
        -webkit-transition-duration: 0.4s;
        transition-duration: 0.4s;
        -webkit-transition-timing-function: linear;
        transition-timing-function: linear;
    }

    section.visual .mission .area-link.appear {
        opacity: 1;
    }

    section.visual .mission .area-link .border-button.bb-type1 {
        width: 64vw;
        border-bottom: 4px solid var(--color-01);
        border-right: 4px solid var(--color-01);
    }

    section.visual .mission .area-link .border-button.bb-type1 p span {
        font-size: 4.3vw;
        letter-spacing: 0.05em;
    }

    section.visual .mission .area-link .border-button.bb-type1 p span::after {
        content: '';
        position: absolute;
        top: 1.2vw;
        right: -5.5vw;
        display: block;
        width: 4.3vw;
        height: 4.3vw;
        background: url(/common/img/ico_pdf_red.png) no-repeat center;
        background-size: contain;
    }

    section.visual .mission .area-link .border-button.bb-type1 p {
        padding: 2vw;
    }

    section.visual .mission .area-link .border-button p i {
        width: 9vw;
    }

    /*----*/
    section.visual .edge {
        position: absolute;
        left: 0;
        bottom: 0;
        width: 100%;
        height: 14vw;
    }

    section.visual .edge .box-mark {
        position: relative;
        width: 20vw;
        height: 100%;
        padding: 2vw 0 0 0;
        text-align: center;
        margin: 0 auto 0 auto;
        opacity: 0;
        -webkit-transition-property: top, opacity;
        transition-property: top, opacity;
        -webkit-transition-duration: 0.4s;
        transition-duration: 0.4s;
        -webkit-transition-timing-function: linear;
        transition-timing-function: linear;
    }

    section.visual .edge .box-mark.appear {
        opacity: 1;
    }

    section.visual .edge .box-mark p {
        font-size: 3.2vw;
        font-weight: 700;
        letter-spacing: 0.25em;
    }

    section.visual .edge .box-mark span {
        position: absolute;
        left: 6.5vw;
        top: 8vw;
        width: 7vw;
        height: 3.5vw;
    }

    section.visual .edge .box-mark span i {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
    }

    section.visual .edge .box-mark span i>svg {
        stroke: rgba(0, 0, 0, 1);
        stroke-width: 0.25;
    }

    /*================*/
    section.topics {}

    section.topics>.inner {
        width: 100%;
    }

    /*----*/
    section.topics .area-ttl {
        width: 90vw;
        padding: 14vw 0 5vw 0;
        margin: 0 auto 0 auto;
    }

    section.topics .area-ttl h2 {
        text-indent: 1vw;
    }

    section.topics .area-ttl h2 span {
        background-image: url(/top/img/char_title_topics.svg);
    }

    /*----*/
    section.topics .area-list {}

    section.topics .area-list .item-indicator {
        padding: 0 0 6vw 0;
        width: 42vw;
        margin: 0 0 0 auto;
    }

    section.topics .area-list .itemlist {
        width: 95vw;
        margin: 0 0 0 auto;
        overflow: hidden;
        padding: 0 0 10vw 0;
    }

    section.topics .area-list .itemlist .outer {
        position: relative;
        font-size: 0;
        letter-spacing: 0;
        white-space: nowrap;
    }

    section.topics .area-list .itemlist .each {
        display: inline-block;
        vertical-align: top;
        width: 58vw;
        padding: 0 4vw 0 0;
        white-space: normal;
        text-indent: 0;
    }

    section.topics .area-list .itemlist .each a {
        color: rgba(0, 0, 0, 1);
    }

    section.topics .area-list .itemlist .each .skin {
        width: 100%;
        height: 100%;
    }

    section.topics .area-list .itemlist .each .photo {
        width: 100%;
        aspect-ratio: 600 / 376;
        border-radius: 3vw;
        overflow: hidden;
        background-color: rgba(40, 40, 40, 1);
    }

    section.topics .area-list .itemlist .each .photo figure {
        background-position: 50% 50%;
        background-size: contain;
    }

    section.topics .area-list .itemlist .each .date {
        padding: 5vw 0 2vw 0;
    }

    section.topics .area-list .itemlist .each .date p {
        font-size: 4vw;
        font-weight: 700;
        color: var(--color-01);
    }

    section.topics .area-list .itemlist .each .mytitle {}

    section.topics .area-list .itemlist .each .mytitle .txt {
        line-height: 2.0;
        font-size: 4vw;
        font-weight: 700;
    }

    section.topics .area-list .itemlist .each .mytitle .txt span {}

    section.topics .area-list .itemlist .each .mytitle .txt i {
        display: none;
        vertical-align: bottom;
        width: 7vw;
        aspect-ratio: 1/1;
        background-repeat: no-repeat;
        background-position: 0 0;
        background-size: 100% auto;
        margin: 0 0 0 2vw;
    }

    section.topics .area-list .itemlist .each .mytitle .txt i.external {
        background-image: url(/common/img/ico_externallink_01.svg);
    }

    section.topics .area-list .itemlist .each .mytitle .txt i.pdf {
        background-image: url(/common/img/ico_pdflink_01.svg);
    }

    section.topics .area-list .itemlist .each[data-topictype="2"] .mytitle .txt i.external {
        display: inline-block;
    }

    section.topics .area-list .itemlist .each[data-topictype="3"] .mytitle .txt i.pdf {
        display: inline-block;
    }

    /*----*/
    section.topics .area-jump {
        width: 90vw;
        padding: 0 0 6vw 0;
        margin: 0 auto 0 auto;
    }

    /*================*/
    section.business {}

    section.business>.inner {
        width: 100%;
    }

    /*----*/
    section.business .area-ttl-main {
        padding: 12.5vw 0 10vw 0;
        width: 90vw;
        margin: 0 auto 0 auto;
    }

    section.business .area-ttl-main h2 {
        text-indent: 1vw;
    }

    section.business .area-ttl-main h2 span {
        background-image: url(/top/img/char_title_ourbusiness.svg);
    }

    /*----*/
    section.business .area-capt {
        padding: 0 0 5vw 0;
        width: 90vw;
        margin: 0 auto 0 auto;
    }

    section.business .area-capt p {
        line-height: 1.65;
        font-size: 6.0vw;
        font-weight: 300;
        letter-spacing: 0.11em;
    }

    /*----*/
    section.business .area-note {
        padding: 0 0 5vw 0;
        width: 90vw;
        margin: 0 auto 0 auto;
    }

    section.business .area-note p {
        line-height: 2.4;
        font-size: 3.6vw;
        font-weight: 400;
        letter-spacing: 0.09em;
    }

    /*----*/
    section.business .area-fig {
        padding: 0 0 17vw 0;
        width: 90vw;
        margin: 0 auto 0 auto;
    }

    section.business .area-fig .each {
        width: 77vw;
        aspect-ratio: 822/882;
        margin: 0 auto 0 auto;
    }

    section.business .area-fig .each figure {
        background-image: url(/top/img/grph_business.png);
    }

    /*----*/
    section.business .area-link {
        padding: 0 0 12vw 0;
        width: 90vw;
        margin: 0 auto 0 auto;
    }

    /*----*/
    section.business .area-sector {}

    section.business .area-sector .lineup {
        position: relative;
        padding: 0 0 0 0;
    }

    section.business .area-sector .item-indicator {
        padding: 0 0 6vw 0;
        width: 42vw;
        margin: 0 0 0 auto;
    }

    section.business .area-sector .itemlist {
        width: 95vw;
        margin: 0 0 0 auto;
        overflow: hidden;
    }

    section.business .area-sector .itemlist .outer {
        position: relative;
        font-size: 0;
        letter-spacing: 0;
        white-space: nowrap;
    }

    section.business .area-sector .itemlist .each {
        display: inline-block;
        vertical-align: top;
        width: 81vw;
        padding: 0 4vw 0 0;
        white-space: normal;
        text-indent: 0;
    }

    section.business .area-sector .itemlist .each a {
        color: rgba(0, 0, 0, 1);
    }

    section.business .area-sector .itemlist .each .base {
        width: 100%;
        height: 100%;
        padding: 6vw 6vw 6vw 6vw;
        background-color: var(--color-02);
        border-radius: 3vw;
    }

    section.business .area-sector .itemlist .each .skin {
        position: relative;
    }

    section.business .area-sector .itemlist .each .box-fig {
        width: 100%;
        aspect-ratio: 676/522;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
    }

    section.business .area-sector .itemlist .each .box-fig figure {
        border-radius: 3vw;
        background-size: cover;
        background-position: 50% 50%;
    }

    section.business .area-sector .itemlist .each .box-ttl {
        padding: 4vw 0 2vw 0;
    }

    section.business .area-sector .itemlist .each .box-ttl p {
        line-height: 1.2;
        font-size: 5.4vw;
        font-weight: 500;
        letter-spacing: 0.2em;
        color: var(--color-01);
        white-space: nowrap;
    }

    section.business .area-sector .itemlist .each[data-idx="2"] .box-ttl p {
        letter-spacing: -0.02em;
    }

    section.business .area-sector .itemlist .each .box-capt {
        padding: 0 0 2vw 0;
    }

    section.business .area-sector .itemlist .each .box-capt p {
        line-height: 1.4;
        font-size: 3.7vw;
        font-weight: 300;
        letter-spacing: 0.16em;
        white-space: nowrap;
    }

    section.business .area-sector .itemlist .each .box-note {
        height: 31vw;
    }

    section.business .area-sector .itemlist .each .box-note p {
        line-height: 1.5;
        font-size: 3.2vw;
        font-weight: 400;
        letter-spacing: 0.1em;
    }

    /*----*/
    section.business .area-ttl-sub {
        padding: 14vw 0 0 0;
        width: 90vw;
        margin: 0 auto 0 auto;
    }

    section.business .area-ttl-sub h2 {
        text-indent: 0;
    }

    section.business .area-ttl-sub h2 span {
        background-image: url(/top/img/char_title_ourproject.svg);
    }

    /*----*/
    section.business .area-project {
        position: relative;
        padding: 0 0 15vw 0;
    }

    section.business .area-project .item-indicator {
        width: 42vw;
        padding: 0 0 6vw 0;
        margin: -9vw 0 0 auto;
    }

    section.business .area-project .itemlist {
        width: 95vw;
        margin: 0 0 0 auto;
        overflow: hidden;
    }

    section.business .area-project .itemlist .outer {
        position: relative;
        font-size: 0;
        letter-spacing: 0;
        white-space: nowrap;
    }

    section.business .area-project .itemlist .each {
        display: inline-block;
        vertical-align: top;
        width: 58vw;
        padding: 0 4vw 0 0;
        white-space: normal;
        text-indent: 0;
    }

    section.business .area-project .itemlist .each a {
        color: rgba(0, 0, 0, 1);
    }

    section.business .area-project .itemlist .each .base {
        width: 100%;
        height: 100%;
        background-color: var(--color-02);
        border-radius: 3vw;
        overflow: hidden;
    }

    section.business .area-project .itemlist .each .skin {
        position: relative;
        width: 100%;
        height: 100%;
        padding: 0 0 4vw 0;
    }

    section.business .area-project .itemlist .each .box-fig {
        width: 100%;
        height: 43vw;
    }

    section.business .area-project .itemlist .each .box-fig figure {
        background-position: 50% 50%;
        background-size: cover;
    }

    section.business .area-project .itemlist .each .box-logo {
        height: 20vw;
        padding: 2vw 0 0 3vw;
    }

    section.business .area-project .itemlist .each .box-logo p {
        display: inline-block;
        vertical-align: top;
        position: relative;
        width: 33vw;
        aspect-ratio: 330/174;
    }

    section.business .area-project .itemlist .each .box-logo p .mrk {
        position: absolute;
        right: -12vw;
        bottom: 3vw;
        width: 5vw;
        height: 5vw;
    }

    section.business .area-project .itemlist .each .box-logo p .mrk>b {
        background-image: url(/common/img/ico_externallink_01.svg);
    }

    section.business .area-project .itemlist .each .box-logo p span {}

    section.business .area-project .itemlist .each .box-note {
        height: 21vw;
        padding: 0 4vw 0 4vw;
    }

    section.business .area-project .itemlist .each .box-note p {
        line-height: 1.7;
        font-size: 3.2vw;
        font-weight: 500;
        letter-spacing: 0.05em;
    }
    section.business .area-project .itemlist .each#uhuhu_huna .box-note.overtxt p {
        line-height: 1.4;
    }
	
	
	
	
	
	
    /*================*/
    section.activity {
        /* height: 214vw; */
    }

    section.activity>.inner {}

    /*----*/
    section.activity .area-ttl {
        padding: 12vw 0 6vw 0;
    }

    section.activity .area-ttl h2 {
        text-indent: 1vw;
    }

    section.activity .area-ttl h2 span {
        background-image: url(/top/img/char_title_note.svg);
    }

    /*----*/
    section.activity .area-capt {
        padding: 0 0 12vw 0;
    }

    section.activity .area-capt p {
        line-height: 1.55;
        font-size: 6vw;
        font-weight: 300;
        letter-spacing: 0.11em;
    }

    /*----*/
    section.activity .area-jump {
        width: 80vw;
        padding: 0 0 7vw 0;
        margin: 0 auto 0 auto;
    }

    section.activity .area-jump .each {}

    section.activity .area-jump .each dl {
        width: 100%;
        padding: 0 0 7vw 0;
    }

    section.activity .area-jump .each dl>dt {
        padding: 0 0 3vw 0;
        text-align: center;
    }

    section.activity .area-jump .each dl>dt p {
        line-height: 1.0;
        font-size: 3.9vw;
        font-weight: 700;
        letter-spacing: 0.13em;
        white-space: nowrap;
        color: var(--color-01);
    }

    section.activity .area-jump .each dl>dd {}

    section.activity .area-jump .each dl>dd .framing {
        position: relative;
        width: 100%;
        aspect-ratio: 640/280;
        overflow: hidden;
        background-color: rgba(255, 255, 255, 1);
    }

    section.activity .area-jump .each.n1 dl>dd .framing figure {
        background-image: url(/top/img/bnr_kuramachilab.png);
    }

    section.activity .area-jump .each.n2 dl>dd .framing figure {
        background-image: url(/top/img/bnr_recruitinfo.png);
    }

    section.activity .area-jump .each dl>dd .framing .hem {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        border-style: solid;
        border-width: 1vw;
        border-color: var(--color-01);
    }

    section.activity .area-jump .each dl>dd .framing a {}

    /*================*/
    section.recruit {}

    section.recruit>.inner {}

    /*----*/
    section.recruit .area-ttl {
        padding: 8vw 0 6vw 0;
    }

    section.recruit .area-ttl h2 {
        text-indent: 1vw;
    }

    section.recruit .area-ttl h2 span {
        background-image: url(/top/img/char_title_recruit.svg);
    }

    /*----*/
    section.recruit .area-capt {
        padding: 0 0 5vw 0;
    }

    section.recruit .area-capt p {
        line-height: 1.55;
        font-size: 6vw;
        font-weight: 300;
        letter-spacing: 0.11em;
    }

    /*----*/
    section.recruit .area-note {
        padding: 0 0 6vw 0;
    }

    section.recruit .area-note p {
        line-height: 2.4;
        font-size: 3.5vw;
        font-weight: 400;
        letter-spacing: 0.1em;
    }

    /*----*/
    section.recruit .area-link {
        padding: 0 0 9vw 0;
    }

    section.recruit .area-link .box-call {
        padding: 0 0 3vw 0;
    }

    section.recruit .area-link .box-call p {
        font-size: 3.3vw;
        letter-spacing: 0.1em;
    }

    /*----*/
    section.recruit .area-pic {
        position: relative;
        height: 106vw;
    }

    section.recruit .area-pic .each {
        position: absolute;
        opacity: 0;
        -webkit-transition-property: opacity;
        transition-property: opacity;
        -webkit-transition-duration: 0.7s;
        transition-duration: 0.7s;
        -webkit-transition-timing-function: linear;
        transition-timing-function: linear;
    }

    section.recruit .area-pic .each.appear {
        opacity: 1;
    }

    section.recruit .area-pic .each.n1 {
        left: 1vw;
        top: 25vw;
        width: 63vw;
        aspect-ratio: 645/639;
    }

    section.recruit .area-pic .each.n2 {
        left: 48vw;
        top: 0;
        width: 42vw;
        aspect-ratio: 384/394
    }

    section.recruit .area-pic .each figure {
        border-radius: 3vw;
    }

    section.recruit .area-pic .each.n1 figure {
        background-image: url(/top/img/pic_recruit_01.png);
    }

    section.recruit .area-pic .each.n2 figure {
        background-image: url(/top/img/pic_recruit_02.png);
    }

    /*````````````````````````````````````````*/
}

/* end of @media */
/*````````````````````````````````````````*/