.note-video-clip{
    width: 100%;
}



.box-mes{
    width: 100%;
    margin-top: 20px;
    background: transparent;
    display: flex;
    flex-wrap: wrap;
    /* border: 1px solid red; */
}
.box-mes .box-list{
    border: 0px solid #b5b5b6;
    line-height: 150%;
    margin-bottom: 40px;
}
.box-mes .box-list iframe{
    width: 100%;
    max-width: 640px;
}
.box-mes .box-list table{
    margin-bottom: 10px;
    border-collapse: collapse;
    border: 1px solid #353535;
}
.box-mes .box-list th, 
.box-mes .box-list td{
    border: 1px solid #353535;
}
.box-mes .box-list td{
    padding: 3px;
}
.box-mes .box-list iframe{
    margin-bottom: 10px;
}



/********************** message-type */

/* image 100% */
.img_100{
    margin-bottom: 20px; 
    margin-right: 25px;
}
.img_100 img{
    width: 100%;
    border: 1px solid #ccc;
    object-fit: contain;
}

/* image-top 100% + txt-bottom 100% */
.img_txt_100{
    margin-bottom: 20px; 
    margin-right: 25px;
}
.img_txt_100 img{
    width: 100%;
    border: 1px solid #ccc;
    border-radius: 4px;
    object-fit: contain;
}

/* img 25% + txt 75% */
.img_txt_div_25{ 
    margin-bottom: 20px; 
    margin-right: 25px;
    display: flex;
}
.img_txt_div_25 img{
    width: 25%;
    border: 1px solid #ccc;
    margin-right: 20px;
    border-radius: 4px;
    object-fit: contain;
    align-self: flex-start;
}
.img_txt_div_25 div{
    width: 75%;
}

/* img 50% + txt 50% */
.img_txt_div_50{
    margin-bottom: 20px; 
    margin-right: 25px;
    display: flex;
}
.img_txt_div_50 img{
    width: 50%;
    border: 1px solid #ccc;
    margin-right: 20px;
    border-radius: 4px;
    object-fit: contain;
    align-self: flex-start;
}
.img_txt_div_50 div{
    width: 50%;
}

/* image 25% + txt 75% ล้อมรอบ */
.img_txt_wrap_25{
    margin-bottom: 20px; 
    margin-right: 25px;
}
.img_txt_wrap_25 img{
    width: 25%;
    object-fit: contain;
    border: 1px solid #ccc;
    margin-right: 10px;
    float: left;
    border-radius: 4px;
}

/* image 50% + txt 50% ล้อมรอบ */
.img_txt_wrap_50{
    margin-bottom: 20px; 
    margin-right: 25px;
}
.img_txt_wrap_50 img{
    width: 50%;
    border: 1px solid #ccc;
    margin-right: 10px;
    float: left;
    border-radius: 4px;
}

/* txt 100% */
.txt_100{
    margin-bottom: 20px; 
    margin-right: 25px;
}
.txt_100 div{
    width: 100%;
}

/* txt-top 100% + image-bottom 100% */
.txt_img_100{
    margin-bottom: 20px; 
    margin-right: 25px;
}
.txt_img_100 img{
    width: 100%;
    object-fit: contain;
    border: 1px solid #ccc;
    border-radius: 4px;
}
.txt_img_100 div{
    width: 100%;
}

/* txt 50% + image 50% */
.txt_img_div_50{
    margin-bottom: 20px; 
    margin-right: 25px;
    display: flex;
}
.txt_img_div_50 img{
    width: 50%;
    object-fit: contain;
    align-self: flex-start;
    border: 1px solid #ccc;
    margin-left: 10px;
    border-radius: 4px;
}
.txt_img_div_50 div{
    width: 50%;
}

/* txt 75% + image 25% */
.txt_img_div_75{
    margin-bottom: 20px; 
    margin-right: 25px;
    display: flex;
}
.txt_img_div_75 img{
    width: 25%;
    object-fit: contain;
    align-self: flex-start;
    border: 1px solid #ccc;
    margin-left: 10px;
    border-radius: 4px;
}
.txt_img_div_75 div{
    width: 75%;
}

/* txt 50% + image 50% */
.txt_img_wrap_50{
    margin-bottom: 20px; 
    margin-right: 25px;
}
.txt_img_wrap_50 img{
    width: 50%;
    border: 1px solid #ccc;
    margin-left: 10px;
    float: right;
    border-radius: 4px;
}

/* txt 75% + image 25% */
.txt_img_wrap_75{
    margin-bottom: 20px; 
    margin-right: 25px;
}
.txt_img_wrap_75 img{
    width: 25%;
    border: 1px solid #ccc;
    margin-left: 10px;
    float: right;
    border-radius: 4px;
}

.column_num-1{
    width: 100%;
}
.column_num-2{
    width: calc(50% - 25px);
}
.column_num-3{
    width: calc(33.333% - 25px);
}
.column_num-4{
    width: calc(25% - 25px);
}
.column_num-5{
    width: calc(20% - 25px);
}
.column_num-6{
    width: calc(16.666% - 25px);
}
.column_num-7{
    width: calc(14.285% - 25px);
}
.column_num-8{
    width: calc(12.50% - 25px);
}
.column_num-9{
    width: calc(11.111% - 25px);
}
.column_num-10{
    width: calc(10% - 25px);
}


