.company .sec {
	padding: 120px 0;
}
.company .sec > .inner {
	gap: 100px;
}


.company .sec01 .box {
	padding: 100px 120px 80px;
	background: #F8F8F8 url("../images/company_img1.png")no-repeat 100% 100%;
	gap: 60px;
	box-sizing: border-box;
}
.company .sec01 .box h4 {
	font-size: 40px;
	font-weight: 700;
	line-height: 1.2;
}
.company .sec01 .box .cont {
	font-size: 20px;
	line-height: 1.2;
	padding-right: 30%;
    box-sizing: border-box;
}
.company .sec01 .box .sign_box {
	gap: 16px;
	padding: 0 20px;
	box-sizing: border-box;
}
.company .sec01 .box .sign_box strong {
	font-size: 24px;
	font-weight: 500;
	line-height: 1.4;
}
.company .sec01 .box .sign_box p {
	font-size: 20px;
	font-weight: 500;
	line-height: 1.4;
	gap: 20px;
}
.company .sec01 .box .sign_box p img {
	mix-blend-mode: darken;
}


.company .sec02 {
	background: #F7F7F7;
	padding: 120px 0;
}
.company .sec02 .road_map .swiper-slide {
	width: auto;
}
.company .sec02 .road_map .year {
	position: relative;
	display: block;
	font-size: 36px;
	font-weight: 700;
	margin-bottom: 16px;
}
.company .sec02 .road_map .line {
	position: relative;
}
.company .sec02 .road_map .line:before {
	content: '';
	position: absolute;
	top: 10px;
    left: 11px;
	display: block;
	width: 100%;
	border-bottom: 1px dashed var(--text);
}
.company .sec02 .road_map .line:after {
	content: '';
	position: absolute;
	top: 10px;
    left: 11px;
	display: block;
	height: 42px;
	border-right: 1px dashed var(--text);
}
.company .sec02 .road_map .line span {
	position: absolute;
	top: 0;
	left: 1px;
	display: block;
	width: 20px;
	height: 20px;
	background: var(--key-color);
	border-radius: 50%;
	z-index: 1;
}
.company .sec02 .road_map .cont {
    position: relative;
	margin-top: 80px;
}
.company .sec02 .road_map .cont ul {
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
	gap: 30px;
}
.company .sec02 .road_map .cont ul li {
    position: relative;
	font-size: 20px;
	padding-right: 10px;
	box-sizing: border-box;
}
.company .sec02 .road_map .cont ul li strong {
	width: 40px;
	font-weight: 700;
	color: var(--text);
}
.company .sec02 .road_map .cont ul li p {
	flex: 1;
	width: 100%;
}


.company .sec03 .grid {
	gap: 50px;
}
.company .sec03 .grid > div {
	width: calc(33.333% - 34px);
	gap: 30px;
}
.company .sec03 .grid > div .img_box {
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.35);
}
.company .sec03 .grid > div .img_box .btn_color {
	padding: 16px 10px;
	font-size: 20px;
	box-sizing: border-box;
}
.company .sec03 .grid > div .img_box .img img {
	width: 100%;
}
.company .sec03 .grid > div .txt_box {
	gap: 16px;
}
.company .sec03 .grid > div .txt_box > strong {
	font-size: 24px;
	font-weight: 700;
	line-height: 1.2;
}
.company .sec03 .grid > div .txt_box .list_flex {
	color: var(--text);
	line-height: 1.4;
}
.company .sec03 .grid > div .txt_box .list_flex > div {
	gap: 5px;
}
.company .sec03 .grid > div .txt_box .list_flex > div p {
	flex: 1;
}


.company .sec04 .map_box {
	gap: 80px;
}
.company .sec04 .map_box .box {
	padding: 60px;
	background: #F8F8F8;
	gap: 30px;
	box-sizing: border-box;
}
.company .sec04 .map_box .box .top {
	gap: 16px;
}
.company .sec04 .map_box .box .top .country {
	gap: 16px;
}
.company .sec04 .map_box .box .top .country .flag {
	width: 70px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.25);
}
.company .sec04 .map_box .box .top .country .flag img {
	width: 100%;
}
.company .sec04 .map_box .box .top .country h4 {
	font-size: 36px;
}
.company .sec04 .map_box .box .top .country p {
	font-size: 24px;
	font-weight: 500;
}
.company .sec04 .map_box .box .top .info {
	font-size: 20px;
	gap: 14px;
	text-transform: capitalize;
}
.company .sec04 .map_box .box .top .info > div {
	gap: 20px;
}
.company .sec04 .map_box .box .location {
	position: relative;
	width: 100%;
	height: 370px;
	overflow: hidden;
}
.company .sec04 .map_box .box .location iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}





@media screen and (max-width: 1240px) {
	.company .sec01 .box {
    	padding: 100px 60px 80px;
		background-position: calc(100% - -120px) 100%;
	}

	.company .sec04 .map_box .box {
    	padding: 40px;
	}
}
@media screen and (max-width: 1024px) {
	.company .sec {
		padding: 80px 0;
	}
	.company .sec > .inner {
		gap: 50px;
	}


	.company .sec01 .box {
        padding: 60px 40px 40px;
        background-position: calc(100% - -125px) 100%;
        background-size: 500px;
		gap: 30px;
    }
	.company .sec01 .box h4 {
    	font-size: 28px;
	}
	.company .sec01 .box .cont {
    	font-size: 16px;
		padding-right: 20%;
	}
	.company .sec01 .box .sign_box {
		padding: 0 10px;
	}
	.company .sec01 .box .sign_box strong {
    	font-size: 18px;
	}
	.company .sec01 .box .sign_box p {
    	font-size: 16px;
		gap: 12px;
	}
	.company .sec01 .box .sign_box p img {
		width: 90px;
	}


	.company .sec02 .road_map .year {
		font-size: 24px;
	}
	.company .sec02 .road_map .cont ul {
		gap: 20px;
	}
	.company .sec02 .road_map .cont ul li {
		font-size: 16px;
	}
	.company .sec02 .road_map .cont ul li strong {
    	width: 28px;
	}


	.company .sec03 .grid {
		gap: 40px 25px;
	}
	.company .sec03 .grid > div {
		width: calc(33.333% - 17px);
		gap: 20px;
	}
	.company .sec03 .grid > div .img_box .btn_color {
		font-size: 16px;
	}
	.company .sec03 .grid > div .txt_box > strong {
    	font-size: 20px;
	}


	.company .sec04 .map_box .box {
        padding: 30px;
    }
	.company .sec04 .map_box .box .top .country {
		gap: 10px;
	}
	.company .sec04 .map_box .box .top .country .flag {
    	width: 50px;
	}
	.company .sec04 .map_box .box .top .country h4 {
		font-size: 24px;
	}
	.company .sec04 .map_box .box .top .country p {
		font-size: 20px;
	}
	.company .sec04 .map_box .box .top .info {
		flex: 1;
		width: 100%;
		font-size: 16px;
	}
	.company .sec04 .map_box .box .top .info > div {
		gap: 10px;
	}
	.company .sec04 .map_box .box .location {
		height: 280px;
	}
}
@media screen and (max-width: 768px) {
	.company .sec > .inner {
        gap: 30px;
    }

	.company .sec01 .box {
        padding: 40px 20px 170px;
		background-position: calc(100% - -70px) 100%;
        background-size: 325px;
	}
	.company .sec01 .box h4 {
        font-size: 22px;
    }
	.company .sec01 .box .cont {
		padding-right: 0;
	}
	.company .sec01 .box .sign_box {
		gap: 8px;
		padding: 0 5px;
	}
	.company .sec01 .box .sign_box strong {
        font-size: 16px;
    }
	.company .sec01 .box .sign_box p {
        font-size: 14px;
        gap: 8px;
    }
	.company .sec01 .box .sign_box p img {
        width: 80px;
    }


	.company .sec02 .road_map .year {
        font-size: 20px;
    }


	.company .sec03 .grid > div {
		width: 100%;
	}


	.company .sec04 .map_box {
		gap: 30px;
	}
	.company .sec04 .map_box .box {
        padding: 20px 10px 10px;
		gap: 20px;
    }
	.company .sec04 .map_box .box .top .country .flag {
        width: 40px;
    }
	.company .sec04 .map_box .box .top .country h4 {
        font-size: 20px;
    }
	.company .sec04 .map_box .box .top .country p {
        font-size: 16px;
    }
	.company .sec04 .map_box .box .top .info {
		flex: none;
		gap: 7px;
	}
	.company .sec04 .map_box .box .location {
        height: 230px;
    }
}
@media screen and (max-width: 480px) {
	.company .sec01 .box {
        padding: 40px 20px 250px;
	}

	.company .sec03 .grid > div .txt_box {
		gap: 10px;
	}
	.company .sec03 .grid > div .txt_box > strong {
        font-size: 18px;
    }
}
@media screen and (max-width: 380px) {
}