/*style reset*/

* {
  margin: 0;
  padding: 0;
}

ul, ol { list-style: none; }

a { text-decoration: none; }

/*main style*/





.same_offset {
  float: left;
  overflow: hidden;
  zoom: 1;
  
}

.same_open {
  padding-top: 50px;
  height: 500px;
      width: 3.44%;
  color: #fff;
      box-shadow: 3px 0px 10px #585858;
      position: relative;
  cursor: pointer;
      background: #e8e8e8 !important;
  line-height: 26px;
  text-align:center;
  font-size: 16px;
  margin: 0;
}

.same_open_content {
  width: 0;
  height: 500px;
 background-color: #fff !important;
     max-width: 86.2% !important;
}

.open_content { width: 82.7%; }

.same_open_content img {
 height: 40%;
    float: left;
    
    width: 100%;
    object-fit: cover;
}
.accord-title{
  transform: rotate(-90deg);
    width: 450px;
    left: -202px;
    position: absolute;
       bottom: 220px;
    color: black;
        text-align: left;
    margin: auto;
    display: inline-block;
}
.accord-title img{
      transform: rotate(90deg);
    width: 30px;
    padding: 1%;
    position: relative;
    left: 0px;
    height: 30px;
    object-fit: cover;
}

.open_article {
  padding: 50px;
    width: 100%;
    text-align: justify;
    height: 100%;
    background: rgba(255, 255, 255, 0.86);
    opacity: 0;
}
.open_article:hover {
  opacity: 1;
  }
.open_article h1 {
  font-size: 25px;
  font-weight: normal;
  color: #444444;
}
.accordion_content .selected{
     background: rgb(30, 150, 228)!important;
    box-shadow: -7px 0px 10px rgba(31, 31, 31, 0.24);
  
}
.accordion_content .selected .accord-title{
  color: white;
}

.open_article p {
  font-size: 12px;
  line-height: 20px;
  color: #666666;
}

.more_info { color: #9b7627; }