#lower{
  background: linear-gradient(150deg,rgba(183, 224, 245, 1) 0%, rgba(255, 255, 255, 1) 50%, rgba(183, 224, 245, 1) 100%);
}
#lower.video01-bg{
  background: linear-gradient(150deg,rgba(183, 224, 245, 1) 0%, rgba(255, 255, 255, 1) 50%, rgba(183, 224, 245, 1) 100%);
}
#lower.video02-bg{
  background: linear-gradient(150deg,rgba(245, 185, 197, 1) 0%, rgba(255, 255, 255, 1) 50%, rgba(245, 185, 197, 1) 100%);
}
#lower.video03-bg{
  background: linear-gradient(150deg,rgba(224, 185, 245, 1) 0%, rgba(255, 255, 255, 1) 50%, rgba(224, 185, 245, 1) 100%);
}
#lower.video04-bg{
  background: linear-gradient(150deg,rgba(213, 245, 185, 1) 0%, rgba(255, 255, 255, 1) 50%, rgba(213, 245, 185, 1) 100%);
}
#lower.video05-bg{
  background: linear-gradient(150deg,rgba(245, 222, 185, 1) 0%, rgba(255, 255, 255, 1) 50%, rgba(245, 222, 185, 1) 100%);
}
#lower.video06-bg{
  background: linear-gradient(150deg,rgba(185, 108, 245, 1) 0%, rgba(255, 255, 255, 1) 50%, rgba(185, 108, 245, 1) 100%);
}
#video-pickup.video01{
	background-color: #9ED6F2;
}
#video-pickup.video02{
	background-color: #F29EB8;
}
#video-pickup.video03{
	background-color: #BB9EF2;
}
#video-pickup.video04{
	background-color: #C5F29E;
}
#video-pickup.video05{
	background-color: #F2CB9E;
}
#video-pickup.video06{
	background-color: #9EBEF2;
}
#pc-single .video-single-left .video01{
	background-color: #9ED6F2;
}
#pc-single .video-single-left .video02{
	background-color: #F29EB8;
}
#pc-single .video-single-left .video03{
	background-color: #BB9EF2;
}
#pc-single .video-single-left .video04{
	background-color: #C5F29E;
}
#pc-single .video-single-left .video05{
	background-color: #F2CB9E;
}
#pc-single .video-single-left .video06{
	background-color: #9EBEF2;
}

/* ----- breadcrumbs ----- */
.breadcrumbs-wrap{
	width: 100%;
	padding: 10px 40px;
	font-size: 12px;
	background-color: rgba(255, 255, 255, .4);
	text-align: left;
}
.breadcrumbs-wrap a, .breadcrumbs-wrap span{
	color: #1d1d1d;
	vertical-align: middle;
}

img.arrow-bc{
	width: 5px;
}
.current{
	margin-left: 4px;
}
#video-single .breadcrumbs-wrap{
	padding: 10px 0 ;
	background-color: rgba(255, 255, 255, 0);
}
#column-single .breadcrumbs-wrap{
	padding: 10px 0;
}
@media (max-width: 600px) {
.breadcrumbs-wrap {
    padding: 10px 20px;
}
}

/* ----- section-category ----- */
#category{
   padding-top: 50px;
}

.card-wrapper{
  width: calc(25% - 24px);
}

.video-row{
  display: flex;
  flex-wrap: wrap;
  row-gap: 40px;
}

#sp-cat-wrap{
  display: none;
}

 @media (max-width: 1400px) {
.card-wrapper{
  width: calc(33.333% - 24px);
}
}
 @media (max-width: 1000px) {
.card-wrapper{
  width: calc(50% - 24px);
}
}

 @media (max-width: 600px) {
#category{
   padding-top: 30px;
}
#sp-cat-wrap{
  display: block;
}
.card-wrapper{
  width: calc(100% - 24px);
}
#sp-cat-wrap{
  display: inline-flex;
  flex-wrap: wrap;
  justify-content: center;
  row-gap: 20px;
}
#sp-cat-wrap{
  width: 100%;
}
#sp-cat-wrap .sp-card-wrapper {
        width: 45%;
        margin: 0 7px;
    }
    
    /* 検索結果ページのSP表示：縦長（9:16）を想定 */
    #search #sp-cat-wrap .sp-video-wrap {
      aspect-ratio: 9 / 16;
      width: 100%;
      border-radius: 6px;
      overflow: hidden;
    }
    
    /* 検索結果ページでも動画を静止状態で表示（関連動画と同じ方式） */
    #search #sp-cat-slide {
      display: block;
    }
	 #category .video-row{
		 display: none;
	 }
#sp-cat-slide .slick-slide {
margin-top: -28px!important;
    }
#sp-cat-slide .slick-current {
padding-top: 45px !important;
    }
.loadmore-wrap{
display: none;
}
}


/* ----- section-single ----- */
.video-single-wrap{
  display: flex;
}

.video-single-left{
  width: calc(100% - min(30vw, 420px));
}
.video-single-main{
    padding: min(3.571vw, 50px) min(5.714vw, 80px);
	border-radius: 0 0 20px 0
}
img.single-main-img{
  width: 100%;
  border-radius: 16px;
}
.single-text-wrap .video-title {
    font-size: 20px;
}
.video-single-main .video-title{
   font-size: 24px;
    margin-top: 20px;
}
.video-title-wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.sp-fullscreen-btn {
  display: none;
  background-color: #000;
  color: #fff;
  border: none;
  padding: 8px 16px;
  border-radius: 4px;
  font-size: 14px;
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
}
.sp-fullscreen-btn:hover {
  opacity: 0.8;
}
@media (max-width: 600px) {
  .sp-fullscreen-btn {
    display: block;
  }
}
#pc-single  p {
	font-size: 16px;
    line-height: 1.6;
    margin-top: 12px;
	text-align: left;
	color: #1d1d1d;
}
.single-card-wrapper p {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    text-overflow: ellipsis;
}
#pc-single .video-single-main iframe {
  border-radius: 10px;
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

ul.single-related-wrap{
  padding: min(5.714vw, 80px) min(1.428vw, 20px) min(1.428vw, 20px) min(5.714vw, 80px);
}
li.single-card-wrapper{
  margin-bottom: min(2.857vw, 40px);
}
.single-card-wrapper a{
  display: flex;
}
img.single-related-img{
  width: 295px;
  height: 166px;
  aspect-ratio 16 / 9;
  border-radius: 6px;

}
.single-text-wrap{
  margin-left: 20px;
}

.video-single-right{
  width: min(30vw, 420px);

}
ul.single-cat-wrap{
  margin-top: min(3.571vw, 50px);
}
.single-cat-wrap .card-wrapper {
  padding:  0 min(5.714vw, 80px) 30px min(5vw, 80px);
  width: 100%;
  margin: 0;
}
.video-img{
  width: 100%;
    border-radius: 4px;
}
#sp-single{
    display: none;
}
/* ── single メインを横幅いっぱいに ───────────────── */
#pc-single .video-single-left .video-single-main {
  width: 100%;
  max-width: none;

}

/* 画像/動画どちらでも全幅表示 */
#pc-single .video-single-main .single-main-img,
#pc-single .video-single-main iframe[id^="mainPlayer"] {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  border: 0;
}

/* iframe は 16:9 比率を維持（対応ブラウザ用） */
#pc-single .video-single-main iframe[id^="mainPlayer"] {
  aspect-ratio: 16 / 9;
}

/* 関連カード内では埋め込みを表示しない（サムネ＋テキストのみ） */
.single-card-wrapper iframe,
.single-card-wrapper .wp-embed,
.single-card-wrapper .wp-video,
.single-card-wrapper figure iframe {
  display: none !important;
}


/* 再生中として hidden を付けたカードは必ず非表示 */
.single-related-wrap li[hidden] { display: none !important; }

.video-sprelated{
	display: none;
}

@media screen and (max-width: 1000px) {
.video-single-wrap{
  display: block;
}
.video-single-left {
    width: 100%;
}
.video-single-right{
  display: none;

}
.single-side-wrapper {
    position: relative;
    padding: 0 2px;
    margin: 0 12px;
}
ul.single-related-wrap {
    padding: min(5.714vw, 80px) min(5.714vw, 80px) min(1.428vw, 20px) min(5.714vw, 80px);
}
}
@media screen and (max-width: 600px) {

#sp-single{
    display: block;
    position: fixed;
    z-index: 1000;
}
#sp-single .video-title {
        font-size: 18px;
        color: #fff;
    }
.video-sprelated,
.video-spnew{
	display: block;
	padding-top: 30px;
	padding-bottom: 30px;
}
.video-sprelated .content-full,
.video-spnew .content-full{
	margin-bottom: 20px;
}
.video-sprelated .cat-heading,
.video-spnew .cat-heading{
	margin-bottom: 20px;
}
#sp-single .sp-video-pickup{
  width: 100%;
  height: 100vh;
  margin-top: -60px;
}
  #pc-single .video-single-main iframe {
    border-radius: 0;
  }
  
  /* スマホ動画詳細ページのvimeo動画を画面横幅いっぱいに表示（iframeのみ） */
  #pc-single .video-single-main {
    padding: min(3.571vw, 50px) min(5.714vw, 80px) !important;
    position: relative;
  }
  #pc-single .video-single-main iframe[id^="mainPlayer"] {
    position: relative;
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(-50vw + 50%) !important;
    margin-right: calc(-50vw + 50%) !important;
    display: block;
  }

#sp-single .sp-single-img{
  width: 100%;
  height: 100vh;
  object-fit: cover;
  object-position: center;
}

.single-card-wrapper a{
  display: block;
}

.single-card-wrapper iframe,
.single-card-wrapper .wp-embed,
.single-card-wrapper .wp-video,
.single-card-wrapper figure iframe {
  display: block !important;
}

/* フォールバック表示（任意） */
.sp-hero--fallback{
  background:#000; color:#fff; padding:12px; text-align:center;
}



  /* 600px以下の既定ではヘッダーは表示 */
  .site-header, header.header, .g-topbar{
    display:block !important;
  }
  /* SPヒーローを出すページだけ（body.sp-hero-active）ヘッダーを隠す */
  body.sp-hero-active .site-header,
  body.sp-hero-active header.header,
  body.sp-hero-active .g-topbar{
    display:none !important;
  }



  /* SPヒーローを画面全面に（SPページだけ） */
  body.sp-hero-active #video-single .container{ padding:0 !important; max-width:none !important; }
  body.sp-hero-active #sp-single{
    position:fixed; inset:0; z-index:999; background:#000;
  }

  /* 100vh×100vwのヒーロー */
  #sp-single .sp-hero{
    position:relative; width:100vw; height:100svh; overflow:hidden;
  }

  /* 高さ基準の cover（横はみ出しOK）。タップはボタンのみ通す */
  #sp-single .sp-hero iframe{
    position:absolute; top:50%; left:50%;
    height:100svh; width:calc(100svh * 16 / 9); /* 16:9。縦動画なら比率変更 */
    transform:translate(-50%,-50%);
    border:0; display:block;
    max-width:none !important; max-height:none !important;
    pointer-events:none;   /* 画面タップで再生しない */
    z-index:1;
  }

  /* タップカバー（暗転トグル用に画面全体でクリックを拾う） */
  #sp-single .tap-cover{ position:absolute; inset:0; z-index:2; }

  /* 暗転＆テキスト（初期は非表示、active時だけ出す） */
  #sp-single .sp-layer{
    position:absolute; inset:0; background:#000; opacity:0;
    transition:opacity .2s ease; z-index:3; pointer-events:none;
  }
  #sp-single .sp-text-wrap{
    position:absolute; bottom:90px; color:#fff;
    opacity:0; transition:opacity .2s ease; z-index:4;
  }
  #sp-single.active .sp-layer{ opacity:.75; }
  #sp-single.active .sp-text-wrap{ opacity:1; }

  /* 再生ボタン（常に前面） */
  #sp-single .pb-btn{
    position:absolute; right:5%; bottom:30px; z-index:5;
    width:40px; height:40px; border:0; padding:0;
    background:url('/one/wp-content/themes/onevilection/images/playback.svg') center/contain no-repeat;
  }

#sp-single .pb-btn.is-playing{
  background-image:url('/one/wp-content/themes/onevilection/images/stop.svg');
}

/* 再生ボタン（button の背景画像版：#spMainHero / #sp-single 両対応） */
#spMainHero .pb-btn,
#sp-single  .pb-btn{
  position:absolute; right:5%; bottom:30px; z-index:5;
  width:40px; height:40px; border:0; padding:0;
  background:url('/one/wp-content/themes/onevilection/images/playback.svg') center/contain no-repeat;
}

/* 再生中は停止アイコンへ（buttonの場合）*/
#spMainHero .pb-btn.is-playing,
#sp-single  .pb-btn.is-playing{
  background-image:url('/one/wp-content/themes/onevilection/images/stop.svg');
}

/* もし pb-btn が <img> の場合はサイズだけ合わせる（srcはJSで差替） */
#spMainHero img.pb-btn,
#sp-single  img.pb-btn{
  width:32px; height:32px;
}

#sp-single .return-btn {
  position:absolute;
  top:30px;
  left:5%;
  z-index:6;              /* テキストや黒幕より上 */
  color:#fff;
  text-decoration:none;
  font-size:16px;
  font-weight:600;
  opacity:0;
  pointer-events:none;
  transition:opacity .3s ease;
}

/* 暗転中に表示 */
#sp-single.active .return-btn {
  opacity:1;
  pointer-events:auto;
}
  ul.single-related-wrap{ display:none !important; visibility:hidden !important; }
  .video-single-right{ display:none !important; } /* 右カラムも不要なら */
}

}


/* ----- section-search ----- */
#search{
   padding: 50px 0;
}
@media screen and (max-width: 600px) {
#search{
   padding:30px 0;
}
}


/* ----- section-column-pickup ----- */
#column-top{
    background: linear-gradient(150deg,rgba(183, 224, 245, 1) 0%, rgba(255, 255, 255, 1) 50%, rgba(183, 224, 245, 1) 100%);
}
#column-pickup{
  background-color: #9ED6F2;
}
#column-pickup img.column-img {
        border-radius: 10px;
}
.column-pickup-wrap {
  display: flex!important;
  padding: 50px 60px;
}
.column-pickup-left{
  width: 36%;
  text-align: left;
  padding-right: 20px;
}
.column-pickup-right{
  width: 64%;
}
img.column-img{
  width: 100%;
}
.column-title{
   font-weight: 600;
  text-align: left;
  color: #1d1d1d;
  line-height: 1.4;
  font-feature-settings: "palt";
}
#column-pickup .column-title{
  font-size: 24px;
  margin-top: 20px;
}
#column-pickup .date{
    color: #1d1d1d;
}
#column-pickup p{
  font-size: 16px;
  line-height: 1.6;
  text-align: left;
  margin-top:12px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    overflow: hidden;
    text-overflow: ellipsis;
}
#column-top .column-row {
margin-bottom: 0 !important;
}
#video.video-bottom {
padding-bottom: 50px;
}

/* column pickup — アクティブ以外は必ず非表示にする */
#column-pickup .pickup-slide > .column-pickup-wrap {
  display: none !important;
}
#column-pickup .pickup-slide > .column-pickup-wrap.is-active {
  display: flex !important;
}
.sp-pickup-slide{
	display: none!important;
}
#column-top #video {
  padding: 50px 0;
}

@media screen and (max-width: 1000px) {
.column-pickup-wrap{
  flex-direction: column-reverse;
    padding: 50px 40px;
}
.column-pickup-right {
    width: 100%;
}
.column-pickup-left {
    width: 100%;
    padding: 0;
}
}
@media screen and (max-width: 600px) {
.column-pickup-wrap{
  padding: 30px 20px;
}


.column-pickup-left {
    width: 100%;
    padding: 20px;
    background-color: #fff;
    border-radius: 0 0 6px 6px;
}
#column-pickup .column-title {
    font-size: 18px;
    margin-top: 0;
}
#column-pickup p{
  display: none;
}
#column-pickup .btn01{
    display: none;
}
#column-pickup img.column-img {
        border-radius: 6px 6px 0 0;
}

.sp-pickup-slide{
	display: block!important;
}
.pickup-slide{
	display: none;
}
	.sp-pickup-slide .card-wrapper{
		margin: 0 14px;
		padding: 20px 0 20px 0;
	}
	.sp-pickup-slide .card-wrapper{
		margin: 0 14px;
		padding: 20px 0 20px 0;
	}
	#column-pickup .sp-pickup-slide .column-title{
		margin-top: 8px;
	}
}
/* ----- section-column-category ----- */
#column-category{
    background: linear-gradient(150deg,rgba(183, 224, 245, 1) 0%, rgba(255, 255, 255, 1) 50%, rgba(183, 224, 245, 1) 100%);
}
#pc-column-list{
   display: flex;
   flex-wrap: wrap;
   row-gap: 30px;
    margin-bottom: 0 !important;
}

#column-category .column-row {
    margin-bottom: 0 !important;
}

#column-category #column{
  padding-top: 50px;
}
#column-category #video {
  padding: 50px 0;
}
@media screen and (max-width: 600px) {
#column-category #column {
    padding-top: 30px;
}


#sp-column-slide .card-wrapper {
        width: 45%;
        margin: 0 7px;
    }
#sp-pickup-slide .card-wrapper {
        margin: 0 20px;
    }
}


/* ----- section-column-single ----- */
#column-single{
    background: linear-gradient(150deg,rgba(183, 224, 245, 1) 0%, rgba(255, 255, 255, 1) 50%, rgba(183, 224, 245, 1) 100%);
}
.content1400{
  width: 1400px;
  display: inline-block;
}
.column-single-wrap{
   display: flex;
   margin : 50px 0 0 0;
	align-items: flex-start;
}


.column-single-left{
  width: calc(100% - 350px);
  background-color: #fff;
  border-radius: 10px;
  padding: 40px;
}
#column-single .text-wrap{
  margin-top: 12px;
}
h1.column-title{
  font-size: 24px;
}
#column-single h2{
  color: #1D4294;
  font-size: 20px;
  padding-bottom: 12px;
  border-bottom: 1px solid #E5E5E5;
}
#column-single h2, #column-single h3, #column-single h4{
  margin-top: 30px;
}
#column-single h3{
    font-size: 18px;
}
#column-single h4{
    font-size: 16px;
}
#column-single p{
  margin-top: 12px;
  text-align: justify;
}
.main-text{
  margin-top: 60px;
}
.column-single-right{
  width: 300px;
  margin-left: 50px;
}
.column-single-right p{
	 display: none;
}
.column-single-right .column-text-wrap {
    padding: 10px 15px 15px 15px;
}
.column-single-right ul{
  display: flex;
  flex-wrap: wrap;
  row-gap: 30px;
}
.column-single-right li{
  width: 300px;

}
.column-side-low{
  background-color: #fff;
  padding: 20px;
  border-radius: 0 0 8px 8px;
}
.column-side-low .column-title{
  font-size: 17px!important;
}
#column-single .column-row{
	margin-bottom: 0!important;
}
#column-single #video{
	padding: 50px 0;
}
@media screen and (max-width: 1400px) {
.content1400{
  width: 95%;
  margin: 0 2.5%;
  display: inline-block;
}
}

@media screen and (max-width: 600px) {
.column-single-wrap {
    flex-direction: column;
    margin: 30px 0 0 0;
}
#column-single h2 {
    font-size: 18px;
    padding-bottom: 6px;
}
#column-single .column-title {
    font-size: 20px;
}
.column-single-left {
    width: 100%;
    border-radius: 6px;
    padding: 20px;
}
.column-single-right{
  display: none;
}
#column-single h3{
    font-size: 16px;
}
#column-single h4{
    font-size: 15px;
}
#column-single .column-row {
        margin-bottom: 0 !important;
    }
#column-single .single-column{
	padding-bottom: 0;
}
}

/* ----- section-tos ----- */
#others{
    background: linear-gradient(150deg,rgba(183, 224, 245, 1) 0%, rgba(255, 255, 255, 1) 50%, rgba(183, 224, 245, 1) 100%);
}
#tos, #policy{
  padding: 50px 0;
}
.tos-wrap, .policy-wrap{
  background-color: #fff;
  padding: 40px;
  margin-top: 30px;
  text-align: justify;
  border-radius: 10px;
}
#others p{
  margin-top: 10px;
}
#others .cat-heading{
  margin-left: 6px;
}

#others h2{
  font-size: 20px;
  margin-top: 20px;
}
@media screen and (max-width: 600px) {
#tos, #policy{
  padding: 30px 0;
}
.tos-wrap, .policy-wrap{
  padding: 20px;
  margin-top: 10px;
  border-radius: 6px;
}
}
/* ----- section-company ----- */
#company{
  padding: 50px 0;
}
#company dl{
  display: flex;
  flex-wrap: wrap;
  margin-top: 30px;
}
#company dt{
  width: 34%;
  text-align: center;
  padding: 24px;
  background-color: #9ED6F2;
  margin-bottom: 1px;
}
#company dd{
  width: 66%;
  text-align: left;
  padding: 24px;
  margin-bottom: 1px;
    background-color: #fff;
}
.search-heading {
  display: flex;
  flex-wrap: wrap;
  gap: .4em;
  align-items: baseline;
}

.search-heading .search-keyword {
  font-weight: 600;
	font-size: 18px;
	margin-left: 0;
	font-feature-settings: "palt";
}

.search-heading .search-count {
  color: #666;
	font-size: 16px;
	margin-left: 0;
	font-feature-settings: "palt";
}
/* ヒットなし表示 */
.no-result {
  margin: 30px 0;
}

.no-result__text {
  font-weight: 600;
  margin-bottom: 8px;
}

.no-result__tips {
  margin: 8px 0 14px 1em;
  list-style: disc;
  color: #444;
}

/* 検索フォーム（共通） */
.search-form {
  display: flex;
  align-items: center;
  gap: 8px;
}

.search-form__input {
  width: 100%;
  max-width: 480px;
  height: 44px;
  padding: 0 12px;
  border: 1px solid #ddd;
  border-radius: 6px;
  background: #fff;
}

.search-form__btn {
  height: 44px;
  padding: 0 16px;
  border: 0;
  border-radius: 6px;
  background: #1D4294;
  color: #fff;
  font-weight: 600;
  cursor: pointer;
}

.search-form__btn:hover {
  filter: brightness(1.05);
}

@media (min-width:601px) {

  /* PCではSPリストを非表示 */
  #sp-cat-wrap {
    display: none;
  }
}
@media screen and (max-width: 600px) {
#company {
    padding: 30px 0;
}
#company dl{
  margin-top: 10px;
}
#company dt{
  width: 100%;
  padding: 6px;
}
#company dd{
  width: 100%;
  padding: 12px;
  margin-bottom: 1px;
}
  /* SPではPCリストを非表示、SPリスト幅調整 */
  #pc-cat-slide {
    display: none;
  }

.search-heading .search-keyword {
	font-size: 16px;
}

.search-heading .search-count {
  color: #666;
	font-size: 14px;
	margin-left: 0;
	font-feature-settings: "palt";
}

  .search-form {
    flex-wrap: wrap;
  }

  .search-form__btn {
    width: 100%;
  }
}

/* 検索/カテゴリ共通：もっと見る */
.loadmore-wrap{ text-align:center; margin:24px 0 8px; }
.loadmore-btn{
  display:inline-flex; align-items:center; justify-content:center;
  gap:.5em; min-width:220px; height:44px; padding:0 16px;
  background:#1d1d1d; color:#fff; border:0; border-radius:999px;
  font-weight:600; cursor:pointer; transition:filter .15s ease, opacity .15s ease;
}
.loadmore-btn:hover{ filter:brightness(1.05); }
.loadmore-btn:disabled,
.loadmore-btn.is-loading{ opacity:.7; cursor:default; }


/* PC/SP で表示するULを切替。カードのCSSは既存の .column-row / .sp 用メディアクエリで調整 */
#sp-column-list { display:none; }
@media (max-width:600px){
  #pc-column-list { display:none; }

#sp-column-list {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        row-gap: 20px;

    }
#moreColumn{
	display:none;
}
}
/* 「もっと見る」ボタンのラッパー */
.more-wrap { text-align:center; margin:24px 0 8px; }
.more-wrap.is-hidden { display:none; }   /* ← これで完全に消す */



/* ===== barba.js page transition curtain ===== */
.page-transition{
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 99999; /* すべての上 */
}

.page-transition__curtain{
  position: absolute;
  inset: 0;
  background: #1D4294;           /* ← お好みで */
  transform-origin: left center; /* 左→右に開閉 */
  transform: scaleX(0);          /* 初期は非表示 */
  will-change: transform;
}

/* 右→左にしたい場合に付け替えるためのクラス（JSから） */
.page-transition--from-right .page-transition__curtain{
  transform-origin: right center;
}

/* 斜めの動きを再現したい場合（オプション）：軽いグラデで見切れ感 */
.page-transition__curtain::after{
  content:"";
  position:absolute; inset:0;
  background: linear-gradient(120deg, rgba(255,255,255,.12), rgba(255,255,255,0) 60%);
  mix-blend-mode: overlay;
  pointer-events: none;
}

/* 動きが苦手な人への配慮 */
@media (prefers-reduced-motion: reduce){
  .page-transition__curtain{ transition:none !important; }
}

/* ===== 関連動画カードの高さ制限を解除して3行表示を許可 ===== */

/* a（カード本体）に高さが固定されている場合の解除 */
.single-related-wrap .single-card-wrapper,
.single-related-wrap .single-card-wrapper > a {
  height: auto !important;
  max-height: none !important;
  min-height: 0 !important;
  align-items: flex-start !important; /* 中央寄せで潰れるのを防ぐ */
}

/* 画像とテキストの横並びレイアウトで p が縮みにくい問題を防止 */
.single-related-wrap .single-text-wrap {
  min-width: 0 !important;  /* ← flex/grid 子の既定 min-width:auto を打ち消す */
  height: auto !important;
  max-height: none !important;
  overflow: visible !important; /* p 側で溢れを制御するので親は開放 */
}

/* 3行省略の決定版（ここが効けば3行出ます） */
.single-related-wrap .single-text-wrap p {
  font-size: 16px;
  line-height: 1.6;
  color: #1d1d1d;
  margin-top: 12px;

  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
  text-overflow: ellipsis;

  /* 親の高さ制限に負けないための実高さ（保険） */
  max-height: calc(1em * 1.6 * 3);
  white-space: normal;
  word-break: break-word;
}

/* 画像側がカードの高さを支配しないように（必要な場合） */
.single-related-wrap .single-related-img {
  flex: 0 0 auto;           /* 画像は伸縮しない */
  height: auto !important;  /* 画像で a の高さを縛らない */
}

/* オーバーレイの共通デザイン */
.orientation-overlay {
  position: fixed;
  inset: 0;
  display: none; /* 初期は非表示 */
  justify-content: center;
  align-items: center;
  background: rgba(0,0,0,0.8);
  z-index: 9999;
  text-align: center;
  padding: 20px;
  box-sizing: border-box;
}

.orientation-overlay .overlay-message {
  color: #fff;
  font-size: 16px;
  line-height: 1.6;
  background: rgba(255,255,255,0.1);
  padding: 15px 25px;
  border-radius: 6px;
}
/* SP（最大767px）かつ横向きの時だけ表示 */
@media screen and (orientation: landscape) {
.orientation-overlay {
display: flex;
}
/* SP横向き検出：
   - 通常：orientation: landscape
   - Chrome等の環境で拾えない場合に備え、横長比(min-aspect-ratio)も併用 */
@media screen and (max-width: 900px) and (orientation: landscape){

  /* 1) headerを隠す */
  header { display: none !important; }

  /* 2) main { margin-top:80px } → 0 */
  main { margin-top: 0 !important; }

  /* 3) iframeのみ 100vh */
  .video-single-main iframe {
    height: 100vh !important;
  }

  /* 4) .video-single-main の padding を指定どおりに */
  .video-single-main {
    padding: 0 min(5.714vw, 80px) min(3.571vw, 50px) min(5.714vw, 80px) !important;
  }
}
}