@charset "utf-8";
/* ======================================================
(C)広島ホームテレビCSS Document 2017-03-03
====================================================== */
#pageBg {
  background-color: #0bb4b9;
  background: url(../../images/sea.jpg) center center / cover no-repeat fixed;
  padding: 10px 0 0;
  overflow: hidden;
}
#pageBg .pageHeader .logo,#pageBg .pageHeader .mainlogo{
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;  
  display: block;
  margin: 0 auto;
  background-repeat: no-repeat;
}
#pageBg .pageHeader .logo{
  background-image: url(../../images/logo.png);
}
#pageBg .pageHeader .mainlogo{
  background-image: url(../../images/mainlogo.png);
}
#pageBg .index02{
  background-color: #E50012;
  background-image: url(../../images/lovebg.png);
  -webkit-background-size: 315px 150px;
  padding: 10px 0;
  color: #FFF;
}
#pageBg .index02 h3{
  background-color: #FFF;  
  color: #E50012;
  padding: 5px;
  font-size: 21px;
  margin: 1em auto 0.2em;
}
#pageBg .index02 p{
  background-color: rgba(255,255,255,0.75);
  color: #000;
  padding: 0.5em 1em;
  text-align: left;
  line-height: 1.7em;
  font-size: 18px;
  border-radius: 6px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
}
#pageBg .index02 h3,#pageBg .index02 p{
    font-weight: bold;
    margin: 0 auto;
}

.slider img {width: 100%;height: auto;}
.single-item {max-width: 600px;margin: 0 auto 50px;}
.slick-prev::before, .slick-next::before {display:none;}

/*For PC---------------------------------------*/
@media screen and (min-width: 640px){
  #pageBg .pageHeader{
    max-width: 1035px;
    margin: 0 auto;
    background-image: url(../../images/billboard_bg.png);
    background-repeat: no-repeat;
    -webkit-background-size: 1035px 699.9px;
    background-size: 1035px 699.9px;
    background-position: 0px 30px;
    height: 980px;
    position: relative;
  }
  #pageBg .pageHeader .logo{
    -webkit-background-size: 500.8px 50px;
    background-size: 500.8px 50px;
    width: 500.8px;
    height: 50px;
  }
  #pageBg .pageHeader .mainlogo{
    -webkit-background-size: 850px 440px;
    background-size: 850px 440px;
    width: 850px;
    height: 440px;
  }
  #pageBg .pageHeader img.castphoto{
    position: absolute;
    bottom: 0;
    left:0;
  }
  #pageBg .pageHeader .date{
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;    
    display: block;
    background-image: url(../../images/date.png);
    -webkit-background-size: 500px 159px;
    background-size: 500px 159px;
    width: 500px;
    height: 159px;
    margin: 10px auto 0;
  }
  #pageBg .pageHeader dt,#pageBg .pageHeader dd{font-weight: bold;}
  #pageBg .pageHeader dt{
    background-image: url(../../images/flower.png);
    background-repeat: no-repeat;
    background-position: center center;
    -webkit-background-size: 97.5px 105px;
    background-size: 97.5px 105px;
    width: 100%;
    height: 105px;
    line-height: 105px;
    font-size: 36px;
    color: #FFF;
    filter:dropshadow(color=#F00,offX= 0,offY=-1)
    dropshadow(color=#F00,offX= 1,offY= 0)
    dropshadow(color=#F00,offX= 0,offY= 1)
    dropshadow(color=#F00,offX=-1,offY= 0);
    -webkit-text-stroke-color: #F00;
    -webkit-text-stroke-width: 1px;
    text-shadow: #F00 1px 1px 0px, #F00 -1px 1px 0px,
               #F00 1px -1px 0px, #F00 -1px -1px 0px;
  }
  #pageBg .pageHeader dd{
    font-size: 18px;
    line-height: 1.2em;
    max-width: 700px;
    margin: 0 auto;
  }
  #pageBg .pageHeader dd span{font-size: 21px;}
  #pageBg .index02{
    -webkit-background-size: 315px 150px;
    background-size: 315px 150px;
  }
  #pageBg .index02 h3{
    border-radius: 6px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    margin: 1em auto 0.5em;
  }
  #pageBg .index02 h3,#pageBg .index02 p{width: 1035px;}
  /*Slider*/
  .slider {margin: 50px 0 0;}
}


/*For SmartPhone---------------------------------------*/
@media screen and (max-width: 640px){
  #pageBg {
    background-image: url(../../images/sea_s.jpg);
  }
  #pageBg .pageHeader .logo{
    -webkit-background-size: 345.9px 32px;
    background-size: 345.9px 32px;
    width: 345.9px;
    height: 32px;
  }
  #pageBg .pageHeader .mainlogo{
    height: 0;
    /* 表示画像の高さ ÷ 表示画像の幅 × 100 */
    padding-top: 51.7%;
    background-size: contain;
  }
  #pageBg .pageHeader .date{
    color: #0000FF;
    font-weight: bold;
    font-size: 2em;
  }
  #pageBg .pageHeader .date span{
    margin: 0 auto;
    display: block;
    font-size: 0.8em;
    line-height: 1.2em;
  }
  #pageBg .pageHeader img.castphoto{margin-top: -2em;}
  #pageBg .index02{
    -webkit-background-size: 157.5px 75px;
    background-size: 157.5px 75px;
  }
  #pageBg .index02 p{margin: 0.5em;}
}


