
:root{
	--color-b1:#351f34;
	--color-b2:#c49651;
	--color-b3:#c9cec9;
	--color-b4:#d6d6cb;
}

.b_bg-color-01{background:var(--color-b1);}
.b_bg-color-02{background:var(--color-b2);}
.b_bg-color-03{background:var(--color-b3);}
.b_bg-color-04{background:var(--color-b4);}

.bc_full{height:100vh;overflow: hidden;}
.bc_half{height:50vh;overflow: hidden;}

.branding-wrp{}
.branding-wrp p{font-size:21px;}
.branding-wrp h1{font-size:calc(24px + 3vw);line-height:1;}
.branding-wrp h2{font-size:calc(24px + 3vw);line-height:1;}

.branding-sec-01{max-width:100%; height: unset; display: flex; }
.branding-sec-01 video{max-width:100%; position: static;transform: unset;  aspect-ratio: 16 / 9; object-fit: cover;}
.width-450{max-width:450px;text-align:left;display: inline-block;}


.branding-sec-video,.branding-sec-05 .video-wrapper{aspect-ratio: 16 / 9;overflow:hidden;position:relative;}
/*.branding-sec-01 .h_logo{position:absolute;top:50%;left:50%;width:calc(300px + 10vw);transform:translate(-50%,-50%);}*/
.branding-sec-video video,.branding-sec-05 video{position:absolute; top:0; left:0; width:100%; height:100%; object-fit: cover;}

.branding-sec-02,.branding-sec-05 {padding: 15vh 0px 15vh 0px;}
.branding-sec-02 h1,.branding-sec-05 h1{color:var(--color-b2);}
.branding-sec-02 video{margin:auto;width: 100%;}

.branding-sec-03{padding: 15vh 0px 15vh 0px;}
.branding-sec-03 h1{color:var(--color-b2);}
.branding-sec-03 p{line-height: 1.2;}
.branding-sec-03 p span{font-family:'roboto';font-size:16px;}

.branding-sec-04{padding: 15vh 0px 15vh 0px;}
.branding-sec-04 .illustration-slider{display: flex}
.branding-sec-04 .illustration-slider .item{padding:15px;}
 
.branding-parallax{background-repeat:no-repeat;background-position: center center;background-size:cover;background-attachment:fixed;}

.branding-parallax.pb-01{height:100vh;background-image: url("poster-01.webp");}
.branding-parallax.pb-03{height:100vh;background-image: url("../../../portfolio/damao/coventic-key-visual-03.webp");}
 

@media (max-width:767px){
     .branding-sec-02,.branding-sec-04,.branding-sec-05{ padding: 7vh 0;}

     .branding-sec-04 .illustration-slider .item{padding: 8px;}
}

@media (max-width:575px){
     .branding-sec-04 .illustration-slider .item{padding: 0px;}

 .branding-sec-04 .illustration-slider{flex-direction: column;gap:14px; align-items: center; justify-content: center; }
}

 



