/*** for PC Browser ***/
@media (min-width:401px)
{
.BrowserBlogItem
{
  /*	background-color: #FFFFFF;*/
  color: #333333;
  padding: 1px 5px 5px 5px;
  margin: 0px;
}

.BrowserBlogItem .Append
{
  font-size: x-small;
}

.BrowserBlogItem .Title
{
  color: #333333;
  font-size: medium;
  text-align: left;
  font-weight: bold;
  border-bottom: 1px dotted #336699;
}

.BrowserBlogItem .SubTitle
{
  color: #000000;
  font-size: medium;
  border-top: 1px dotted #336699;
  text-align: left;
  font-weight: bold;
  margin: 0px;
  margin-bottom: 8px;
}

.BrowserBlogItem .CreatedDate
{
  color: #336699;
  font-size: small;
  font-weight: bold;
  text-align: left;
  border-top: 1px solid #336699;
  border-left: 5px solid #336699;
  padding: 0px;
  padding-left: 3px;
  margin: 0px;
  margin-bottom: 5px;
}

.BrowserBlogItem .Category
{
  color: #ffffff;
  font-size: small;
  font-weight: bold;
  text-align: left;
  background-color: #336699;
  padding: 3px;
  margin: 0px;
  margin-top: 3px;
  margin-bottom: 3px;
}

.BrowserBlogItem .Contents
{
  color: #333333;
  font-size: medium;
  line-height: 1.5;
  text-align: left;
  padding: 0px;
  margin: 0px;
  margin-top: 10px;
}

.BrowserBlogItem .Contents img
{
    max-width: 100%;
    height: auto !important;
    float: none;
}

.BrowserBlogItem .Comments
{
  color: #333333;
  font-size: small;
  line-height: 120%;
  text-align: left;
  margin: 0px;
  margin-bottom: 5px;
}

.BrowserBlogItem .Status
{
  color: #999999;
  font-size: x-small;
  border-top: 1px dotted #336699;
  text-align: left;
  padding: 0px;
  margin: 0px;
  margin-top: 5px;
  margin-bottom: 25px;
}

.BrowserBlogItem .PageControl
{
  font-size: small;
  padding: 0px;
  margin: 0px;
  margin-bottom: 5px;
}

.BrowserBlogItem .Contents h3,
.BrowserBlogItem .Contents h4,
.BrowserBlogItem .Contents h5,
.BrowserBlogItem .Contents h6
{
    margin: 15px 0 10px 0 !important;
}




.BrowserBlogItem .img_g
{
    text-align: center;
    width: 100%;
    position: relative;
}

.BrowserBlogItem .img_box
{
    margin: 5px;
}

.BrowserBlogItem .img_box img
{
    max-width: 32%;
}

.BrowserBlogItem .img_box img:hover
{
    cursor: pointer;
}

.BrowserBlogItem .img_open
{
    position: absolute;
    bottom: 0;
    left: calc(50% - 450px);
    z-index: 10;
    border: 5px double #D0D0D0;
    background: #FFFFFF;
    display: inline-block;
}

.BrowserBlogItem .img_open img
{
    max-width: 900px !important;
    vertical-align: bottom;
}
}


/*** for Smart Phone ***/
@media (max-width:400px)
{
.BrowserBlogItem
{
  /*	background-color: #FFFFFF;*/
  color: #333333;
  padding: 0;
  margin: 0px;
width:100% !important;
}

.BrowserBlogItem .Append
{
  font-size: x-small;
}

.BrowserBlogItem .Title
{
  color: #333333;
  font-size: medium;
  text-align: left;
  font-weight: bold;
  border-bottom: 1px dotted #336699;
}

.BrowserBlogItem .SubTitle
{
  color: #000000;
  font-size: medium;
  border-top: 1px dotted #336699;
  text-align: left;
  font-weight: bold;
  margin: 0px;
  margin-bottom: 8px;
}

.BrowserBlogItem .CreatedDate
{
  color: #336699;
  font-size: small;
  font-weight: bold;
  text-align: left;
  border-top: 1px solid #336699;
  border-left: 5px solid #336699;
  padding: 0px;
  padding-left: 3px;
  margin: 0px;
  margin-bottom: 5px;
}

.BrowserBlogItem .Category
{
  color: #ffffff;
  font-size: small;
  font-weight: bold;
  text-align: left;
  background-color: #336699;
  padding: 3px;
  margin: 0px;
  margin-top: 3px;
  margin-bottom: 3px;
}

.BrowserBlogItem .Contents
{
  color: #333333;
  font-size: medium;
  line-height: 1.5;
  text-align: left;
  padding: 0px;
  margin: 0px;
  margin-top: 10px;
}

.BrowserBlogItem .Comments
{
  color: #333333;
  font-size: small;
  line-height: 120%;
  text-align: left;
  margin: 0px;
  margin-bottom: 5px;
}

.BrowserBlogItem .Status
{
  color: #999999;
  font-size: x-small;
  border-top: 1px dotted #336699;
  text-align: left;
  padding: 0px;
  margin: 0px;
  margin-top: 5px;
  margin-bottom: 25px;
}

.BrowserBlogItem .PageControl
{
  font-size: small;
  padding: 0px;
  margin: 0px;
  margin-bottom: 5px;
}

.BrowserBlogItem .Contents h3,
.BrowserBlogItem .Contents h4,
.BrowserBlogItem .Contents h5,
.BrowserBlogItem .Contents h6
{
    margin: 15px 0 10px 0 !important;
}



.BrowserBlogItem .img_g
{
    text-align: center;
    width: 100%;
}

.BrowserBlogItem .img_box
{
    margin: 5px;
}

.BrowserBlogItem .img_box img
{
    max-width: 32%;
}

.BrowserBlogItem .img_box img:hover
{
    cursor: pointer;
}

.BrowserBlogItem .img_box img.img_open
{
    position: absolute;
    bottom: calc(50% - (50% / 2));
    left: calc(50% - 450px);
    max-width: 900px !important;
    z-index: 10;
    border: 5px double #D0D0D0;
    background: #FFFFFF;
}
}