/* =======================

base 

======================= */
@import url('https://fonts.googleapis.com/css2?family=Almarai:wght@300;400;700;800&display=swap');


html, body {
	position: relative;
	height: 100%;
	}

body{
                /*padding-top: 0 !important;*/
                }

html {
                -ms-touch-action: manipulation;
                touch-action: manipulation;
                }

#LB21S1 img{
                vertical-align: bottom;
                }

#LB21S1 a{
                color: #585858;
                }

#LB21S1 *{
	box-sizing: border-box;
                margin: 0;
                padding: 0;
                line-height: 1em;
                font-weight: normal;
                letter-spacing: .1em;
	opacity: 1;
	filter: alpha(opacity=100);
                }

#LB21S1 .sp{
	display: none !important;
	}
@media screen and (max-width: 768px) {
#LB21S1 .sp{
	display: block !important;
	}
	}
#LB21S1 .pc{
	display: block !important;
	}
@media screen and (max-width: 768px) {
#LB21S1 .pc{
	display: none !important;
	}
	}

#LB21S1 .spi{
	display: none;
	}
@media screen and (max-width: 768px) {
#LB21S1 .spi{
	display: inline;
	}
	}
#LB21S1 .pci{
	display: inline;
	}
@media screen and (max-width: 768px) {
#LB21S1 .pci{
	display: none;
	}
	}


/* =======================

LB21S1

======================= */

#LB21S1 {
                width: 100%;
                height: auto;
                position: relative;
                margin: 0;
                padding: 0;
                background: #F5F4F3;
                color: #000;
                font-family:  "Helvetica Neue", 'Almarai', Arial, 游ゴシック, "Yu Gothic", メイリオ, Meiryo, sans-serif;
                font-size: 14px;
                font-weight: 300;
                -webkit-font-smoothing: antialiased;
                -moz-osx-font-smoothing: grayscale;
                overflow-x: hidden;
                }
@media screen and (max-width: 768px) {
#LB21S1 {
                }
	}

#LB21S1 .wbase{
                width: 100%;
                height: auto;
                position: relative;
                background: #F5F4F3;
                margin: 0;
                padding: 0;
                }



/* =======================

inview 

======================= */
    
#LB21S1 .scaleUp {
                opacity: 1.0 !important;
                transform:scale(1.0) translate(0, 0) !important;
                -webkit-transform: scale(1.0) translate(0, 0) !important;
                transition: all 1s ease;
                }
    
#LB21S1 .scaleUp2 {
                opacity: 1.0 !important;
                transform:scale(1.0) translate(0, 0) !important;
                -webkit-transform: scale(1.0) translate(0, 0) !important;
                transition: all 1.5s ease;
                transition-delay: .1s;
                }
    
#LB21S1 .fadeUp {
                opacity: 1.0 !important;
                transform: translateY(0em) !important;
                transition: all 1s;
                }


/* =======================

space 

======================= */

.UremLL {margin-top: -50rem !important;}
.UremL {margin-top: -30rem !important;}
.UremM {margin-top: -20rem !important;}
.UremS {margin-top: -5rem !important;}
.remLL {margin-top: 30rem !important;}
.remL {margin-top: 15rem !important;}
.remM {margin-top: 10rem !important;}
.remS {margin-top: 5rem !important;}
.rem0 {margin-top: 0 !important;}
@media screen and (max-width: 768px) {
.UremLL,
.UremL,
.UremM,
.UremS,
.remLL,
.remL,
.remM,
.remS,
.rem0{
                margin-top: 5rem !important;
                }
                }

@media screen and (max-width: 768px) {
.remSP {margin-top: 10rem !important;}
                }

.UremB {margin-top: -10rem !important;}
@media screen and (max-width: 768px) {
.UremB {margin-top: -5rem !important;}
                }


/*================================

facade

================================*/

#LB21S1 .facade {
	position: relative;
	width: 100%;
                margin: auto;
                margin-top: 0;
                /*margin-top: 87px;*/
                background: #fff;
                min-height: 50vh;
                max-height: 1200px;
	}
#LB21S1 .facade:before {
	content:"";
	display: block;
	padding-top: 55%;
	}
@media screen and (max-width: 1024px) {
#LB21S1 .facade:before {
	padding-top: 80%;
	}
	}
@media screen and (max-width: 768px) {
#LB21S1 .facade {
                max-width: 100%;
	height: calc(100svh - 112px);
                /*margin-top: 112px;*/
	}
#LB21S1 .facade:before {
                display: none;
	}
	}

#LB21S1 .facade #content {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	/*overflow: hidden;*/
	}

#LB21S1 .facade #content .para{
	position: relative;
	width: 100%;
	height: 100%;
	background-position: center top;
	background-repeat: no-repeat;
	background-size: cover;
	background-image: url(../images/mainvisual_pc.jpg);
                display: flex;
	align-items: center;
                justify-content: flex-end;
	}
@media screen and (max-width: 768px) {
#LB21S1 .facade #content .para{
	background-position: center top;
	background-image: url(../images/mainvisual_sp.jpg);
	align-items: flex-end;
	}
	}


/* =======================

titles 

======================= */

#LB21S1 .facade #content #titles {
                text-align: center;
                width: 22%;
                min-width: 170px;
                margin-right: 8%;
                }
@media screen and (max-width: 768px) {
#LB21S1 .facade #content #titles {
                width: 100%;
                margin-right: 0;
                margin-bottom: 15%;
                }
	}

#LB21S1 .facade #content #titles h2{
                width: 100%;
                opacity: 0.2;
                transform: scale(1.1);
                -webkit-transform: scale(1.1);
                text-align: center;
                }
@media screen and (max-width: 768px) {
#LB21S1 .facade #content #titles h2{
                }
	}

#LB21S1 .facade #content #titles h2 img{
                width: 100%;
                height: auto;
                max-width: 400px;
                }
@media screen and (max-width: 768px) {
#LB21S1 .facade #content #titles h2 img{
                width: 55%;
                max-width: 300px;
                }
	}


/*================================

:::::::::: スクロールダウン ::::::::::

================================*/


#LB21S1 .facade #content .scrolldown1{
                display: block;
	position: absolute;
                z-index: 100;
                left: 20px;
	bottom: 0;
	height: 40px;
                }
@media screen and (max-width: 768px) {
#LB21S1 .facade #content .scrolldown1{
                right: auto;
                }
	}

#LB21S1 .facade #content .scrolldown1 span{
	position: absolute;
	left: -1.6em;
	top:  -3em;
	color: #fff;
	font-size: .9em;
                transform: rotate(90deg);
                }
@media screen and (max-width: 768px) {
#LB21S1 .facade #content .scrolldown1 span{
	left: -1.6em;
                }
	}

#LB21S1 .facade #content .scrolldown1::after{
	content: "";
	position: absolute;
	bottom: 0;
	width: 1px;
	height: 40px;
	background: #fff;
	animation: pathmove 1.4s ease-in-out infinite;
	opacity:0;
                }

@keyframes pathmove{
	0%{
		height: 0;
		top:0;
		opacity: 0;
	}
	50%{
		height: 40px;
		top:0;
		opacity: 1;
	}
	100%{
		height: 0;
		top:40px;
		bottom:0;
		opacity: 0;
	}
                }

/* =======================

looks 

======================= */

#LB21S1 #looks {
                position: relative;
                width: 100%;
                max-width: 1800px;
                margin: auto;
                padding-bottom: 13rem;
                background-color: #F5F4F3;
                }

#LB21S1 #looks section {
                position: relative;
	width: 100%;
                pointer-events: none;
                }

#LB21S1 #looks section .media{
                }

#LB21S1 #looks section .media a{
                display: block;
                width: 100%;
                height: 100%;
                pointer-events: auto;
                }

#LB21S1 #looks section .media a .photo{
                background-color: #000;
                width: 100%;
                height: auto;
                opacity: 0.2;
                transform: scale(0.9) skew(1deg, -2deg);
                -webkit-transform: scale(0.9) skew(1deg, -2deg);
                }

#LB21S1 #looks section .media a .photo img{
                width: 100%;
                height: auto;
                }

#LB21S1 #looks section .media a .photo img{
                width: 100%;
                height: auto;
                transition: all .9s;
                }

#LB21S1 #looks section .media a:hover .photo img{
	opacity: .8;
                }

#LB21S1 #looks section .media a .movie{
                width: 100%;
                height: auto;
                opacity: 0.2;
                transform: scale(0.9) skew(1deg, -2deg);
                -webkit-transform: scale(0.9) skew(1deg, -2deg);
                }

#LB21S1 #looks section .media a video{
                width: 100%;
                height: auto;
                }

#LB21S1 #looks section .media a .spec {
                transform: translateY(1em);
                display: flex;
                }

#LB21S1 #looks section .media a .spec .inner{
                padding-top: 1em;
                padding-left: 1em;
                display: flex;
                align-items: flex-start;
                justify-content: flex-start;
                flex-direction: column;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section .media a .spec .inner{
                padding-top: 1em;
                padding-left: 1em;
                }
                }

#LB21S1 #looks section .media a .spec .inner.sright{
                width: 40%;
                margin-left: 50%;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section .media a .spec .inner.sright{
                width: 100%;
                margin-left: 0;
                }
	}

#LB21S1 #looks section .media a .spec p{
                margin-top: 2px;
                position: relative;
                display: inline-block;
                font-size: .8em;
                line-height: 1.4em;
	-webkit-transition: all .6s;
	-moz-transition: all .6s;
	-ms-transition: all .6s;
	transition: all .6s;
                }

#LB21S1 #looks section .media a .spec p::after {
                position: absolute;
                bottom: 0;
                left: 0;
                content: '';
                width: 100%;
                height: 1px;
                background-color: #fff;
                transform: scale(0, 1);
                transform-origin: left top;
                transition: all .9s;
                }

#LB21S1 #looks section .media a:hover .spec p::after {
/*
                transform: scale(1, 1);
                background-color: #000;
                transition: all .9s;
*/
                }


/*============== patternA1 ==============*/

#LB21S1 #looks section#patternA1 {
                position: relative;
                width: 100%;
                display: flex;
                align-items: center;
                justify-content: center;
                flex-wrap: nowrap;
                flex-direction: row;
                pointer-events: none;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternA1 {
                margin-top: 0 !important;
                align-items: flex-start;
                width: 100%;
                }
                }

#LB21S1 #looks section#patternA1 .media{
                position: relative;
                width: 45%;
                height: auto;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternA1 .media{
                width: 80%;
                }
                }

#LB21S1 #looks section#patternA1 .media a .spec {
                justify-content: flex-end;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternA1 .media a .spec {
                justify-content: flex-start;
                }
                }


/*============== Video01 ==============*/

#LB21S1 #looks section#Video01{
                z-index: 1;
                }

#LB21S1 #looks section#Video01 .media{
                width: 30%;
                height: auto;
                margin-right: 70%;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#Video01 .media{
                width: 60%;
                margin: auto;
                }
                }


/*============== patternA2 ==============*/

#LB21S1 #looks section#patternA2 {
                position: relative;
                width: 100%;
                display: flex;
                align-items: center;
                justify-content: center;
                flex-wrap: nowrap;
                flex-direction: row;
                pointer-events: none;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternA2 {
                justify-content: flex-start;
                width: 100%;
                }
                }

#LB21S1 #looks section#patternA2 .media{
                position: relative;
                width: 45%;
                height: auto;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternA2 .media{
                width: 80%;
                }
                }


/*============== patternA3 ==============*/

#LB21S1 #looks section#patternA3 {
                position: relative;
                width: 100%;
                display: flex;
                justify-content: flex-end;
                z-index: 1;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternA3 {
                }
                }

#LB21S1 #looks section#patternA3 .media{
                width: 30%;
                height: auto;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternA3 .media{
                width: 65%;
                }
                }


/*============== patternA22 ==============*/

#LB21S1 #looks section#patternA22 {
                position: relative;
                width: 100%;
                display: flex;
                align-items: center;
                justify-content: center;
                flex-wrap: nowrap;
                flex-direction: row;
                pointer-events: none;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternA22 {
                justify-content: flex-end;
                width: 100%;
                }
                }

#LB21S1 #looks section#patternA22 .media{
                position: relative;
                width: 45%;
                height: auto;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternA22 .media{
                width: 80%;
                }
                }


/*============== patternA32 ==============*/

#LB21S1 #looks section#patternA32 {
                position: relative;
                width: 100%;
                display: flex;
                justify-content: flex-end;
                z-index: 1;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternA32 {
                justify-content: center;
                }
                }

#LB21S1 #looks section#patternA32 .media{
                width: 30%;
                height: auto;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternA32 .media{
                width: 60%;
                }
                }


/*============== patternA21 ==============*/

#LB21S1 #looks section#patternA21 {
                position: relative;
                width: 100%;
                display: flex;
                align-items: center;
                justify-content: center;
                flex-wrap: nowrap;
                flex-direction: row;
                pointer-events: none;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternA21 {
                justify-content: flex-start;
                width: 100%;
                }
                }

#LB21S1 #looks section#patternA21 .media{
                position: relative;
                width: 45%;
                height: auto;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternA21 .media{
                width: 100%;
                }
                }


/*============== patternA4 ==============*/

#LB21S1 #looks section#patternA4 {
                position: relative;
                width: 100%;
                display: flex;
                align-items: flex-start;
                justify-content: flex-start;
                flex-wrap: nowrap;
                flex-direction: row;
                pointer-events: none;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternA4 {
                width: 100%;
                justify-content: flex-start;
                }
                }

#LB21S1 #looks section#patternA4 .media{
                position: relative;
                width: 40%;
                height: auto;
                margin-left: 0;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternA4 .media{
                width: 80%;
                margin-left: 0;
                }
                }


/*============== patternA5 ==============*/

#LB21S1 #looks section#patternA5 {
                position: relative;
                width: 100%;
                display: flex;
                align-items: center;
                justify-content: center;
                flex-wrap: nowrap;
                flex-direction: row;
                pointer-events: none;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternA5 {
                justify-content: flex-start;
                width: 100%;
                }
                }

#LB21S1 #looks section#patternA5 .media{
                position: relative;
                width: 45%;
                height: auto;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternA5 .media{
                width: 100%;
                }
                }

/*============== patternA6 ==============*/

#LB21S1 #looks section#patternA6 {
                position: relative;
                width: 100%;
                display: flex;
                justify-content: flex-end;
                z-index: 1;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternA6 {
                }
                }

#LB21S1 #looks section#patternA6 .media{
                width: 30%;
                height: auto;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternA6 .media{
                width: 65%;
                }
                }


/*============== patternA7 ==============*/

#LB21S1 #looks section#patternA7 {
                position: relative;
                width: 100%;
                display: flex;
                align-items: center;
                justify-content: center;
                flex-wrap: nowrap;
                flex-direction: row;
                pointer-events: none;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternA7 {
                margin-top: 0 !important;
                align-items: flex-start;
                width: 100%;
                }
                }

#LB21S1 #looks section#patternA7 .media{
                position: relative;
                width: 45%;
                height: auto;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternA7 .media{
                width: 80%;
                }
                }

#LB21S1 #looks section#patternA7 .media a .spec {
                justify-content: flex-end;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternA7 .media a .spec {
                justify-content: flex-start;
                }
                }


/*============== Video02 ==============*/

#LB21S1 #looks section#Video02{
                z-index: 1;
                }

#LB21S1 #looks section#Video02 .media{
                width: 30%;
                height: auto;
                margin-right: 70%;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#Video02 .media{
                width: 65%;
                margin: auto;
                }
                }


/*================================

bg1

================================*/

#LB21S1 section#_bg {
	position: relative;
                margin: 0 calc(50% - 50vw);
                width: 100vw;
                overflow: hidden;
                }
#LB21S1 section#_bg:before {
	content:"";
	display: block;
	padding-top: 50%;
	}
@media screen and (max-width: 1024px) {
#LB21S1 section#_bg:before {
	padding-top: 70%;
	}
                }
@media screen and (max-width: 768px) {
#LB21S1 section#_bg:before {
	padding-top: 100%;
	}
                }
#LB21S1 section#_bg #_content {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	}

#LB21S1 section#_bg #_content ._imgBox{
                width: 100%;
                height: 120%;
	background-position: center top;
	background-repeat: no-repeat;
	background-size: cover;
	}

#LB21S1 section#_bg._bg1 #_content ._imgBox{
	background-position: top center;
	background-repeat: no-repeat;
	background-image: url(../images/bgspark1.jpg);
	background-size: cover;
	}


#LB21S1 section#_bg._bg2 #_content ._imgBox{
	background-position: top center;
	background-repeat: no-repeat;
	background-image: url(../images/bgspark2.jpg);
	background-size: cover;
	}



/*============== patternB1 ==============*/

#LB21S1 #looks section#patternB1 {
                position: relative;
                width: 100%;
                display: flex;
                align-items: center;
                justify-content: center;
                flex-wrap: nowrap;
                flex-direction: row;
                pointer-events: none;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternB1 {
                margin-top: 0 !important;
                align-items: flex-start;
                width: 100%;
                }
                }

#LB21S1 #looks section#patternB1 .media{
                position: relative;
                width: 45%;
                height: auto;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternB1 .media{
                width: 80%;
                }
                }


/*============== Video03 ==============*/

#LB21S1 #looks section#Video03{
                z-index: 1;
                }

#LB21S1 #looks section#Video03 .media{
                width: 30%;
                height: auto;
                margin-left: 70%;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#Video03 .media{
                width: 60%;
                margin: auto;
                }
                }


/*============== patternB2 ==============*/

#LB21S1 #looks section#patternB2 {
                position: relative;
                width: 100%;
                display: flex;
                align-items: flex-start;
                justify-content: flex-end;
                flex-wrap: nowrap;
                flex-direction: row;
                pointer-events: none;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternB2 {
                width: 100%;
                }
                }

#LB21S1 #looks section#patternB2 .media{
                position: relative;
                width: 40%;
                height: auto;
                margin-left: 0;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternB2 .media{
                width: 80%;
                margin-left: 0;
                }
                }


/*============== patternB22 ==============*/

#LB21S1 #looks section#patternB22 {
                position: relative;
                width: 100%;
                display: flex;
                align-items: flex-start;
                justify-content: flex-end;
                flex-wrap: nowrap;
                flex-direction: row;
                pointer-events: none;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternB22 {
                width: 100%;
                }
                }

#LB21S1 #looks section#patternB22 .media{
                position: relative;
                width: 40%;
                height: auto;
                margin-left: 0;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternB22 .media{
                width: 100%;
                margin-left: 0;
                }
                }

#LB21S1 #looks section#patternB22 .media a .spec {
                justify-content: flex-end;
                padding-right: 2em;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternB22 .media a .spec {
                justify-content: flex-start;
                padding-right: 0;
                }
                }

/*============== patternB3 ==============*/

#LB21S1 #looks section#patternB3 {
                position: relative;
                width: 100%;
                display: flex;
                align-items: flex-start;
                justify-content: flex-start;
                flex-wrap: nowrap;
                flex-direction: row;
                pointer-events: none;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternB3 {
                width: 100%;
                justify-content: flex-start;
                }
                }

#LB21S1 #looks section#patternB3 .media{
                position: relative;
                width: 40%;
                height: auto;
                margin-left: 0;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternB3 .media{
                width: 80%;
                margin-left: 0;
                }
                }


/*============== patternB4 ==============*/

#LB21S1 #looks section#patternB4 {
                position: relative;
                width: 100%;
                display: flex;
                align-items: center;
                justify-content: center;
                flex-wrap: nowrap;
                flex-direction: row;
                pointer-events: none;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternB4 {
                margin-top: 0 !important;
                align-items: flex-start;
                width: 100%;
                }
                }

#LB21S1 #looks section#patternB4 .media{
                position: relative;
                width: 45%;
                height: auto;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternB4 .media{
                width: 100%;
                }
                }

#LB21S1 #looks section#patternB4 .media a .spec {
                justify-content: flex-end;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternB4 .media a .spec {
                justify-content: flex-start;
                }
                }


/*============== Video04 ==============*/

#LB21S1 #looks section#Video04{
                z-index: 1;
                }

#LB21S1 #looks section#Video04 .media{
                width: 30%;
                height: auto;
                margin-right: 70%;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#Video04 .media{
                width: 65%;
                margin: auto;
                }
                }


/*============== patternB5 ==============*/

#LB21S1 #looks section#patternB5 {
                position: relative;
                width: 100%;
                display: flex;
                align-items: flex-start;
                justify-content: flex-end;
                flex-wrap: nowrap;
                flex-direction: row;
                pointer-events: none;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternB5 {
                width: 100%;
                justify-content: flex-start;
                }
                }

#LB21S1 #looks section#patternB5 .media{
                position: relative;
                width: 40%;
                height: auto;
                margin-left: 0;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternB5 .media{
                width: 80%;
                margin-left: 0;
                }
                }


/*============== patternB6 ==============*/

#LB21S1 #looks section#patternB6 {
                position: relative;
                width: 100%;
                display: flex;
                align-items: flex-start;
                justify-content: flex-start;
                flex-wrap: nowrap;
                flex-direction: row;
                pointer-events: none;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternB6 {
                width: 100%;
                justify-content: center;
                }
                }

#LB21S1 #looks section#patternB6 .media{
                position: relative;
                width: 40%;
                height: auto;
                margin-left: 0;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternB6 .media{
                width: 80%;
                margin-left: 0;
                }
                }


/*============== Video05 ==============*/

#LB21S1 #looks section#Video05{
                z-index: 1;
                }

#LB21S1 #looks section#Video05 .media{
                width: 30%;
                height: auto;
                margin-left: 35%;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#Video05 .media{
                width: 65%;
                margin: auto;
                }
                }



/*============== patternC1 ==============*/

#LB21S1 #looks section#patternC1{
                z-index: 1;
                }

#LB21S1 #looks section#patternC1 .media{
                width: 30%;
                height: auto;
                margin-left: 35%;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternC1 .media{
                width: 60%;
                margin: auto;
                }
                }



/*============== patternC12 ==============*/

#LB21S1 #looks section#patternC12{
                z-index: 1;
                display: flex;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternC12{
                justify-content: flex-end;
                }
                }

#LB21S1 #looks section#patternC12 .media{
                width: 30%;
                height: auto;
                margin-left: 35%;
                }
@media screen and (max-width: 768px) {
#LB21S1 #looks section#patternC12 .media{
                width: 60%;
                }
                }