@import '../head.spe.css';

/*banner part*/
.banner { position: relative;background:url('/images/aboutus/whoWeAre/banner.jpg') right center;background-size:cover;user-select:none;}
.banner .auto-box {height:650px;position:relative;}
.banner .auto-box > div { position: absolute; top:50%;margin-top:-80px; left:1%; color: #fff; text-shadow: rgba(0,0,0,0.8) 3px 3px 3px; }
.banner .auto-box > div > h6 {font-family: 'Wulkan Display Italic';font-size: 56px;font-style:italic; line-height: 2em; position: relative; font-weight:400;}


/**who we are*/
.who-we-are-1 { display: flex; padding-top: 80px;padding-bottom:80px;justify-content:space-between;overflow:hidden;}
.who-we-are-1 > div { width:49%; align-content: center; }
.who-we-are-1 > div.img {position:relative; max-width: 700px; display: block;background:url('/images/aboutus/whoWeAre/part-1.jpg') center no-repeat;background-size:cover;border-radius:0 150px 0 150px;box-shadow:rgba(0,0,0,0.5) 0 0 10px;}
.who-we-are-1 > div.txt {padding-top:100px;align-content:end;}
.who-we-are-1 > div.txt h6 { font-size: 40px; line-height: 1.2em;font-weight:400;}
.who-we-are-1 > div.txt p { font-size: 18px; line-height: 2em; margin-top: 1.5em; }

.who-we-are-4 { display: flex; justify-content: right; background: #353535; flex-direction:row-reverse;overflow:hidden;}
.who-we-are-4 > .left-part { width: 50%; padding:80px; color: #fff; align-content: center; }
.who-we-are-4 > .left-part > .cont p { font-size:18px; line-height: 2em; margin: 1em 0; }
.who-we-are-4 > .right-part { width: 50%; background: url('/images/aboutus/whoWeAre/part-4.jpg') center no-repeat;background-size:cover;border-radius:200px 0 0 200px;}

.who-we-are-5 { display: flex; padding: 80px 0;overflow:hidden;}
.who-we-are-5 > div { width: 50%; align-content: center; }
.who-we-are-5 > div.img img { max-width: 700px; display: block; width: 90%; border-radius:50px 200px 0px 200px;box-shadow:rgba(0,0,0,0.5) 0 0 10px;}
.who-we-are-5 > div.txt { padding: 0 25px; align-content:end;}

@media only screen and (max-width:1640px) {
	.banner .auto-box {height: 41vw;min-height:240px;}
	.banner .auto-box > div {margin-top:-5vw;}
	.banner .auto-box > div > h6 {font-size:3.5vw;}

	.who-we-are-1 { padding-top: 5vw;padding-bottom:5vw; }

	.who-we-are-4 > .left-part { padding: 2vw; }
	.who-we-are-4 > .left-part > .cont { width: 46vw; }
	.who-we-are-4 > .left-part > .cont p { font-size: 1.5vw; }

	.who-we-are-5 { display: flex; padding: 5vw 0; }
	.who-we-are-5 > div { width: 50%; align-content: center; }
	.who-we-are-5 > div.img img { width: 95%; }
}
@media only screen and (max-width:768px){
	.banner .auto-box > div > h6 {font-size:22px;text-indent:20px;}

	.who-we-are-1 {padding-top:28px;padding-bottom:28px;display:block;}
	.who-we-are-1 > div {width:100%;}
	.who-we-are-1 > div.img {width:95%;height:300px;overflow:hidden;margin:0 auto;border-radius:20px 100px 20px 100px;}
	.who-we-are-1 > div.img img {width:100%;margin-top:-80px;}

	.who-we-are-1 > div.txt {padding:15px;}
	.who-we-are-1 > div.txt h6 {font-size:18px;}
	.who-we-are-1 > div.txt p {font-size:14px;}


	.who-we-are-4 {display:block;}
	.who-we-are-4 > .right-part {width:100%;height:60vw;border-radius:0;}
	.who-we-are-4 > .left-part {width:100%;z-index:1;padding:0;align-content:center;}
	.who-we-are-4 > .left-part > .cont {width:100%;height:auto;padding:15px;}
	.who-we-are-4 > .left-part > .cont p {font-size:14px;}



	.who-we-are-5 {display:block;margin-top:30px;}
	.who-we-are-5 > div {width:100%;}
	.who-we-are-5 > div.img img {height:300px;border-radius:20px 100px 20px 100px;margin:0 auto;}

	.who-we-are-5 > div.txt {padding:15px;}
	.who-we-are-5 > div.txt h6 {font-size:18px;}
	.who-we-are-5 > div.txt p {font-size:14px;}
}
@media only screen and (max-width:560px){
	.banner .auto-box > div {margin-top:-28px;}
}