@charset "utf-8";
.effect-color img {
  opacity: 1;
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}
.effect-color img:hover {
  opacity: .5;
}

.bg11o {
    background: #F1F9FE;
}

.bgdouga {
    background: #060A1A;
}

.bor11 {
    border-color: #187FC3;
}

/*　タイトル背景色　*/
.style--obog_detail .name {
    background: #E1EEF6;
    font-weight: bold;
    color: #FFF;
}

.style--obog_detail .name:before {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    height: 6px;
    width: 85px;
    background: #187FC3;
}


/*　ボタンの色　*/
.button_list a {
    display: block;
    position: relative;
    padding: 15px 30px 15px 40px;
    background: #2CB5FF;
    border: 1px solid #2CB5FF;
    color: #333;
    text-decoration: none;
    margin-bottom: 20px;
}

.effect-color img {
  opacity: 1;
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}
.effect-color img:hover {
  opacity: .5;
}


.punch-box-c {
 position: relative;
 margin: 2em auto;
 padding: 15px 15px 15px 35px;
 width: 90%; /* ボックス幅 */
 background-color: #ffffff; /* ボックス背景色 */
 color: #666; /* 文章色 */
 border: 1px solid #000000; /* ボックス枠線 */
 box-shadow: 0 0 2px 1px #ccc; /* 影 */
 border-radius: 10px; /* 角の丸み */
}

.punch-box-c::before {
 position: absolute;
 content: '';
 left: 8px;
 top: 8px;
 width: 17px;
 height : 17px;
 background-color: #ffffff; /*穴背景色*/
 box-shadow: 0 0 5px #aaa inset; /*穴の影*/
 border: 1px solid #000000; /*パンチ穴枠色*/
 border-radius: 50%;
}