@charset "utf-8";


.company {}
.company .companyTit {padding:0 0 50px; color: #000;text-align: center;font-size: var(--fs45);font-weight: 700;line-height:1}

.company-tit {display:flex; gap:80px;}
.company-tit-img {width:600px;}
.company-tit-img img {width:100%; height:100%; object-fit:cover;}

.company-tit-txt {width:calc(100% - 620px)}
.company-tit-txt h3 {padding:0 0 47px; margin:0 0 40px; color: #000;font-size: var(--fs60);font-weight: 700; line-height:1; position:relative;}
.company-tit-txt h3:after {width:70px; height:7px; background:var(--base1); left:0; bottom:0; position:absolute; display:block; content:'';}
.company-tit-txt p {color: #000;font-size: var(--fs18);line-height: 2}
.company-tit-txt p b {font-weight:700;}
.company-tit-txt p+p {padding:40px 0 0;}

.company-vision {padding:120px 0; background:#F7F7F7;}
.company-vision-wrap {}
.company-vision-wrap h3 {}
.company-vision-list {display:flex; gap:40px;}
.company-vision-item {padding:50px 0; width:calc((100% - 120px)/4); display:flex; flex-direction:column; align-items:center; justify-content:center; border-radius: 20px;border: 1px solid #DDD; background: #FFF; text-align:center;}
.company-vision-item .icon {width:100px; height:100px; border:1px solid #ddd; border-radius:50%;}
.company-vision-item .icon img {width:100%; height:100%; object-fit:scale-down;}
.company-vision-item h4 {padding:25px 0; margin:0 0 20px; color: #000;font-size:var(--fs21);font-weight: 700;line-height:1; position:relative;}
.company-vision-item h4:after {width:30px; height:3px; background:var(--base1); left:50%; bottom:0; position:absolute; display:block; content:''; transform:translateX(-50%);}
.company-vision-item p {color:#000;}

.company-ideology {}
.company-ideology-item {display:flex;  border: 1px solid #DDD; border-radius:20px; overflow:hidden;}
.company-ideology-item+.company-ideology-item {margin:30px 0 0; flex-direction:row-reverse;}
.company-ideology-img {width:50%;}
.company-ideology-img img {width:100%; height:100%; object-fit:cover;}
.company-ideology-txt {padding:30px; width:50%; display:flex; align-items:center; justify-content:center; flex-direction:column;background: #FFF;text-align: center;}
.company-ideology-txt h4 {color: #000;font-size:var(--fs36);font-weight: 700;line-height:1.6;}
.company-ideology-txt span {padding:0 0 30px; margin:0 0 30px; display:block; position:relative; color:#999;}
.company-ideology-txt span:after {width:30px; height:3px; background:var(--base1); left:50%; bottom:0; position:absolute; display:block; content:''; transform:translateX(-50%);}
.company-ideology-txt p {font-size:var(--fs18); color:#000;}






@media (max-width: 1199px) {
	
	.company-tit {flex-direction:column; gap:40px;}
	.company-tit-txt {width:100%;}
	.company-tit-txt h3 {padding:0 0 35px; margin:0 0 30px;}
	.company-tit-txt h3:after {width:50px;height:5px;}
	.company-tit-txt p+p {padding:20px 0 0;}
	.company-tit-img {width:100%;}
	
	.company-vision {padding:80px 0;}
	.company-vision-list {gap:20px; flex-wrap:wrap;}
	.company-vision-item {padding:40px; width:calc((100% - 20px)/2);}
	.company-vision-item h4 {padding:20px 0; margin:0 0 17px;}
	
	
	
	
}

@media (max-width: 767px) {
	
	.company .companyTit {padding:0 0 40px;}
	 
	.company-tit {gap:20px;}
	.company-tit-txt h3 {padding:0 0 23px; margin:0 0 20px;}
	.company-tit-txt h3:after {width:30px;height:3px;}
	
	.company-vision {padding:40px 0;}
	.company-vision-list {gap:10px; flex-wrap:wrap;}
	.company-vision-item {padding:20px; width:calc((100% - 10px)/2);}
	.company-vision-item .icon {width:80px; height:80px; padding:20px 15px;}
	/* .company-vision-item .icon img {width:100%;} */
	.company-vision-item h4 {}
	
	.company-ideology-item {flex-direction:column !important;}
	.company-ideology-img {width:100%;}
	.company-ideology-txt {width:100%;}
	.company-ideology-txt h4 {line-height:1.2;}
	.company-ideology-txt span {padding:0 0 20px; margin:0 0 20px;}
	
	
	
}


@media (max-width: 500px) {
	.company .companyTit {padding:0 0 30px;}
	
	.company-vision-list {gap:5px; flex-wrap:wrap;}
	.company-vision-item {width:100%;}
	.company-vision-item h4 {padding:16px 0; margin:0 0 12px;}
	
	
	
	
	
	
	
	
	
	
}