/*-----------------------
　導入
-------------------------*/

#container .cnt .clead {
    position: relative;
    background-color:hsla(22,0%,100%,.9);
    padding-bottom: clamp(80px, 6.25vw, 90px);;
}
#container .cnt .clead h1 {
    position: absolute;
    top: 50px;
    left: 0;
    z-index: 1;
}
#container .cnt .clead .figure {
    position:absolute;
    top:0;
    left: 0;
    z-index: 0;
}
#container .cnt .clead p:first-of-type {
    font-size: clamp(15px, 1.18055556vw, 20px);
    margin-top: clamp(50px, 5.20833333vw, 80px);
    line-height: 2.0;
}
#container .cnt .clead .logo-cocopalm img {
    width: clamp(170px, 17.3611111vw, 250px);
    margin-top: clamp(80px, 6.25vw, 100px);
    margin-left: auto;
    margin-right: auto;
}

@media screen and (max-width: 810px){
    #container .cnt .clead {
        padding-top: 60px;
    }
    #container .cnt .clead h1 {
        top:80px;
    }
}

/*-----------------------
　コンセプト情報
-------------------------*/

#container .cnt .inn {
    position: relative;
    z-index: 0;
    padding-bottom: 40px;
    text-align: left;
  }
#container .cnt .inn::after {
  content: "";
  position: absolute;
  top:15%;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(to bottom, rgba(155, 218, 220, 0.9) 0%, rgb(255, 255, 255, 0.9) 70%);
  z-index: -1;
 }
#container .cnt .inn .tit02 {
    margin: 40px 10px 0 2.08333333vw;
    font-size: clamp(22px, 1.94444444vw, 30px);
}
#container .cnt .inn p {
    margin-left: clamp(48px, calc(80 / 540 * 100cqw), 80px);
    margin-right: clamp(30px, 2.77777778vw, 50px);
    margin-top: 30px;
    font-size: clamp(15px, calc(17 / 540 * 100cqw), 18px);
 }
#container .cnt .inn .kome {
    margin-top: 15px;
    font-size: 13px;
}
#container .cnt .inn > div:nth-of-type(2) {
    margin-top: 60px;
}

/*----------------------
サステナビリティ
-----------------------*/

#container .cnt .sustaina {
  aspect-ratio: 9 / 14;
  background: url(/themes/cocopalm/concept/images/bg_sustainable.webp) no-repeat center top;
  background-size: contain;
  position: relative;
  color: #FFF;
	overflow-x: hidden;
}
#container .cnt .sustaina h2 {
  font-size: clamp(22px, calc(30 / 540 * 100cqw), 33px);
  margin-top: clamp(80px, 11.11111111vw, 160px);
}
#container .cnt .sustaina ul {
  margin-top: clamp(35px, calc(70 / 540 * 100cqw), 70px);
  padding: 0 clamp(35px, calc(40 / 540 * 100cqw), 50px) 2.77777778vw;
}
@media screen and (max-width: 810px){
	#container .cnt .sustaina .sustaina-inn {padding: 20px 0 40px;}
	#container .cnt .sustaina ul li img {
    	width: clamp(280px, 43.20vw, 320px);
    	height: auto;
    	margin: 15px auto 0;
  	}
  	#container .cnt .sustaina .btn {margin-top: 30px;}
}
@media screen and (max-width: 576px){
	#container .cnt .sustaina {
  	aspect-ratio: auto;
  	background: url(/themes/cocopalm/concept/images/bg_sustainable.webp) no-repeat center top;
  	background-size: auto 100%;
	}
}