@charset "utf-8";
/* CSS Document */


/* common.js
// アコーディオンスライダー
基本表示サイズ指定（pc, sp, tb 共通）*/


/* アコーディオンスライダー ------------------------------------------------------*/
#main_area #top_content #slider_area {
  display: inline-block;
  /*margin-top: 50px;*/
  margin-right: 30px !important;
  margin-left: 0 !important;
  width: 600px;
  border: 1px solid #ccc !important;
  /*border-bottom: 3px solid #ccc;*/
  position: relative;
  z-index: 0;
  text-align: left;
}

#top_slider ul {
}
#top_slider li {
  width: 100%;
  position:relative;
  border-left: 1px solid #ccc;
  background: #666;  /* テキスト背景色 */
}

/*#top_slider li.val2 a {
  display: block;
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  color: #fff !important;
}*/


#top_slider li.no2 {
  background: #666;  /* テキスト背景色 */
}
#top_slider li:first-child {
  border-left: 0;
}
#top_slider li img {
}

#top_slider .slider_bg,
#top_slider .slider_bg2 {
  width: 100%;
  height: 25%;
  position: absolute;
  top: 75%;
  left: 0;
  z-index: 10;
}
#top_slider .slider_bg { /* スライドテキスト背景色 */
  background: #666666;
}
#top_slider .slider_bg2 { /* 2番目スライドテキスト背景色 */
  background: #007ca6;
}

#top_slider .slider_coment {
  padding: 5px 0 5px 10px;
  width: 21%; width: 26%;
  position: absolute;
  top: 75%;
  left: 0;
  z-index: 15;
  line-height: 1.6em;
  letter-spacing: 0.5px;
}
#top_slider .slider_coment a {
  color: #fff !important;
}
#top_slider .slider_coment h4 {  /* 小さい方 */
  font-size: 14px;
  line-height: 1.6;
  font-weight: normal;
  /*margin-bottom: 5px;*/
  color: #fff !important;
}
#top_slider .slider_coment p.slider_text {
  display: none;
  margin: 0 !important;
  font-size: 0.8125rem;
  line-height: 0.9375rem; line-height: 1.6;
  color: #fff;
}

#top_slider li.slider-open .slider_coment,
#top_slider li.slider-open .slider_coment2 {
  width: 600px; width: 95%;
}
#top_slider li.slider-open .slider_coment2 {
  /*background: #007ca6;*/
}

#top_slider li.slider-open .slider_coment a,
#top_slider li.slider-open .slider_coment2 a {
  display: block;
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  color: #fff;
}
#top_slider li.slider-open .slider_coment h4 { /* 大きい方 */
  padding:  0 0 3px;
  /*line-height: .4em !important;*/
  /*font-size: 1.125rem; /* 18px */
  font-size: 16px;
  color: #fff;
}
#top_slider li.slider-open .slider_coment p {
  display: block;
  line-height: 1.3;
  /*display: none;*/
  /*margin: 0 !important;
  font-size: 0.8125rem;
  line-height: 0.875rem;
  color: #fff;*/
}
/*#top_slide .slider_coment p.slider_text {
  display: none;
  margin: 0 !important;
  font-size: 0.8125rem;
  line-height: 0.9375rem;
  color: #fff;
}*/


@media screen and (max-width: 920px) {
  #main_area #top_content #slider_area {
    display: block;
    margin-bottom: 30px;
    margin-right: auto !important;
    margin-left: auto !important;
  }
}
  
@media screen and (max-width: 630px) {
#top_slider li {
  width: 100%;
  position:relative;
  border-left: 1px solid #ccc;
  /*background: #007ca6;*/  /* テキスト背景色 */
}
  
#top_slider .slider_bg,
#top_slider .slider_bg2 {
  width: 100%;
  height: 25%; height: 100% !important;
  position: absolute;
  top: 75%;
  left: 0;
  z-index: 10;
}
#top_slider .slider_bg2 { /* 2番目スライドテキスト背景色 */
  background: #666666;
}

  #main_area #top_content #slider_area {
    margin-top: -30px !important;
    width: 400px !important;
  }
#top_slider .slider_coment {
  padding: 5px 0 5px 10px;
  width: 21%;
  position: absolute;
  top: 75%; top: 65%;
  left: 0;
  z-index: 15;
  line-height: 1.6em;
  letter-spacing: 0.5px;
}
  #top_slider .slider_coment h4 {  /* 小さい方 */
    font-size: 12px;
    line-height: 1.2;
    margin-bottom: 8px;
  }
  #top_slider li.slider-open .slider_coment h4 { /* 大きい方 */
    font-size: 18px;
  }
  #top_slider li.slider-open .slider_coment p {
    /*display: none;*/
  }
}

@media screen and (max-width: 530px) {
  #main_area #top_content #slider_area {
    margin-top: -30px !important;
    width: 300px !important;
  }
#top_slider .slider_coment {
  padding: 5px 0 5px 10px;
  width: 21%;
  position: absolute;
  top: 75%; top: 50%;
  left: 0;
  z-index: 15;
  line-height: 1.6em;
  letter-spacing: 0.5px;
}
}

@media screen and (max-width: 365px) {
  #main_area #top_content #slider_area {
    margin-top: -30px !important;
    width: 280px !important;
  }
  /*#top_slider .slider_coment h4 {  
    font-size: 10px;
    line-height: 1.2;
  }
  #top_slider li.slider-open .slider_coment h4 { 
    font-size: 12px;
  }
  #top_slider li.slider-open .slider_coment p {
    display: none;
  }*/
}