@charset "UTF-8"; /*****contents*****/
body.home {
    background: url(../images/home/promo.png) no-repeat top left / 190rem 178rem;
}

@media (min-width: 1901px) { 
    body.home {
        -webkit-background-size: 100% 178rem;
        background-size: 100% 178rem;
    }
}

section {
    padding-left: 5rem;
    padding-right: 5rem;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
プロモ
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.promo_frame {
    color: #fff;
    text-align: center;
    padding: 0 5rem;
    min-height: 84rem;
}

.promo_frame .promo_inner {
    padding: 9.5rem 6rem 0;
}

.promo_frame .promo_inner p.ttl {
    width: calc(104.9rem / 2);
    margin-bottom: 5rem;
    margin-left: 6rem;
}

.promo_frame .promo_inner p.deco {
    width: calc(122.4rem / 2);
}
/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
お知らせ
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#home_news {
    padding-top: 7.5rem;
    padding-bottom: 10rem;
}

#home_news .inner {
    justify-content: center;
    gap: 6rem;
}

#home_news .txt_wrap {
    width: 32rem;
}

#home_news .txt_wrap h2 {
    margin-bottom: 5.5rem;
}

#home_news .txt_wrap h2 span {
    display: table;
}

#home_news .txt_wrap h2 .en {
    font-size: 9.8rem;
    font-weight: 600;
    letter-spacing: -.01em;
    color: var(--theme_m_color);
    line-height: 1;
}

#home_news .txt_wrap h2 .ja {
    font-size: 2.2rem;
    font-weight: bold;
    margin-top: -.8rem;
    padding-left: 2.5rem;
}

#home_news .txt_wrap p.cmn_btn {
    margin-left: 2.5rem;
}

#home_news .inner > ul {
    width: 84rem;
	margin-top: 2.5rem;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
事業内容
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#home_biz {
    position: relative;
    padding-top: 9rem;
}

#home_biz::before {
    position: absolute;
    content: "BUSINESS";
    font-family: "Josefin Sans", sans-serif;
    line-height: 1;
    white-space: nowrap;
    font-size: 18.9rem;
    letter-spacing: -.01em;
    font-weight: 600;
    top: 4rem;
    right: 0;
    color: #d7f5e7;
}

/*イントロ*/
#home_biz .sec_intro {
    padding-bottom: 12rem;
}

#home_biz .sec_intro .inner {
    position: relative;
    padding: 0 0 0 11.5rem;
}

#home_biz .sec_intro .inner p.slug {
    position: relative;
    padding-left: 8.5rem;
    margin-bottom: 5.5rem;
	display: table;
}

#home_biz .sec_intro .inner p.slug img {
    width: calc(36.7rem / 2);
}

#home_biz .sec_intro .inner p.slug::before {
    position: absolute;
    content: "";
    background: var(--theme_m_color);
    width: 5.7rem;
    height: 2px;
    top: 42%;
    transform: translateY(-50%);
    left: 0;
}

#home_biz .sec_intro .inner h2.main_ttl {
    width: calc(143.7rem / 2);
    margin-left: -2rem;
}

#home_biz .sec_intro .inner p.img {
    width: calc(120.4rem / 2);
    position: absolute;
    top: 6rem;
    right: 10rem;
}


/*01/02共通*/
#home_biz .sec_block {
    padding-bottom: 10rem;
}

#home_biz .sec_block .ol_list {
    position: relative;
    z-index: 0;
    padding: 7rem 0 30rem;
    justify-content: center;
    gap: 13rem;
    align-items: center;
}

#home_biz .sec_block .ol_list::after {
    position: absolute;
    content: "";
    z-index: -1;
    background: var(--theme_m_color);
    width: 100vw;
    height: 100%;
    margin: 0 calc(50% - 50vw);
    top: 0;
    left: 0;
}

#home_biz .sec_block .ol_list .txt_wrap h2.main_ttl {
    position: relative;
    padding: 2rem 0 0;
    margin-bottom: 5rem;
}

#home_biz .sec_block .ol_list .txt_wrap h2.main_ttl::before {
    position: absolute;
    top: -1rem;
    color: #4d4d4d;
    mix-blend-mode: screen;
    font-family: "Josefin Sans", sans-serif;
    font-style: italic;
    font-size: 11rem;
    letter-spacing: .01em;
    line-height: 1;
    font-weight: 400;
}

#home_biz .sec_block .ol_list .txt_wrap h2.main_ttl span {
    display: table;
    letter-spacing: .06em;
    font-weight: 400;
    color: #fff;
}

#home_biz .sec_block .ol_list .txt_wrap h2.main_ttl .main {
    font-size: 5.6rem;
}

#home_biz .sec_block .ol_list .txt_wrap h2.main_ttl .sub {
    font-size: 3.6rem;
    margin-top: -1rem;
    margin-left: -1.5rem;
}

#home_biz .sec_block .ol_list .txt_wrap p.main_txt {
    color: #fff;
    font-size: 2.2rem;
    letter-spacing: .02em;
    line-height: 1.75;
    width: 51rem;
}

#home_biz .sec_block ul.items {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    /* これだけで最後の行が中央寄せになる */
    gap: 3.8rem;
    margin-top: -22rem;
}

#home_biz .sec_block ul.items li {
    width: calc( (100% - (3.8rem * 2)) / 3 );
    border-radius: 4rem;
    overflow: hidden;
    position: relative;
}

#home_biz .sec_block ul.items li p.img {
    width: calc(101.7rem / 2);
    padding-top: 43rem;
}

#home_biz .sec_block ul.items li .txt_area {
    position: absolute;
    bottom: 1.5rem;
    left: 50%;
    transform: translateX(-50%);
    border-radius: 0 0 4rem 4rem;
    overflow: hidden;
    width: calc(100% - 3rem);
}

#home_biz .sec_block ul.items li .txt_area h3.ttl a {
    background: #fff;
    display: table;
    color: var(--theme_s_color);
    font-size: 3.2rem;
    font-weight: bold;
    letter-spacing: .06em;
    padding: .3rem 1.4rem;
}

#home_biz .sec_block ul.items li .txt_area .txt {
    background: var(--theme_s_color);
    margin-top: -2.5rem;
    position: relative;
    z-index: -1;
}

#home_biz .sec_block ul.items li .txt_area .txt.btn_lightblue::after {
    position: absolute;
    content: "";
    background: no-repeat left 50% top 48% / 1.9rem .8rem;
    width: 6rem;
    height: 6rem;
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    top: 60%;
    right: 2rem;
    transform: translateY(-50%);
    background-color: #fff;
    border: 2px solid #fff;
    background-image: url("../images/common/arrrow_lightblue.svg");
    border-color: var(--theme_s_color);
}

#home_biz .sec_block ul.items li .txt_area .txt p {
    font-size: 2rem;
    color: #fff;
    line-height: 1.5;
    font-weight: 500;
    letter-spacing: .02em;
    padding: 4.5rem 7.5rem 2.5rem 2.5rem;
}

@media (min-width: 768px) and (max-width: 1650px) {
    #home_biz .sec_block ul.items li .txt_area .txt p { 
        font-size: 1.8rem;
    }
}


#home_biz .sec_env .ol_list .txt_wrap h2.main_ttl::before {
    content: "01";
    left: -9rem;
}

#home_biz .sec_env .ol_list p.icon_wrap {
    width: calc(76.1rem / 2);
    margin-top: 2rem;
}

/*02サーキュラーエコノミー事業*/
#home_biz .sec_cir .ol_list {
    flex-direction: row-reverse;
}

#home_biz .sec_cir .ol_list .txt_wrap h2.main_ttl::before {
    content: "02";
    right: 6rem;
}

#home_biz .sec_cir .ol_list p.icon_wrap {
    width: calc(96.4rem / 2);
}

#home_biz .row_mani {
    margin: 12rem auto 0;
}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
会社概要
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#home_com {
    padding-bottom: 8rem;
    padding-top: 6rem;
}

#home_com .bg_wrap {
    position: relative;
    padding-bottom: 15rem;
}

#home_com .bg_wrap::after {
    position: absolute;
    content: "";
    right: -5rem;
    bottom: 0;
    background: #e6f6f0;
    width: 126rem;
    height: 73rem;
    z-index: -1;
}

#home_com .inner {
    gap: 9rem;
    margin-left: 5rem;
}

#home_com .inner .img_wrap {
    position: relative;
}

#home_com .inner .img_wrap p.img img {
    border-radius: 4rem;
}

#home_com .inner .img_wrap p.img.main img {
    width: calc(106rem / 2);
}

#home_com .inner .img_wrap p.img.sub {
    position: absolute;
    bottom: -6rem;
    left: -9rem;
}

#home_com .inner .img_wrap p.img.sub img {
    width: calc(67.6rem / 2);
}

#home_com .inner .txt_wrap {
    margin-top: 6.5rem;
}

#home_com .inner .txt_wrap h2.main_ttl {
    margin-bottom: 5.5rem;
}

#home_com .inner .txt_wrap h2.main_ttl span {
    display: table;
}

#home_com .inner .txt_wrap h2.main_ttl .ja {
    font-size: 2.4rem;
    font-weight: bold;
    letter-spacing: .08em;
    padding-left: 1rem;
}

#home_com .inner .txt_wrap h2.main_ttl .en img {
    width: calc(131.1rem / 2);
}

#home_com .inner .txt_wrap ul.items {
    width: 54rem;
    border-top: 1px solid #00baa2;
    margin-left: 6rem;
}

#home_com .inner .txt_wrap ul.items li {
    border-bottom: 1px solid #00baa2;
}

#home_com .inner .txt_wrap ul.items li a {
    font-size: 3.2rem;
    letter-spacing: .04em;
    position: relative;
    display: block;
    padding: 5rem 12rem 5rem 5rem;
	overflow: hidden;
}

#home_com .inner .txt_wrap ul.items li a::before,
#home_com .inner .txt_wrap ul.items li a::after {
	position: absolute;
    content: "";
    width: 7.2rem;
    height: 7.2rem;
    border-radius: 100%;
    top: 50%;
    transform: translateY(-50%);
    right: 3rem;
}

#home_com .inner .txt_wrap ul.items li a::before {
	background: url("../images/common/arrow_white.svg") no-repeat left 50% top 48% / 2.2rem 1rem,linear-gradient(to top right, #19c757, #00c8f0);
}

@media screen and (min-width: 769px) {
	#home_com .inner .txt_wrap ul.items li a:hover{
		color: var(--theme_m_color);
	}
    
    #home_com .inner .txt_wrap ul.items li a:hover::before {
        background-image: url("../images/common/arrow_green.svg");
        background-color: #fff;
        border: 2px solid var(--theme_m_color);
    }
}

#home_com .csr {
    background: url("../images/home/csr_bg01.jpg") no-repeat 50% / 100%;
    width: 94rem;
    height: 34rem;
    border-radius: 4rem;
    overflow: hidden;
    margin: -6.5rem auto 0;
	transition: .3s ease-in;
}

#home_com .csr:hover {
    background-size: 110%;
}

#home_com .csr .txt_wrap {
    position: relative;
    max-width: 67.8rem;
    margin: 0 auto;
    padding: 8rem 0;
}

#home_com .csr .txt_wrap::after {
    position: absolute;
    content: "";
    background: url("../images/common/arrow_green.svg") no-repeat left 50% top 48% / 3rem 1.5rem #fff;
    width: 9rem;
    height: 9rem;
    border-radius: 100%;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    border: 2px solid #fff;
    transition: .3s ease-in;
}

#home_com .csr .txt_wrap p.txt {
    font-size: 2.2rem;
    color: #fff;
    letter-spacing: .06em;
    line-height: 1.75;
	margin-bottom: 1rem;
}

#home_com .csr.biggerlink .txt_wrap h3.ttl a img {
    width: calc(63.8rem / 2);
    margin-left: -2rem;
}