.colour_mine .e_container {
    display: flex;
    flex-wrap: wrap;
    height: 308px;
    width: 100%;
    box-sizing: border-box;
    overflow-y: auto;
        padding: 10px;
}
.colour_mine .e_container .sat_pit {
    
        display: flex;
    width: 100%;
    flex-wrap: wrap;
    height: max-content;
}
/*
.conts .colour_mine {
    
    display: none;
}

*/
.conts .colour_mine.color_act {
    
    display: block!important;
}


.colour_mine {
    position: relative;

}

.colour_mine .c_image {

    width: 100%;
    max-height: 800px;
    height: 800px;

}

.colour_mine .c_image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.colour_mine .p_item {
      width: 6.3%;
    height: 0px;
    padding-bottom: 6.3%;
    overflow: hidden;
    position: relative;
    margin-right: 1.48%;
    margin-bottom: 20px;
    border-radius: 11px;
    border: solid 2px #ffffff;
    transition: all 0.4s;
    cursor: pointer;
}
.colour_mine .p_item:nth-child(13n) {
    margin-right: 0%;
    
}
.colour_mine .p_item .jn_col {
  width: 100%;
    height: 100%;
    overflow: hidden;
    position: absolute;
    transition: all 0.4s;
}

.colour_mine .p_item .jn_col img {
    width: 105%;
    height: 105%;
    object-fit: cover;
}

.colour_mine .p_item .e_jn_tex {
    position: absolute;
    text-align: center;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    white-space: nowrap;
    color: #fff;
    color: #ffffff;
    opacity: 0;
    transition: all 0.4s;
        text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
}

.colour_mine .e_container .p_item:hover {

    transform: scale(1.08);
}

.colour_mine .e_container .p_item:hover .e_jn_tex {

    opacity: 1;
}

.colour_mine .e_container .p_item .dis_jn_tex {
    display: none;
}

.colour_mine .colour_d .txt .txt_sp_1 {

    font-size: 72px;
    letter-spacing: 0px;
    color: #ffffff;
    font-weight: bold;
}

.colour_mine .colour_d .txt .txt_sp_2 {
    text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
    letter-spacing: 0px;
    color: #ffffff;
}


.colour_mine .jn_color {
    position: absolute;
    transform: translate(-50%, -50%);
    top: 50%;
    left: 50%;
}

.colour_mine .jn_color .colour_d .txt {
    line-height: 1;
    margin-bottom: 8%;
    display: flex;
    align-items: flex-end;

}

.colour_mine .jn_color .colour_d .txt .txt_sp_1 {
    margin-right: 18px;
    text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
}

@media only screen and (max-width: 1600px) {
    .colour_mine .colour_d .txt .txt_sp_1 {
        
            font-size: 62px;
    }
    
}

@media only screen and (max-width: 1440px) {
    .colour_mine .colour_d .txt .txt_sp_1 {
        
            font-size: 52px;
    }
    
}
@media only screen and (max-width: 1366px) {
    .colour_mine .colour_d .txt .txt_sp_1 {
        
            font-size: 42px;
    }
    
}
@media only screen and (max-width: 1200px) {
    .colour_mine .colour_d .txt .txt_sp_1 {
        
            font-size: 32px;
    }
    .colour_mine .p_item .e_jn_tex {
        
            font-size: 12px;
    }
}

@media only screen and (max-width: 768px) { 
   .colour_mine .p_item {
       
           width: 23.5%;
    height: 0px;
    padding-bottom: 23.5%;
        margin-right: 1.6%;
   } 
      .colour_mine .p_item:nth-child(13) {
   margin-right: 1.6%;
}

      .colour_mine .p_item:nth-child(4n) {
   margin-right: 0%!important;
}
.colour_mine .c_image {
    
        max-height: 500px;
    height: 500px;
}

.colour_mine .colour_d .txt .txt_sp_1 {
    
        font-size: 22px;
}
}