@charset "UTF-8";
/* CSS トップページ　PC */

/*スライダー*/
@keyframes horizontal-animation {
  from {
    transform: translateX(0);
  }

  to {
    transform: translateX(-100%);
  }
}

.slider-container {
  display: flex;
  overflow: hidden;
  margin-bottom: 35px;
}

.slider-wrapper {
  display: flex;
  animation: horizontal-animation 40s linear infinite;
}

.slide {
  width: auto;
}

.slide img {
  width: auto;
  height: 496px;
  vertical-align: bottom;
}

@media (hover: hover) {
  .slider-container:hover .slider-wrapper {
    animation-play-state: paused;
  }
}


.slider-container {
  position: relative;
}

.slider-container::after {
  content: "";
  width: 290px;
  height: 100%;
  position: absolute;
  top: 190px;
  left: 50px;
  background: url("../img/index/topindex.png") no-repeat center top / 290px auto;
  z-index: 300;
}

#header_box {display: none;}

/*メイン*/
#content1 {
width: 960px;
margin: 50px auto 50px;
overflow: hidden;
}

/*おこたこ広報室*/
#news {
float: right;
width: 400px;
}

#news h3 {
font-size: 1.5em;
font-weight: bold;
border-bottom: 2px solid #222;
padding-bottom: 5px;
}

#news p {
border-bottom: 1px dotted #222;
padding: 15px 0;
}

/*おこたこ広報室バナー　左*/
#news_banner1 {
float: left;
width: 508px;
}

#news_banner1 div {
margin-bottom: 10px;
}

#news_banner1 iframe {
width:508px;
height:285.75px
}

#news_banner1 div#kodomo img {
width:100%;
}

/*おこたこ広報室バナー　下*/
#news_banner2 {
clear: both;
padding-top: 30px;
}

#news_banner2 div {
float: left;
width: 32%;
}

#news_banner2 div img {
width: 100%;
}

#news_banner2 div:nth-child(2) {margin: 0 2%;}


/*インスタ　SnapWidget*/
#content2 {
width:960px;
margin: 0 auto 50px;
}

#content2 h3 {
font-size: 1.5em;
font-weight: bold;
border-bottom: 2px solid #222;
padding-bottom: 5px;
margin-bottom: 20px;
}

iframe {
width:960px;
height:537px;
}

/*組合員一覧*/
#content3 {
width:100%;
background-color: #f4fae8;
padding-top:50px;
}

#content3-inner {
width:960px;
margin: 0 auto;
overflow: hidden;
}

#content3 h3 {
font-size: 1.5em;
font-weight: bold;
border-bottom: 2px solid #222;
padding-bottom: 5px;
margin-bottom: 20px;
}

#content3 ul {
margin: 0;
padding: 0;
}
#content3 ul li {
float: left;
width: 88px;
list-style: none;
margin: 0;
padding: 0;
}

#content3 ul li:not(:first-child) {
  margin-left: 8px; /* 最初のカラム以外の左側に10pxのマージン */
}
#content3 ul li img {
width: 100%;
}

#content3 ul li a img {
border: 1px solid #222;
}

/*賛助商社一覧*/
#content4 {
width:100%;
background-color: #f4fae8;
padding-top:50px;
padding-bottom:50px;
margin-bottom: 50px;
}

#content4-inner {
width:960px;
margin: 0 auto;
overflow: hidden;
}

#content4 h3 {
font-size: 1.5em;
font-weight: bold;
border-bottom: 2px solid #222;
padding-bottom: 5px;
margin-bottom: 20px;
}

#content4 ul {
margin: 0;
}
#content4 ul li {
float: left;
width: 50%;
margin: 0 0 10px;
padding: 0;
}