.container{
    width: 1000px;
    margin:48px auto;
}
.container>.title{
    text-align: center;
    padding: 16px;
    font-size: 1.8rem;
}
.container>.sub-title{
    text-align: center;
    padding: 16px;
    font-size: 1rem;
}
.container>.title>.eng{
    font-size: 1.4rem; 
}
.container-flex-box{
    display: flex;
}
.container-flex-box>.content{
    display: flex; 
    flex-direction: column;
}

.content-img{
    text-align: center;
}
.content-img img{
    width: 200px;
}
.content-text{
    flex-grow: 1;
    padding: 16px;
}
.content-text>.title{
    padding: 8px 0;
    text-align: center;
}
.content-text>.text{
   font-size: .9rem;
   line-height: 1.6rem;
   color:#333;
   text-align: center;
}

.flex-box{
    display: flex;
}
.flex-box .text{
   background: #222;
   color:rgb(236, 236, 236);
   padding: 36px 20px 0 20px;
   letter-spacing: 2px;
   line-height: 20px;
}
.flex-box .text:hover,.flex-box img:hover{
    transform: scale(1.05,1.05);
    transform-origin: 50% 50%;
    box-shadow: 0 0 4px 4px rgb(70, 70, 70);
    transition: .3 all;
}
.flex-box .text .title{
    font-size: 1rem;
}
.flex-box .text .content{
    margin-top:16px;
    font-size: .6rem;
}
.flex-box>img{
    height: min-content;
}
.flex-2{
    width:28.571%
}
.flex-1{
    width:14.286%
}

.devide{
    position: relative;
    width: 100%;
   
}
.devide.bk1{
    background-image: url(./../images/production/devide.bk1.jpg);
}
.devide.bk2{
    background-image: url(./../images/production/devide.bk2.jpg);
}
.devide >.container{
    margin: auto;
    padding: 32px;
}
.devide>.title{
    padding: 32px;
}
.devide .container-flex-box{
    flex-wrap: nowrap;
}
.devide .container-flex-box .content{
    margin:16px;
}
.devide .container-flex-box .content-img img{
    width: 100%;
}
.devide .container-flex-box .content-text{
    padding: 0;
}
.devide .detail-box{
    display: flex;
    justify-content: space-between;
    padding: 16px;
    font-size: .8rem;
}
.devide .detail-box li{
    padding: 8px 0;
}