
body {
    background:linear-gradient(90deg,#29aae0 0%,#29aae0 50%,transparent 50%,transparent 100%);
  }
/* eye
----------------------------------------------------------------------------------------------------*/
.carousel-indicators{bottom:20px; top: auto; right:0; left:auto; margin-top:0; margin-bottom:0;}
.carousel-indicators li{width:13px; height:13px; border-radius: 100%; background-color:#c2c2c2;}
.carousel-indicators .active{background-color:#999999;}
.carousel-inner div.carousel-caption{bottom:20px; display:inline; padding-bottom:0;}
.carousel-inner > .item img{margin:0 auto;}

/* top layout
----------------------------------------------------------------------------------------------------*/
header{background:linear-gradient(90deg,#29aae0 0%,#29aae0 50%,transparent 50%,transparent 100%);}
.search button.btn{background:transparent; color:#333333;}

#index .wrap{
  position: relative;
  padding: 90px 0px 30px;
}

#index .wrap h2{margin-top:-20px; margin-bottom:0.8em; text-align:center;font-family: 'Oswald', sans-serif;}
#index .wrap h2 small,#index .wrap h3 small{font-family: "Sawarabi Gothic";}

@media (min-width: 768px) {
  #index .wrap h2{font-size:3em;}
}
#index .wrap h2 small,#index .wrap h3 small{font-size:60%;}

#index section:first-child .wrap:after{display:none;}

#index section:nth-child(odd) .wrap:before{background-color:#f1f1f1;}
#index section:nth-child(even) .wrap:before{background-color:#ffffff;}
#index section:last-child .wrap:before{background-color:#29aae0;}

#index .wrap > div.inner_wrap{margin:auto; padding: 0px;}

#index section:last-child .wrap{padding:0px;}
#index section:last-child .wrap > div.inner_wrap{padding: 120px 0px 40px;}
#index section:last-child .container,#index section:last-child .container a{color:#ffffff !important;}

#index section:last-child .wrap:after {
    content: "";
    position: absolute;
    left: 0;
    top: auto;
    bottom:0;
    width: 100%;
    height: 50%;
    z-index:-1;
    background-color:#29aae0;
  }

/* service list
----------------------------------------------------------------------------------------------------*/
  .top_service{display:block;}
  .top_service a.card{margin:0 5px 10px;flex-basis: calc(50% - 10px); max-width:calc(50% - 10px); border: 2px solid #b7b7b7;}
  .top_service a:hover{text-decoration:none; border: 2px solid #333333;}
  .top_service a.card > div > div{font-size:1.2em; margin-bottom:10px;}
  .top_service h3{flex-basis: 100%; max-width:100%;font-family: 'Oswald', sans-serif;}
  .top_service img{max-width:140px; width:100%; max-height:140px;}
  .top_service > div{display:flex; flex-wrap:wrap; justify-content:center; margin:0 -5px;}
@media (min-width: 768px) {
  .top_service > div{margin:0 -10px; flex-wrap:nowrap;}
  .top_service a.card{flex-basis:calc(25% - 20px); max-width:calc(25% - 20px); }
}

.topics .table > tbody > tr > th{width:100px;}


/* blog list
----------------------------------------------------------------------------------------------------*/
.container-fluid{padding-left:0; padding-right:0;}
.top_bloglist{display:flex; flex-wrap: wrap;flex-direction: column;}
.top_bloglist > article{display:flex; align-items:stretch; overflow:hidden;}
.top_bloglist h4{font-weight:600; margin-bottom:1rem; line-height:1.45;}
.top_bloglist > article > div{flex:1; max-width:50%;  overflow: hidden; position: relative;}
.top_bloglist > article > a{position: relative; background-color:#29aae0; padding:10px; color:#ffffff !important; flex:1; max-width:50%;}
.top_bloglist a:before{
  content: ' ';
  width:0;
  height: 0; display:block;
  position:absolute;
  border:30px solid transparent;
  border-right-color:#29aae0;
  top:0; bottom:0;
  right:100%; margin:auto;
}
.top_bloglist > article:nth-child(even){flex-direction: row-reverse;}
.top_bloglist > article:nth-child(even) a:before{
  content: '';
  width:0;
  height: 0; display:block;
  position:absolute;
  border:30px solid transparent;
  border-left-color:#29aae0;
  top:0; bottom:0;
  left:100%; margin:auto;
}
.top_bloglist > article > div img {
/* 画像を上下左右に中央配置する（絶対指定） */
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
/* 画像の最大サイズは枠の1.5倍まで */
max-width: 200%;
max-height: 200%;
}
@media (min-width: 992px) {
.top_bloglist > article{ flex: 0 0 50%; max-width:50%;}
.top_bloglist{flex-direction: row;}
.top_bloglist > article:nth-child(even){flex-direction: row;}
.top_bloglist > article:nth-child(even) a:before{
  border:30px solid transparent;
  border-left-color: transparent;
  border-right-color:#29aae0;
  right:100%; left:auto;
}
.top_bloglist > article:nth-child(3),.top_bloglist > article:nth-child(4){flex-direction: row-reverse;}
.top_bloglist > article:nth-child(3) a:before,.top_bloglist > article:nth-child(4) a:before{
  border:30px solid transparent;
  border-left-color:#29aae0;
  left:100%; margin:auto;
}
}
@media (min-width: 1200px) {
.top_bloglist > article{ flex: 0 0 33.33%; max-width:33.33%;}
.top_bloglist > article:nth-child(3),.top_bloglist > article:nth-child(4){flex-direction: row;}
.top_bloglist > article:nth-child(n+4){flex-direction: row-reverse;}

.top_bloglist > article:nth-child(3) a:before,.top_bloglist > article:nth-child(4) a:before{
  border:30px solid transparent;
  border-left-color: transparent;
  border-right-color:#29aae0;
  right:100%; left:auto;
}
.top_bloglist > article:nth-child(n+4) a:before{
  border:30px solid transparent;
  border-left-color:#29aae0;
  left:100%; margin:auto;
}
}


/* button
----------------------------------------------------------------------------------------------------*/

.btn-primary{position: relative; border:none;}
.btn-primary::after{
  position: absolute;
  top: 0px;
  right: 0px;
  content: '';
  width: 0;
  border-width: 0 16px 16px 0;
  border-style: solid;
  border-color: #fff #fff transparent transparent;
}

#index section:nth-child(odd) .btn-primary::after{border-color: #f1f1f1 #f1f1f1 transparent transparent;}
