@charset "UTF-8";
/* ----- 背景用の動画ファイル ----- */

.wrap{
position: relative;
width: 100%;
height: 100vh;
background: linear-gradient(-45deg, rgba(255, 0, 0, 0.1), rgba(255, 0, 0, 0.05));
overflow: hidden;
}

#bg-video{
 position: absolute;
 right: 0;
 bottom: 0;
 min-width: 100%;
 min-height: 100%;
 width: auto;
 height: auto;
 z-index: -100;
 /*
 background: url('/wordpress/wp-content/uploads/2018/12/top-slider-01.png') no-repeat;
 background-size: cover;
 */
}
/* ----- 背景の上に表示させたいコンテンツ ----- */
.header-title{
 position: absolute;
 z-index: 2;
 display: inline-block;
 left: 50%;
 -webkit-transform: translateX(-50%);
 transform:translateX(-50%);
 bottom: 30%;
 color: #fff;
 text-shadow: 2px 2px 1px #000;
 line-height: 1;
 width: 650px;
 text-align: center;
 font-weight: 700;
}
.header-title p{
 font-family: 'Noto Serif JP',serif !important;
 margin-bottom: 12px;
 font-size: 3em;
 letter-spacing: 0.05em;
}
.header-title p img {
 max-width:180px;
}

@media screen and (max-width: 767px) {
	.osyanton_banner img {
		max-width: 100%;
	}
}


@media (orientation: landscape) and (max-width:1024px){
 #bg-video{
 left: -200px;
}
}
@media (orientation: portrait) and (max-width:1024px){
 #bg-video{
 left: -330px;
}
}
@media screen and (max-width:768px) {
 #bg-video{
  left: -470px;
}
}
@media screen and (max-width:767px){

.header-title p {
 font-size: 2.5em;
}
.header-title p img {
max-width:150px;
}
}


@media screen and (max-width:580px){
  .header-title p {
   font-size: 22px;
}
  .header-title p img {
  max-width:100px;
}
}

/* ----- ECバナー ----- */
.ec-bnr {
    background: #000 ;
    display: block;
    max-width: 100%;
    border-top: 2px solid #e66428;
    border-bottom: 2px solid #e66428;
}

.ec-bnr a {
    display: block;
    width: 100%;
    height: 100%;
}

.ec-bnr a:hover {
    opacity: 0.7;
}

.ec-bnr a img {
    width: auto;
    height: auto;
    display: block;
    margin: auto;
    max-width: 100%;
}

.ec-bnr a img.pc-img {
    display: block;
}

.ec-bnr a img.sp-img {
    display: none !important;
}

@media screen and (max-width: 767px) {
    .ec-bnr a img.pc-img {
        display: none !important;
    }

.ec-bnr a img.sp-img {
        display: block !important;
    }
}

/* ----- add SDL ----- */
.entry-thumbnail img, .page-thumbnail img {
  width: 100%;
  aspect-ratio: 1200 / 400;
  object-fit: cover;
  object-position: center;
  display: block;
}