@import url("sub.css");



/* DEVELOPMENT */
.development_product{overflow: hidden;}
.development_product .fs38{padding: 40px 0 0;}
.development_product .fs16{padding: 30px 0 0;}
.development_product .fs16 br{display: block;}
.development_product .development_list{padding: 25px 0 0; display: flex; justify-content: center; margin: 0 auto;}
.development_product .development_list li{margin-left: -10px; text-align:center; width: 180px; height:180px; border-radius:50%; border:1px solid var(--border); display: flex; flex-direction: column; justify-content: center; align-items: center; padding:0 10px; box-sizing:border-box;}
.development_product .development_list li:first-child{margin-left: 0;}
.development_product .development_list li img{width:auto; height:48px; margin: 0 auto 5px;}
.development_product .development_list li .fs16{padding: 0;}
.development_product .development_list li .fs16 br{display: block;}

.development_fresh{overflow: hidden;}
.development_fresh dl{display: flex;}
.development_fresh dl dt{width: 50%; text-align:center;}
.development_fresh dl dt .img{aspect-ratio:1/1; width: 545px; height:545px; margin:0 auto; position: relative;}
.development_fresh dl dt .img:after{content:''; display:block; width:100%; height:100%; background:url("../images/curve_text_423fff46.png") no-repeat center/100% auto; position:absolute; left:-60px; top:-35px; animation:rota 15s linear infinite;}
.development_fresh dl dt img{display: block; width: 100%; height:100%; object-fit:cover; border-radius:50%;}
.development_fresh dl dd{width: 50%; padding: 0 0 0 50px; box-sizing:border-box; display: flex; flex-direction: column; justify-content: center;}
.development_fresh dl dd .fs16{padding: 20px 0 0;}


.development_design{}
.development_design .img_box{margin: 0 0 40px;}
.development_design .fs16{padding: 0 0 30px;}
.development_design .fs16:last-child{padding: 0;}
.development_design .fs16 br{display: block;}

.development_sales{background:url("../images/development_sales.jpg") no-repeat center/cover;}
.development_sales .fs60{color:var(--white);}
.development_sales .fs32{color:var(--white);}
.development_sales .fs38{color:var(--white); padding: 5px 0 0;}
.development_sales .fs16{color:rgba(255,255,255,.6); padding: 20px 0 0;}
.development_sales .fs23{color:var(--white);}
.development_sales dl{margin: 60px auto 0; box-sizing:border-box; border:1px solid rgba(255,255,255,.4); border-radius:100px; display: flex; align-items:center; max-width:750px; padding: 25px 120px;} 
.development_sales dl dt{width: 52px;}
.development_sales dl dt img{width: 100%; height: auto;}
.development_sales dl dd{width: calc(100% - 52px); text-align:left; padding:0 0 0 24px; box-sizing:border-box;}




/*******************************************************************************
    @media 1500px
*******************************************************************************/
@media all and (max-width:1500px){




}

/*******************************************************************************
    @media ~1280px
*******************************************************************************/
@media all and (max-width:1300px){

/* DEVELOPMENT */
.development_product .development_list{flex-wrap:wrap; max-width:800px; margin: 10px auto 0;}
.development_product .development_list li{margin-left: -10px; margin-top: -10px;}
.development_product .development_list li:first-child{margin-left: -10px;}

.development_fresh dl dt{}
.development_fresh dl dt .img{width: 400px; height:400px;}
.development_fresh dl dt .img:after{left:-40px; top:-25px;}
.development_fresh dl dd{padding: 0 0 0 30px;}
.development_fresh dl dd .fs38 br{display:none;}


}

/*******************************************************************************
    @media  ~980px               
*******************************************************************************/
@media all and (max-width:980px){


/* DEVELOPMENT */
.development_product .fs38{padding:30px 0 0;}
.development_product .fs16{padding: 20px 0 0;}
.development_product .fs16 br{display: none;}
.development_product .development_list{padding: 20px 0 0; max-width:580px;}
.development_product .development_list li{width: 150px; height:150px;}
.development_product .development_list li img{width:auto; height:40px;}
.development_product .development_list li .fs16 br{display: none;}

.development_fresh dl dt{}
.development_fresh dl dt .img{width: 280px; height:280px;}
.development_fresh dl dt .img:after{left:-30px; top:-15px;}
.development_fresh dl dd{padding: 0 0 0 20px;}
.development_fresh dl dd .fs16{padding: 15px 0 0;}


.development_design{}
.development_design .img_box{margin: 0 0 30px;}
.development_design .fs16{padding: 0 0 20px;}


.development_sales{}
.development_sales .fs16{padding: 15px 0 0;}
.development_sales dl{margin: 40px auto 0; max-width:600px; padding: 15px 80px;} 
.development_sales dl dt{width: 48px;}
.development_sales dl dd{width: calc(100% - 48px); padding:0 0 0 20px;}




}
/*******************************************************************************
    @media 481~680px
*******************************************************************************/
@media all and (max-width:680px){

/* DEVELOPMENT */
.development_product .fs38{padding:20px 0 0;}
.development_product .fs16{padding: 12px 0 0;}
.development_product .development_list{padding: 15px 0 0; max-width:580px; margin: 5px auto 0;}
.development_product .development_list li{width: 110px; height:110px; margin-left: -5px; margin-top: -5px;}
.development_product .development_list li:first-child{margin-left: -5px;}
.development_product .development_list li img{width:auto; height:30px;}

.development_fresh dl{flex-wrap:wrap;}
.development_fresh dl dt{width: 100%;}
.development_fresh dl dt .img{width: 240px; height:240px;}
.development_fresh dl dt .img:after{left:-20px;}
.development_fresh dl dd{padding: 20px 0 0; width: 100%;}
.development_fresh dl dd .fs38{text-align:center;}
.development_fresh dl dd .fs16{padding: 10px 0 0; text-align:center;}

.development_design{}
.development_design .img_box{margin: 0 0 20px;}
.development_design .fs16{padding: 0 0 15px;}
.development_design .fs16 br{display: none;}


.development_sales{}
.development_sales .fs16{padding: 10px 0 0;}
.development_sales dl{margin: 30px auto 0; max-width:500px; padding: 10px 40px;} 
.development_sales dl dt{width: 40px;}
.development_sales dl dd{width: calc(100% - 40px); padding:0 0 0 20px;}




}
/*******************************************************************************
    @media ~480px               
*******************************************************************************/
@media all and (max-width:480px){





}
/*******************************************************************************
    @media ~360px
*******************************************************************************/
@media all and (max-width:360px){




}