/*----空間類別----*/
a:hover img{-webkit-transition: all .3s;-o-transition: all .3s;-moz-transition: all .3s;-ms-transition: all .3s;transition: all .3s;   transform: scale(1.03);}
.top_king_container{display: block; }
.top_king_container nav{display: block; background-color:#bf9964;text-align: center; top: 110px; position: fixed; width: 100%; z-index:100;}
.Layout2024 .top_king_container nav{top: 55px; }
.top_king_container nav ul{ background-color:#bf9964; display: flex; justify-content: center; flex-wrap: wrap;}
.top_king_container nav ul li{display: inline-block; padding: 0 15px;}
.top_king_container nav ul li a{line-height: 50px;color: #fff;}
.top_king_container nav ul li:hover , .top_king_container nav ul li:focus, .top_king_container nav ul li.selected{background-color: #000; color: #fff;}

/*----主視覺----*/
.top_king_visual{display: block;width: 100%;background-image:url(/images/newforces/main_visual.png);padding-bottom:26%;background-size: contain;background-repeat: no-repeat; margin-top: 50px;}
.top_king_visual.top_king_visual_72{background-image:url(/images/newforces/space_kind_72.png);}
.top_king_visual.top_king_visual_73{background-image:url(/images/newforces/space_kind_73.png);}
.top_king_visual.top_king_visual_74{background-image:url(/images/newforces/space_kind_74.png);}
.top_king_visual.top_king_visual_75{background-image:url(/images/newforces/space_kind_75.png);}
.top_king_visual.top_king_visual_76{background-image:url(/images/newforces/space_kind_76.png);}
.top_king_visual.top_king_visual_77{background-image:url(/images/newforces/space_kind_77.png);}
.top_king_visual.top_king_visual_78{background-image:url(/images/newforces/space_kind_78.png);}
.top_king_visual.top_king_visual_109{background-image:url(/images/newforces/space_kind_109.png);}

/*----內容----*/
.box{display: block;width:100%; background-image: url(/images/newforces/bg.png);background-position:30% top;margin: 0 auto;background-repeat: no-repeat;background-size: auto;}
.recommend_designer{display: block;  color: #fff; padding: 0 20px;position: relative;z-index: 99;}
.recommend_designer a {color: #c9a676;text-decoration: underline;}
.recommend_designer a:hover{color: #fff;}
.recommend_case p a {color: #fff;text-decoration:none;}
.recommend_case p a:hover , .recommend_designer_about h2 a:hover{color: #c9a676;}
.recommend_designer_inner{display:flex; max-width: 1160px; margin: 0 auto;  background-color: #20201f;box-sizing: border-box; padding: 50px;justify-content:space-between;flex-wrap: wrap;position: relative;}
.recommend_designer_about{display: block;width:28%;}
.recommend_designer_about a{display: block;text-align: center; font-weight:500; font-size: 2.5em;}
.recommend_designer_about h2 a{font-size: 2.25em;font-weight:600;line-height:1.5em;color: #fff;text-decoration:none;text-align:left;}
.about_pic{position: relative;display: block;margin-top:50px; }
.about_pic a{display: block; width: 100%; height: 100%; overflow:hidden;position: relative;margin: 0 auto;border-radius: 100%;}
.about_pic img{width: 100%;height: 100%;border-radius: 100%;}
.about_pic:before{display: block;content: ""; width:100px; height:100px; border-radius: 100%; background-color:#bf9964;position: absolute;right:0px;top: -30px;}
.recommend_case{width:65%;margin-top:10px;}
.case_img a , .project_img { display: block; width: 100%; height: 0;padding-bottom: 66.6%;position: relative;overflow: hidden;margin-bottom: 10px;}
.case_img a img , .project_items img {display: block;max-width: 100%; max-height: 100%; position: absolute;  top: 0;  right: 0;  left: 0;  margin: auto;}
.recommend_case>a{ display: block;text-align: end; margin-top: 20px;}
.recommend_designer strong{display:inline-block;color:#fff;position:relative;left: 50%; margin-left:-530px;  margin-top: 50px;margin-bottom: 10px;font-size: 2.25em;font-weight:600;}

/*----其他設計師----*/
.other_designer{display: flex;max-width: 1200px; margin: 0 auto; margin-top:50px;flex-wrap: wrap;position: relative;background-color: #fff;margin-bottom:80px;}
.project_items{width: 30%;margin: 20px;position: relative;}
.designer_img{ display: block; position: absolute;width: 120px;height: 120px; border-radius: 100%;overflow: hidden; top: 170px;right: 10px;box-shadow: 4px 4px 5px rgb(0 0 0 / 50%);}
.project_items h3{display: block; width: 62%; font-size: 1.25em; font-weight: 500;}
.project_btn {    display: block;    text-align: center;position: relative; margin-top: 50px;}
.project_btn a {display: inline-block;width: 100px;height: 40px;line-height: 40px;margin: 15px;border: 1px solid #bf9964;color:#bf9964;
border-radius: 20px;}
.project_btn a:hover{background-color:#bf9964; color:#fff;}

@media (min-width:320px) and (max-width:1366px) {
	.IsWeb .container.content{padding-top:50px;}
	.box{background-position:68% top;}
	.recommend_designer strong{ left: 0; margin-left:123px;}
	}

@media (min-width:320px) and (max-width:1300px) {
	.IsWeb .container.content{padding-top:50px;}
	.recommend_designer_about h2 a{font-size:1.87em;text-align: left;}
	.recommend_designer_about a{font-size:1.87em;}
	.project_items{width:46%;}
}

@media (min-width:768px) and (max-width:1024px) {
	.top_king_visual { margin-top:0; }
	.top_king_container nav { position: unset;}
	.recommend_designer strong{margin-left: 45px;}
}

@media (min-width:320px) and (max-width:850px) {
   .box{width:100%;background-position:40% top; }
	.recommend_designer_about{width: 30%;}
    .project_items{margin:15px;}
   .recommend_designer strong{ left: 0; margin-left:50px;}
	.about_pic{margin-top: 30px;}
	.about_pic:before{width: 80px; height: 80px;top: -20px}
}

@media (min-width:320px) and (max-width:765px) {
   .box{width:100%;background-position:30% 20px; }
	.top_king_container nav { position:unset; width:auto; z-index:unset; }
	.top_king_container nav ul li{width: calc(100vw / 3); padding: 0;}
	.recommend_designer_about{width:100%;}
   .recommend_case{width:100%;margin-top: 50px;}
   .recommend_designer_about a{font-size:2.5em;}
	.about_pic:before{width:150px; height:150px;top:-20px}
    .project_items{width: 100%;}
	.top_king_visual {margin-top: 0;}
}

@media (min-width:320px) and (max-width:580px) {
    .top_king_visual{background-image:url(/images/newforces/480X260.jpg);padding-bottom:54.5%;background-size: contain;background-repeat: no-repeat;}
    .top_king_visual.top_king_visual_72{background-image:url(/images/newforces/space_kind_72_480.jpg);}
	.top_king_visual.top_king_visual_73{background-image:url(/images/newforces/space_kind_73_480.jpg);}
	.top_king_visual.top_king_visual_74{background-image:url(/images/newforces/space_kind_74_480.jpg);}
    .top_king_visual.top_king_visual_75{background-image:url(/images/newforces/space_kind_75_480.jpg);}
    .top_king_visual.top_king_visual_76{background-image:url(/images/newforces/space_kind_76_480.jpg);}
    .top_king_visual.top_king_visual_77{background-image:url(/images/newforces/space_kind_77_480.jpg);}
    .top_king_visual.top_king_visual_78{background-image:url(/images/newforces/space_kind_78_480.jpg);}
    .top_king_visual.top_king_visual_109{background-image:url(/images/newforces/space_kind_109_480.jpg);}
	
    .box{background-image: none; }
    .recommend_designer strong{display: none;}
    .recommend_designer_about h2 a{font-size:1.5em;}
    .recommend_designer_inner{margin-top: 20px;}
    .recommend_designer_about a{font-size: 1.625em;}
	.about_pic:before{width:100px; height:100px;top:-15px;}
    }

@media (min-width:320px) and (max-width:412px) {
.about_pic:before{width:90px; height:90px;top:-20px;}	
	
}

@media (min-width:320px) and (max-width:375px) {
  .project_items h3{width: 55%;}
   .recommend_designer_inner{padding:30px;}
  .about_pic:before{width:70px; height:70px;top:-20px;}
}