@charset "utf-8";
@media screen and (min-width:1980px){
	#topslider {
		height: auto;
		aspect-ratio: 5 / 4;
	}
}

/* =========================
   1023px以下（タブレット）
========================= */
@media screen and (max-width: 1023px) {
	.inner {
		padding-right: 70px;
	}	
	
	.pcnav{
		display: none;
	}
	#header {
		padding-right: 0;
		height: 60px;
	}
	.fcta .inner{
		padding-right: 0;
	}
	
	.fv-inner {
		height: 90%;
	}	
	#fv h2 {
		font-size: clamp(1.875rem, 0.787rem + 3.16vw, 2.813rem);
		margin-bottom: clamp(30px, 4vw, 60px);
		padding-left: 1vw;
	}
	#fv h3 {
		font-size: clamp(0.938rem, 0.575rem + 1.05vw, 1.25rem);
		margin-bottom: clamp(30px, 4vw, 60px);
		padding-left: 1vw;
	}

	.fvbtn{	
		padding-left: 1vw;
		margin-bottom: clamp(20px, 3vw, 40px);
	}	
  .video-wrap {
    max-width: 90%;
  }

  .container {
    padding: 0 20px;
  }
	
  .reason-list {
    grid-template-columns: repeat(2, 1fr);
  }

  .reason-card {
    grid-column: auto !important;
  }	
	.footer-flex {
		flex-direction: column
	}
	.footer-info,.footer-nav{
		width: 100%;
	}
	.footer-info{text-align: center;}
	.page-hero{margin-top: 60px}
}

@media screen and (max-width: 819px) {
	.case_wrap {
		flex-direction: column-reverse;
	}
	.casecontent {
		width: 100%;
		padding: 30px 20px 0;
		margin-bottom: 0;

	}	
	.caseimg {
		width: 80%;
		margin: 0 auto;
	}
	.sec_ttl {
	  text-align: left;
	}
	.t_case {
		padding-bottom: 150px;
	}
	.slide-wrap{
		width: 100%;
	}
}

/* =========================
   767px以下（タブレット縦〜スマホ）
========================= */
@media screen and (max-width: 767px) {
  body {
    font-size: 15px;
  }
	#header{
		display: none;
	}
	.copy {
		padding-bottom: 80px;
	}
	.inner {
		padding-right: 0px;
	}	

	.fixed-cta{
		display: none;
	}
	.fv-logo img {
		height: 35px;
	}	
	.fvbtn a {
		padding: 16px 65px;
		font-size: clamp(0.938rem, 0.145rem + 2.3vw, 1.25rem);
	}	
  .reason-list {
    grid-template-columns: repeat(1, 1fr);
    gap: 20px;
  }

  .reason-headline {
    height: auto;
  }

  .reason-body .icon {
    width: 80px;
    height: 80px;
  }
  .video-wrap {
    max-width: 100%;
  }	
  video-js {
    max-height: 60vh;
  }

	.ttlwrap {
		width: 100%;
		margin-bottom: 20px;
	}
	.ttlwrap .sec_ttl{
		text-align: left;
	}
	#newsWrap {
		width: 100%;
		height: 200px;
	}	
	.cta_chilled {
		width: 100%;
	}	
	.cta_chilled.web {
		border-right: 0px solid #fff;
		border-bottom: 1px solid #fff;
	}	
	.footer-nav{
		display: none;
	}
	.page-hero{margin-top: 0px}
}
@media screen and (max-width: 600px) {
	.serv-list {
		flex-direction: column;
	}
}
/* =========================
   550px以下（スマホ中）
========================= */
@media screen and (max-width: 550px) {


  /* タイトル詰める */
  h1, h2 {
    line-height: 1.3;
  }
	.btn-more {
		min-width: 280px;
	}
	.fv-inner {
		height: 100%;
		padding: 0 20px;
	}
	.fv-logo {
		top: clamp(15px, 2vh, 30px);
		left: clamp(15px, 3vh, 40px);
	}
	 .fv-logo img {
        height: 25px;
    }
	#fv h2 {
		font-size: clamp(1.375rem, 0.428rem + 4.21vw, 1.875rem);
		margin-bottom: clamp(25px, 3vw, 40px);
		padding-left: .5vw;
	}
	#fv h3 {
		font-size: clamp(0.875rem, 0.756rem + 0.53vw, 0.938rem);
		margin-bottom: clamp(20px, 2vw, 30px);
		padding-left: .5vw;
	}

	.fvbtn{	
		padding-left: .5vw;
		margin-bottom: clamp(20px, 3vw, 40px);
	}	
    .fvbtn a {
        padding: 10px 55px;
    }
	.fvbtn a::before{
		width: 25px;
		height: 16px;	
	}
	.fvbtn a::after {
		width: 18px;
		height: 14px;	
	}	
/*理由カード*/	
	.reason-head p{
	word-break: keep-all;	
	}
	.reason-head pspan.ib{
		display: block!important;
	}

  .reason-list {
    grid-template-columns: 1fr;
    gap: 15px;
    margin-top: 40px;
  }

  .reason-card {
    padding: 20px 15px;
  }

  .reason-card h3 {
    font-size: 16px;
  }

  .reason-card p {
    font-size: 14px;
  }	

  /* 動画高さ暴れ対策 */
  .video-wrap {
    max-width: 100%;
  }
	
  video-js {
    max-height: 60vh;
  }
		html {
    word-break: auto-phrase;
	}	
}
@media(max-width:400px){

	span.ib{
		display: contents!important;
	}
	.reason-head span.ib{
		display: block!important;
	}
	.reason p{
		text-align: left;
	}
	#newsList li .up_ymd {
		display: block;
		width: 100%;
	}
	.company-table th,
	.company-table td {
		width: 100%;
		display: block;
	}
}

/* =========================
   360px以下（小さいスマホ）
========================= */
@media screen and (max-width: 359px) {

  body {
    font-size: 14px;
  }

	.reason-head h2 {
		font-size: 19px;
		margin-bottom: 40px;
	}
  .reason-card {
    padding: 15px 10px;
  }

  .reason-body .icon {
    width: 50px;
    height: 50px;
  }	
}