@charset "utf-8";


/* body
--------------------------------------------------------------*/
.page-top { background: url(/assets/images/common/deco-sec-bg-top.png)no-repeat left top 6.1rem; background-size: contain;}
@media screen and (min-width: 768px){
.page-top { background: url(/assets/images/common/deco-sec-bg-top.png)no-repeat left top 0; background-size: contain;}    
}




/* kv
--------------------------------------------------------------*/
.sec-kv { padding-bottom: 0; position: relative;}
.kv-inner { width: 100%; max-width: var(--xlg-width); margin: 0 auto;}
.kv-img { padding: 0 1.5rem;}
.kv-img img { margin: 0 auto;}
.kv-txt { text-shadow: 0 0 5px #5c5c5c; color: #fff; font-size: 1.6rem; font-weight: 700; position: absolute; top: 40%; left: 50%; transform: translateY(-50%) translateX(-50%); display: block; text-align: center; width: 100%;}
.sec-kv .deco-bottom { margin-top: 5rem;}
.sec-kv .deco-bottom img { margin: 0 auto; max-width: 240%;}
.img-vender { display: none;}
.vender-link { width: 75%; margin: 2rem auto 0;}

@media screen and (min-width: 768px){
.kv-inner { position: relative;}
.kv-img { margin-top: -34rem; padding: 0;}
.kv-txt {font-size: 2rem; top: 50%;}
.img-vender { position: absolute; right: 0; bottom: -7rem; display: block; width: 44%;}
.sec-kv .deco-bottom img { margin: 0 auto; max-width: 100%;}
}
@media screen and (min-width: 1024px){
.kv-txt {font-size: 3rem;}
.img-vender { position: absolute; right: 0; bottom: -16rem; width: auto;}
}
@media screen and (min-width: 1100px){
.img-vender { position: absolute; right: -4rem; bottom: -5rem;}
}

.img-vender .vender-click { cursor: pointer; display: inline-block;}
.img-vender .vender-click:hover { opacity: 1;}

/* blog
--------------------------------------------------------------*/
.content-blog .list { display: flex; justify-content: space-between; flex-direction: column;}
.content-blog .list li { width: 100%; margin-bottom: 2rem;}
.content-blog .list li:last-child { margin-bottom: 0;}
.pic { margin: 0 1rem;}
.content-blog .pic img { border-radius: 50%; height: auto;}
.content-blog .wrap { display: flex; align-items: center;}
.content-blog .date { background: url(/assets/images/common/ico_date.svg) no-repeat left center; display: inline-block; padding: 0 4rem 0 0.5rem; font-size: 1.1rem; font-weight: bold; color: #595757; background-size: contain;}
.content-blog .txt-box { width: calc(75% - 1rem); margin: 0 0.5rem;}
@media screen and (min-width: 768px){
.content-blog .list { flex-direction: row;}
.content-blog .list li { width: calc(100% / 3); margin-bottom: 0;}
}
    

/* movie
--------------------------------------------------------------*/
.movie-block { margin-bottom: 5rem; position: relative; width: 100%; padding-top: 56.25%;}
.movie-block iframe { position: absolute; top: 0; right: 0; width: 100%; height: 100%;}
.sec-movie { background: url(/assets/images/common/deco-sec-bg-bottom.png) no-repeat left bottom; background-size: contain;}


/* about
--------------------------------------------------------------*/
.vege-name { font-size: 1.8rem; font-weight: normal; display: flex; justify-content: center; margin-bottom: 1rem; text-align: center; align-items: center;}
.vege-name::before { content: ""; display: flex; align-items: center; justify-content: center; min-height: 4.2rem; width: 2.2rem; height: 2.5rem; background: url(/assets/images/home/deco_vege_before.png) no-repeat center center; background-size: contain;}
.vege-name::after { content: ""; display: flex; align-items: center; justify-content: center; min-height: 4.2rem; width: 2.2rem; height: 2.5rem; background: url(/assets/images/home/deco_vege_after.png) no-repeat center center; background-size: contain;}

/*slick setting*/
.slick-prev::before, .slick-next::before { content: "" !important; display: inline-block; width: 2rem; height: 2rem; color: initial !important;}
.slick-prev::before { background: url(/assets/images/home/btn_slide_pre.png) no-repeat center center; background-size: contain;}
.slick-next::before { background: url(/assets/images/home/btn_slide_next.png) no-repeat center center; background-size: contain;}

.list-slider-item .item-inner { display: flex; flex-direction: column; align-items: center; margin: 0 1rem;}
.list-slider { width: 80%; margin: 0 auto;}

.shukka { display: flex; justify-content: center;}
.list-shukka { display: flex;}
.list-shukka li { margin: 0 0.5rem; font-size: 1.8rem; }
.list-shukka li::before { content: "●"; color: var(--cl-main); display: inline-block; margin-right: 0.5rem;}
@media screen and (min-width: 768px){
.list-slider { width: 100%; margin: auto;}
.list-shukka li { margin: 0 3rem;}
.list-slider { width: 90%; margin: 0 auto;}
}

/* system
--------------------------------------------------------------*/
.list-system { display: flex; justify-content: center; margin-bottom: 2rem; flex-direction: column;}
.list-system li { background-color: var(--cl-main); color: #fff; font-size: 1.8rem; padding: 1rem 4rem; position: relative; border-radius: 1rem; text-align: center; margin: 0 0 4rem;}
.list-system li::after { content: ""; display: inline-block; width: 2rem; height: 2rem; background: url(/assets/images/common/ico_plus.svg) no-repeat center center; background-size: contain; position: absolute; right: 50%; bottom: -3rem; transform: translateY(0%) translateX(50%);}
.list-system li:last-child { margin-bottom: 0;}
.list-system li:last-child::after { display: none;}
.system-desc { display: flex; flex-direction: column; align-items: center;}
.system-desc .system-icon-b { width: 4.2rem; height: auto; margin: 2rem 0;}
.system-flow { display: flex; flex-direction: row; justify-content: center;}
.system-flow li { margin: 0 0.5rem;}

@media screen and (min-width: 768px){
.c-sec.sec-system { padding: 0;}
.system-bg { background: url(/assets/images/home/img_system_bg.png) no-repeat center center; background-size: contain; padding: 10rem 0;}
.list-system { flex-direction: row;}
.list-system li { margin: 0 3rem;}
.list-system li::after { right: -4rem; bottom: auto; transform: translateY(0%) translateX(0%);}
.system-flow li { margin: 0 3rem;}
.system-desc .system-icon-b { margin: 3rem 0;}
}
@media screen and (min-width: 768px){
/*.system-bg { margin: 0 2rem;}*/

}

/* company
--------------------------------------------------------------*/
.sec-company { background-image: url(/assets/images/common/deco-sec-bg-top.png),url(/assets/images/common/deco-sec-bg-bottom.png); background-position: left top,left bottom; background-size: contain; background-repeat: no-repeat;}
.company-content { display: flex; justify-content: space-between; flex-direction: column; align-items: center;}
.company-content .col-img { margin-bottom: 2rem;}
.company-content .col-txt p + p { margin-top: 2rem;}
.sdgs-bnr { margin-top: 5rem;}
.sdgs-bnr img { margin: 0 auto;}

.sns-block { display: flex; justify-content: space-between; flex-direction: column;}
.sns-block .col { width: 100%;}
.group-list li:nth-child(2){ margin-top: 3rem;}
.group-list img { width: 100%;}

.col._fb { overflow: hidden; margin-bottom: 3rem;}

@media screen and (min-width: 768px){
.company-content { flex-direction: row; align-items: flex-start; }
.company-content .col-img { width: 20%; margin-bottom: 0;}
.company-content .col-txt { width: 75%;}

.sns-block { flex-direction: row;}
.sns-block .col { width: calc(95% / 2);}
.group-list img { width: auto;}
.col._fb { margin-bottom: 0;}
}

.vender-img img { width: 100%; max-width: 100vw;}
.vender-txt { margin-top: 3rem;}
@media screen and (min-width: 768px){
.vender-txt { text-align: center; margin-top: -10rem;}
}
@media screen and (min-width: 1100px){
.vender-txt { text-align: center; margin-top: -20rem;}
}