/*============================
#main-visual
============================*/
#main-visual {
  margin-top:2rem;
  max-width:1300px;
  margin-left:auto;
  margin-right:auto;
  /*background-image:url(../../../common/img/bg1.png);
  background-size:cover;
  background-position:center center;*/
}
#main-visual > div{
  display:flex;
}
#main-visual  .slide-wrap {
  width:60%;
  /*padding:2rem;*/
}
#main-visual  .slide-wrap .slide {

}

.to-story a{
  display: block;
    padding: .5rem;
    text-align: center;
      background-color: #619dc8;
    color: #fff;
    max-width:33.333%;
    margin:0 auto;
}


#main-visual  .slide-wrap .slide .item {
  height:350px;
  background-color:#fff;
  background-size:cover;
  position:relative;
}



#main-visual  .slide-wrap .slide .item .info{
padding:1rem 3rem 2rem;
}




#main-visual  .slide-wrap .slide .item .ttl {
  font-size: 22px;
}
#main-visual  .slide-wrap .slide .item .txt {
  overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
#main-visual  .news-wrap {
  width:40%;
  background-color:rgba(0,0,0,0.8);
  color:#fff;
  /*padding:2rem;*/
  height:350px;
}



#main-visual  .news-wrap .list {
  height:100%;
}
#main-visual  .news-wrap .list .item{
  height:50%;
  min-height:175px;
}


.slick-dots {
    bottom: 20px;
}



/*
#main-visual  .news-wrap .list .item a{

    padding:1rem 0;
    display:block;
}

#main-visual  .news-wrap .list .item .option{

}

#main-visual  .news-wrap .list .item  .date {
  background-color:#24337E;
  font-size:12px;
  display:inline-block;
  padding:.3rem;
  line-height:1em;
}
#main-visual  .news-wrap .list .item  .cate {
  font-size:12px;
  display:inline-block;
}
#main-visual  .news-wrap .list .item  .txt {
  overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
*/


/*============================
#service-list
============================*/
#service-list .list{
  display:flex;
  flex-wrap:wrap;
}
#service-list .list .item {

  color:#fff;
  width:25%;
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#1d9459+0,1d9459+70,118e8a+100 */
/*
  background: -moz-linear-gradient(top,  rgba(31,221,174,1) 0%, rgba(100,173,229,1) 100%);
  background: -webkit-linear-gradient(top,  rgba(31,221,174,1) 0%,rgba(100,173,229,1) 100%);
  background: linear-gradient(to bottom,  rgba(31,221,174,1) 0%,rgba(100,173,229,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b31fddae', endColorstr='#64ade5',GradientType=0 );
*/
background:#00a59a;
}
#service-list .list .item.bg2{


background:#20b1a7;
/*
background: -moz-linear-gradient(top,  rgba(8,219,166,1) 0%, rgba(63,156,226,1) 100%);
background: -webkit-linear-gradient(top,  rgba(8,219,166,1) 0%,rgba(63,156,226,1) 100%);
background: linear-gradient(to bottom,  rgba(8,219,166,1) 0%,rgba(63,156,226,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b308dba6', endColorstr='#3f9ce2',GradientType=0 );
*/


}

#service-list .list .item .img {
  text-align:center;
}
#service-list .list .item .img img{
  width:100px;
}
#service-list .list .item .ttl {
  text-align:center;
  font-weight:bold;
  margin-top:1rem;
  line-height:1.5em;
  min-height:45px;

}
#service-list .list .item .to-contact {
    background-color:#2c847e;
    font-size: 13px;
    border-radius: 15px;
}
#service-list .list .item .txt {
  padding:1rem;
  border-top:1px solid #fff;
  margin-top:1rem;
  font-size: .8rem;
  line-height:1.5em;
}
#service-list .list .item a{
padding: 1rem;
  display:block;
}
#service-list .list .item a:hover{

  background-color:rgba(255,255,255,0.2)

}

/*============================
#blog-list
============================*/
#blog-list {
  display:flex;
  flex-wrap:wrap;

}
#blog-list .category {
  width:33.3333%;
}
#blog-list .category .common-ttl {
}
#blog-list .category .list {
  padding:1rem 1rem;
  background-color:#efefef;
}
#blog-list .category .list.bg-white{
  background-color:#fff;
}
#blog-list .category .list .item {
  display:flex;
  padding:.5rem 0;
  border-bottom:1px solid #B5B5B5;
  align-items:center;
}
#blog-list .category .list .item .date {
  width: 100px;
    /* background: #1D9459; */
    font-size: .8rem;
    color: #fff;
    text-align: center;
    line-height: 4;
    height: 62px;
    background-position: center center;
    background-size: cover;
}
#blog-list .category .list .item .txt {
  width:calc(100% - 100px);
  padding:0 0 0 1rem;

}
#blog-list .category .list .item .txt h3{
    font-size:.8rem;
    display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    overflow:hidden;
    font-weight:normal;
    margin-bottom:0;
    line-height:1.5em;
}
#blog-list .category .list .item .txt h3 a{
  text-decoration:underline;
}
#blog-list .category .list .item .txt h3 a:hover{
  text-decoration:none;
}
/*============================
#voice
============================*/
#voice {

}

#voice .list {
  display:flex;
      flex-wrap: wrap;
}
#voice .list .item {
  width:33.3333%;
}
#voice .list .item  .img {
  background-image:url(../../../common/img/bg1.png);
  background-size:cover;
  background-position:center center;
  height:290px;
}
#voice .list .item  .info {
  background-color:#575757;
  padding:1rem;
  color:#fff;
}
#voice .list .item  .ttl {
  padding-bottom:.5rem;
  border-bottom:1px solid #fff;
  font-weight:bold;
}
#voice .list .item  .name {
  text-align:right;
  margin-top:.5rem;
}

/*============================
#sns
============================*/
#sns {
  padding:3rem 1rem;
}
#sns .ttl {
  font-size:2rem;
  text-align:center;
}
#sns .ttl .fas.fa-share-alt {
  margin-bottom:1rem;
  display:inline-block;
}
#sns .list {
  display:flex;
  justify-content:center;

}
#sns .list .item {
  width:50%;
  max-width:500px;
  /*background:#000;
  height:600px;*/
  margin:1rem;
}

#whats{
  background-color: #575757;

color: #fff;
  margin-top:40px;
  padding:20px;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
}
#whats .img img{
  width:100%;

}
#whats .img{
  width:200px;
  text-align:center;
}
#whats .info{
  width:calc(100% - 200px);
  padding-left:20px;
}
#whats .ttl{
  font-size: 1.2rem;
}
#whats .ttl img{
  display:inline-block;
  margin-top:10px;
}
#whats .txt{
  text-align:left;
  line-height:1.5em;
  margin-bottom:0;
}
