@Charset "utf-8";
@import url("common.css");

.t36 {font-size:36px; color:#313131;}


#gallery {padding:70px 0 50px; overflow:hidden;}
#gallery .gallery {position:relative; max-width:1400px; margin:0 auto;}
/* #gallery .gallery .list {display:flex; margin-top:60px; overflow:hidden;} */
/* #gallery .gallery .list .item {width:23%; margin-right:2%; margin-bottom:30px; overflow:hidden;} */
#gallery .gallery .list {margin-top:60px; overflow:hidden;}
#gallery .gallery .list .item {padding:0 10px; margin-bottom:30px; box-sizing:border-box; overflow:hidden;}
#gallery .gallery .list .item:nth-last-child(1) {margin-right:0}
#gallery .gallery .list .item .img {display:block; height:auto;}
#gallery .gallery .list .item .img img {width:100%; height:100%; min-height:240px; max-height:380px; object-fit:cover;}
#gallery .gallery.v2 .list .item .img img {width:100%; height:240px; object-fit:cover;}
#gallery .gallery .list .item .title {display:block; font-size:20px; font-weight:500; color:#313131; margin-top:20px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
#gallery .gallery .list .item .text {display:block; font-size:18px; color:#9e9e9e; margin-top:10px;}
#gallery .gallery .more {position:absolute; top:0; right:10px;}
#gallery .gallery .more a {font-size:32px; color:#313131; font-weight:100;}
#gallery .gallery .more2 {position:absolute; top:10px; right:10px; display:flex; align-items:center; cursor:pointer;}
#gallery .gallery .more2 span {display:none; cursor:pointer;}

#gallery .gallery .slick-prev {position:absolute; top:0; right:0; z-index:10; width:0; height:0; font-size:0; border:0; cursor:pointer;}
#gallery .gallery .slick-next {position:absolute; top:0; right:0; z-index:10; width:0; height:0; font-size:0; border:0; cursor:pointer;}



@media only screen and (max-width:1000px) {
	#gallery {padding:40px 0;}
	#gallery .gallery .more {right:30px;}
	#gallery .gallery .more2 span {display:block;}
/* 
	#gallery .gallery .list {flex-wrap:wrap;}
	#gallery .gallery .list .item {width:48%;}
	#gallery .gallery .list .item:nth-child(2) {margin-right:0}
 */
}
 
@media only screen and (max-width:600px) {
	#gallery .gallery .more {right:50px;}
	#gallery .gallery .list  {padding-right:80px;}
	#gallery .gallery .slick-list {overflow:visible;}

}

#qlink {background:#2b2b2b; padding:0 3%; overflow:hidden;}
#qlink .qlink {display:flex; justify-content:space-around; align-items:center; max-width:1400px; margin:100px auto 100px;}
#qlink .qlink .title {font-size:100px; font-weight:100; color:#505050; line-height:1;}
#qlink .qlink .list {display:flex; flex-wrap:wrap; width:600px; border-top:1px solid #595959; border-right:1px solid #595959;}
#qlink .qlink .list a {display:flex; justify-content:space-between; flex-direction:column;}
#qlink .qlink .list a {width:33.3%; height:200px; padding:15px 20px; font-size:18px; font-weight:300; color:#fff; line-height:24px; border-bottom:1px solid #595959; border-left:1px solid #595959; box-sizing:border-box;}
#qlink .qlink .list a .text {display:block; padding-right:20px; background:url("/hcm/design/layout2023/en_c/res/img/qlink_bg.png") no-repeat 100% 3px;}
#qlink .qlink .list a .bg {display:flex; align-items:center; height:80px;}

#qlink .qlink .list.v2 {width:100%; flex-wrap:nowrap; justify-content:space-between; border:none;}
#qlink .qlink .list.v2 a {width:200px; margin:0 1%; border:1px solid #595959;}


@media only screen and (max-width:1000px) {
	#qlink .qlink {display:block; margin:30px auto;}
	#qlink .qlink .title {font-size:50px;}
	#qlink .qlink .title br {display:none;}
	#qlink .qlink .list {width:100%; margin-top:30px;}
	#qlink .qlink .list.v2 {flex-wrap:wrap; justify-content:flex-start;}
	#qlink .qlink .list.v2 a {width:31.3%; margin:0 1% 20px;}

}
@media only screen and (max-width:700px) {
	#qlink .qlink .list a {width:50%; height:auto;}
	#qlink .qlink .list.v2 a {width:48%; margin:0 1% 10px;}

}