/* company */
#wrapper h3 { margin-bottom:40px; line-height:1; text-transform:uppercase; color:var(--grey-dark-color); font-weight:800; letter-spacing:0; }

#company .con-box { display:flex; position: relative; margin-left:-10px; margin-right:-10px; }
#company .com-menu-img > a { position: relative; flex:1; width:50%; height: 450px; margin:0 10px; padding:62px 70px; color:#fff; overflow:hidden; }
#company .com-menu-img > a > img { position: absolute; left: 0; top: 0; width:100%; height:110%; transition: 0.8s cubic-bezier(0.2, 0.8, 0.2, 1); }
#company .com-menu-img > a > h4 { position: relative; display:inline-block; font-weight:700; padding-right:30px; z-index:2; }
#company .com-menu-img > a > h4 > .ico-plus { display:inline-block; margin-left:10px; width:20px; height:20px; background-image:url('/theme/theme002/images/ico_plus.png'); background-position:right center; background-repeat:no-repeat; transition: all 0.3s; z-index:2; }
#company .com-menu-img > a:before { opacity:0; content:""; position: absolute; top: 0; height: 100%; left: 0; width: 100%; z-index: 1; background: rgba(0,0,0,0.5); } 
#company .com-menu-img > a > p { position: absolute; bottom: -65px; line-height:28px; font-weight:500; z-index:2; }
/*#company .com-menu-img > a:hover > h4 > .ico-plus { transition: all 0.3s; transform: rotate(180deg); }*/
#company .com-menu-img > a:hover { box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.5); }
#company .com-menu-img > a:hover > img { transform: translateY(-10px); }
#company .com-menu-img > a:hover:before { transition: all 0.5s; opacity:1; }
#company .com-menu-img > a:hover > p { transition: all 0.5s; bottom: 65px; }
#company .com-menu-ico { padding:50px 0 10px; }
#company .com-menu-ico > dl { flex:1; width:25%; height:176px; border-left:1px solid var(--border-color); }
#company .com-menu-ico > dl:first-child { border-left:0; }
#company .com-menu-ico > dl > dt a { display:block; height:98px; background-repeat:no-repeat; background-position:bottom center; }
#company .com-menu-ico > dl:nth-of-type(1) > dt > a { background-image:url('/theme/theme002/images/ico_company.png'); }
#company .com-menu-ico > dl:nth-of-type(1) > dt > a:hover { background-image:url('/theme/theme002/images/ico_company_hover.png'); }
#company .com-menu-ico > dl:nth-of-type(2) > dt > a { background-image:url('/theme/theme002/images/ico_business.png'); }
#company .com-menu-ico > dl:nth-of-type(2) > dt > a:hover { background-image:url('/theme/theme002/images/ico_business_hover.png'); }
#company .com-menu-ico > dl:nth-of-type(3) > dt > a { background-image:url('/theme/theme002/images/ico_product.png'); }
#company .com-menu-ico > dl:nth-of-type(3) > dt > a:hover { background-image:url('/theme/theme002/images/ico_product_hover.png'); }
#company .com-menu-ico > dl:nth-of-type(4) > dt > a { background-image:url('/theme/theme002/images/ico_location.png'); }
#company .com-menu-ico > dl:nth-of-type(4) > dt > a:hover { background-image:url('/theme/theme002/images/ico_location_hover.png'); }
#company .com-menu-ico > dl > dd > h5 > a { display:block; height:82px; line-height:82px; font-weight:700; color:var(--grey-dark-color); text-align:center; }

@media screen and (max-width:480px) {
	#company .con-box { flex-direction: column; margin:0; margin-top:-20px; overflow: hidden; }
	#company .con-box:nth-of-type(2) { flex-direction: inherit; }
	#company .com-menu-img > a { width: 100%; height: auto; padding: 35px 30px; padding-bottom: 45%; margin:0; margin-top:20px }
	#company .com-menu-img > a > h4 {  }
	#company .com-menu-img > a > h4 > .ico-plus { width: 15px; height: 15px; background-size: cover; }
	#company .com-menu-img > a > p { bottom: -65px; line-height: 22px; }
	#company .com-menu-img > a:hover > p { bottom: 30px; left:30px; right:30px; }

	#company .com-menu-ico { padding:50px 0 0px; }
	#company .com-menu-ico > dl { height: 75px; border-left:0; }
	#company .com-menu-ico > dl > dt { text-align:center; }
	#company .com-menu-ico > dl > dt a { display:inline-block; width: 40px; height: 40px; background-position: center center; background-size: contain; }
	#company .com-menu-ico > dl > dd > h5 > a { height: 35px; line-height: 35px;  }

}

@media screen and (max-width:380px) {
	#company .com-menu-img > a > h4 {  }
	#company .com-menu-img > a > p { word-break: break-all;  line-height: 18px; }
	#company .com-menu-img > a > p > br { display:none; }
}


/* project */
#project { overflow:hidden; height:350px; background-attachment: fixed; background-image: url('/theme/theme002/images/project_bg.jpg'); background-size:cover; background-position:center center; }
#project > .container { display:flex; align-items: center; height: 100%; }
#project > .container > p { flex:1; display:inline; }
#project > .container > p:nth-of-type(1) { font-weight:700; color:#72b1eb; }
#project > .container > p:nth-of-type(1) > span { display:block; padding-top:18px; font-weight:400; color:#fff; line-height:28px; }
#project > .container > h3 { font-weight:800; letter-spacing:0; color:#fff; text-align:right; }

@media screen and (max-width:480px) {
	#project { height: 260px; }
	#project > .container { flex-direction: column; align-items: flex-start; }
	#project > .container > p:nth-of-type(1) {  }
	#project > .container > p:nth-of-type(1) > span {  line-height:22px; padding-top:18px; } 
	#project > .container > p:nth-of-type(2) { width: 100%; margin-top: 15px;  text-align: left; }
}

/* customer */
#customer { overflow:hidden; background:#f8f8f8; }
#customer .customer-wrap { display:flex; margin-left:-10px; margin-right:-10px; }
#customer .customer-wrap .con-box { flex:1; width:50%; margin:0 10px; }
#customer .customer-wrap .con-box > div > h5 { font-weight:700; color:var(--grey-dark-color); margin-bottom:5px; }

#customer .customer-wrap .con-box a.arrow { position: absolute; top: 50px; right: 70px; width: 13px; height: 13px; margin-bottom:30px; }
#customer .customer-wrap .con-box a.arrow::before, 
#customer .customer-wrap .con-box a.arrow::after { content: ''; position: absolute; }
#customer .customer-wrap .con-box a.arrow::before { width: 100%; height: 100%; border-top: 2px solid var(--line-color); border-left: 2px solid var(--line-color); border-right:0; border-bottom:0; }
#customer .customer-wrap .con-box a.arrow::after { left: 0.2px; width: 31px; height: 2px; background: var(--line-color); transform-origin:0 100%; transform: rotate(45deg); }
#customer .customer-wrap .con-box a.arrow:hover::before { border-top: 2px solid var(--main-color); border-left: 2px solid var(--main-color); }
#customer .customer-wrap .con-box a.arrow:hover::after { background: var(--main-color); }

#customer .customer-wrap .con-box a.arrow-left { transform: rotate(-45deg); }
#customer .customer-wrap .con-box a.arrow-right { transform: rotate(135deg); }
#customer .customer-wrap .con-box a.arrow-top { transform: rotate(45deg); }
#customer .customer-wrap .con-box a.arrow-bottom { transform: rotate(225deg); }

#customer .customer-wrap .bo-menu > div { position: relative; display: inline-block; width: 100%; height:113px; margin:8px 0; padding:23px 70px; background:#fff; }

#customer .customer-wrap .bo-list:nth-of-type(2) > div { position: relative; margin:8px 0; padding:59px 70px; height: calc(100% - 16px); background:#fff; }
#customer .customer-wrap .bo-list ul { width:100%; margin-top:15px; }
#customer .customer-wrap .bo-list li { height:38px; padding-left:14px; background-image: url('/theme/theme002/images/ico_square.png'); background-repeat:no-repeat; background-position:left center; }
#customer .customer-wrap .bo-list li > a { display: inline-block; width: 100%; line-height:38px; color:#555; font-weight:400; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#customer .customer-wrap .bo-list > div > a.arrow { top: 70px; }

@media screen and (max-width:480px) {
	#customer .customer-wrap { flex-direction: column; margin-left: 0px; margin-right: 0px; }
	#customer .customer-wrap .con-box { width:100%; margin:0 0px; }
	#customer .customer-wrap .con-box > div > h4 {  }
	#customer .customer-wrap .con-box a.arrow { top:30px; right: 30px; }
	#customer .customer-wrap .bo-menu > div { height: 100px; padding:23px 30px; }
	#customer .customer-wrap .bo-list:nth-of-type(2) > div { padding: 29px 30px; }
	#customer .customer-wrap .bo-list > div > a.arrow { top: 38px; }
	#customer .customer-wrap .bo-list li,
	#customer .customer-wrap .bo-list li > a { height: 24px; line-height:24px; }
	#customer .customer-wrap .bo-list li > a { display: inline-block; width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
}

/* PRODUCT */
#product { overflow:hidden; background:#fff; }

#product > .container > .swiper { /*width: 100%; height: 594px;*/ margin-left: -10px; margin-right: -10px }
#product > .container > .swiper > .swiper-wrapper { flex-direction: inherit; }
#product > .container > .swiper > .swiper-wrapper > .swiper-slide { /* Center slide text vertically */ display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; background: #fff; height: calc((100% - 20px) / 2) !important; /*height: 277px;*/ text-align: center; }
#product > .container > .swiper > .swiper-wrapper > .swiper-slide { /*background-repeat:no-repeat; background-position:center center; background-size: cover;*/ }

#product .product > .swiper-wrapper > .swiper-slide { padding:10px; }
#product .product > .swiper-wrapper > .swiper-slide > a { display:block; width: 100%; }
#product .product > .swiper-wrapper > .swiper-slide > a > img { width:100%; height:auto; }
#product .product > .swiper-wrapper > .swiper-slide > a > .caption { display: none; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.2); color: #fff; }
#product .product > .swiper-wrapper > .swiper-slide > a > .caption > strong { position: absolute; bottom: 28px; left: 30px; font-weight:500; }
#product .product > .swiper-wrapper > .swiper-slide > a:hover > .caption { display: block; -webkit-animation-delay: 1s; animation-delay: 1s; }

@media screen and (max-width:480px) {
	#product > .container {  }
	#product > .container > .swiper { margin-left: -5px; margin-right: -5px }
	#product > .container > .swiper > .swiper-wrapper > .swiper-slide { padding:5px; }
	#product > .container > .swiper > .swiper-wrapper > .swiper-slide > a > img { width:100%; height:auto; }
	#product .product > .swiper-wrapper > .swiper-slide > a > .caption > strong { left:0px; width:100%; padding:0 10px; text-align:center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
}

/*	VIDEO */
#video { overflow:hidden; background-image:url('/theme/theme002/images/video_bg.jpg'); background-repeat:no-repeat; background-position:center center; background-size: cover; }
#video .video-wrap { display: flex; margin:0; align-items: center; }
#video .video-wrap > .player { flex:1; position: relative; width: 700px; margin:0; /*padding-bottom: 56.25%;*/ padding-bottom: 28.125%; height: 0; overflow: hidden; }
#video .video-wrap > .player > iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
#video .video-wrap > .txt { flex:1; margin:0; width: 470px; }
#video .video-wrap > .txt > div { padding-left:139px; background:transparent; }
#video .video-wrap > .txt > div h4 { margin-bottom:20px; font-weight:700; color:var(--grey-dark-color); }
#video .video-wrap > .txt > div a { display:inline-block; width:180px; height:50px; margin-top:40px; line-height:50px; background: var(--main-color); color:#fff; text-align:center; }

@media screen and (max-width:480px) {
	#video .container {  }
	#video .video-wrap { flex-direction: column; }
	#video .video-wrap > .player,
	#video .video-wrap > .txt { width:100%; }
	#video .video-wrap > .player { padding-bottom: 56.25%; }
	#video .video-wrap > .txt > div { padding-left: 0px; margin-top:20px; text-align:left; }
	#video .video-wrap > .txt > div h4 { margin-bottom: 5px; }
	#video .video-wrap > .txt > div p { }
	#video .video-wrap > .txt > div a { width: 120px; height: 30px; line-height:30px; margin-top: 15px; }
	
	
	
}