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

/**********************************************************/
/* PC */
/**********************************************************/





/**********************************
ローディング
**********************************/
#splash {
    /*fixedで全面に固定*/
	position: fixed;
	z-index: 9999;
	width: 100%;
	height: 100vh;
	background:#fff;
	text-align:center;
	color:#fff;
}
/* Loadingバー中央配置　*/
#splash_text{
	position: absolute;
	top: 55%;
	left: 50%;
  z-index: 999;
	transform: translate(-50%, -55%);
	color: #000;
  width: 17%;
}

#splash img{
	position: absolute;
	top: 50%;
	left: 50%;
  z-index: 999;
	transform: translate(-50%, -50%);
	color: #fff;
  width: 17.7%;
}
/*IE11対策用バーの線の高さ※対応しなければ削除してください*/
#splash_text svg{
    height: 2px;
}


/**********************************
section共通
**********************************/


/**********************************
header
**********************************/

/**********************************
　ファーストビュー
**********************************/
.fv .picture-wrap{
  position: absolute;
  top:0;
  right: 0;
  width: 65.34%;
  height: 100vh;
  z-index: -1;
}
.zoomOut{
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.zoomOut img{
  width:100%;
  height: auto;
  animation-duration: 0s;
  animation-timing-function: ease-in-out;
  animation-name: easeInOut;
}
@keyframes easeInOut {
   0% {
  transform: scale(1.4);
   }
   100% {
  transform: scale(1.0);
   }
}


/*.fv .picture-wrap img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
*/.fv .left-box{
  position: absolute;
  content: "";
  top:200px;
  left: 0;
  width: 8px;
  height: 208px;
  background: #000;
}
.fv .inner {
  position: absolute;
  top: 118px;
  left: 146px;
  color: #333;
}
.fv h2{
  font-size: 5.5rem;
  font-size: min(5.5rem,6.79vh);
  line-height: 1.3;
}
.fv h2 span.gothic.vertical.bold {
  font-size: 1.4rem;
  display: block;
  line-height: 2;
  margin-right: 96px;
}
.tel-bg{
  position: absolute;
  bottom: -50px;
  right: 0;
  background: #000;
  color: #fff;
  z-index: 1;
  width: 803px;
  height: 134px;
}
.fv-ttl-first{
  margin-top: 12px;
  letter-spacing: 0.1em;
}
.fv-ttl-second{
  margin-top: 135px;
  letter-spacing: 0.1em;
}



/**********************************
  メディア実績
**********************************/
.media-sec{
  margin-top: 80px;
}
.media-sec .pic-wrap{
  margin-top: 157px;
  width: 50%;
}
.media-sec .pic-wrap{
  width: 382px;
  height: 509px;
  margin: 165px auto auto;
}
.media-sec .pic-wrap img{
  object-fit: cover;
  width: 100%;
  height: 100%;
  box-shadow: 1px 3px 3px rgba(0,0,0,.2);
}
.media-sec .txt-wrap{
  width: 50%;
  padding-left: 90px;
}
.media-sec h2{
  margin-left: 490px;
}
.media-sec h3{
  margin-top: -108px;
}
.media-sec .txt-wrap li,
.media-sec .txt-wrap p{
  line-height: 2.1;
}
.media-sec .txt-wrap ul{
  margin-bottom: 45px;
}


/**********************************
  バナー
**********************************/

.banner-sec{
  margin-top: 80px;
}
.pc-banner{
  width: 60%;
  min-width: 800px;
  margin: 0 auto;
}

.pc-banner img{
    width: 100%;
    object-fit: cover;
}

/**********************************
  駆除宣言
**********************************/
.extermination-sec{
  margin-top: 48px;
  color: #fff;
}
.extermination-sec .ttl_wrap{
  background-image: url("../images/top/extermination.jpg");
  background-repeat: no-repeat;
  background-position: center;
  margin: auto;
}
.ttl_wrap .inner2{
  width: 100%;
  justify-content: space-between;
  align-items: center;
  padding: 112px 0;
}
.extermination-sec .ttl_wrap h2{
  border:solid 1px #fff;
  margin-right: 40px;
}
.extermination-sec h3,
.extermination-sec h4{
  margin-left: 90px;
}
.extermination-sec h3{
  font-family:'Roboto', sans-serif;
}
.extermination-sec h4{
  font-family: 'Noto Serif', serif;
}
.extermination-sec .wrap{
  margin:-40px 100px 0 0;
  background: #000;
  padding-top:10px
}
.extermination-sec .wrap div{
  margin:0 10px 0 0;
  border-top:solid 1px #fff;
  border-right:solid 1px #fff;
  padding: 80px 0;
}
.extermination-sec dl{
  max-width: 561px;
  margin: 0 auto 87px;
}
.extermination-sec dt{
  font-size: 2rem;
  background: #BE0000;
  width: 409px;
  line-height: 1.3;
  padding-left: 10px;
}
.extermination-sec dd{
  line-height: 2;
  margin:10px 0 0 22px;
}


/**********************************************************/
/* SP用 */
/**********************************************************/

@media(max-width: 768px) {
  
  
  
/**********************************
ローディング
**********************************/
/* Loadingバー中央配置　*/
#splash_text{
	position: absolute;
	top: 55%;
	left: 50%;
  z-index: 999;
	transform: translate(-50%, -55%);
	color: #000;
  width: 68%;
}

#splash img{
	position: absolute;
	top: 50%;
	left: 50%;
  z-index: 999;
	transform: translate(-50%, -50%);
	color: #fff;
  width: 68%;
}
/*IE11対策用バーの線の高さ※対応しなければ削除してください*/
#splash_text svg{
    height: 2px;
}

  

/**********************************
　ファーストビュー
**********************************/
.fv .inner {
    position: absolute;
    top: 156px;
    left: 2%;
    color: #fff;
}
.fv h2 {
    font-size: 2.8rem;
    line-height: 1.3;
}
.fv-ttl-first{
    margin-top: 0;
}
.fv-ttl-second {
    margin-top: 30px;
}
.fv h2 span.gothic.vertical.bold {
    font-size: 1.7rem;
    display: block;
    line-height: 2;
    margin-right: 40px;
}
.fv .picture-wrap{
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100vh;
    z-index: -1;
}
  .zoomOut img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.fv .left-box {
    display: none;
}  

/**********************************
  メディア実績
**********************************/
.media-sec h2 {
    margin-left: auto;
}
.media-sec .reverse{
    display: block;
}
.media-sec .txt-wrap {
    width: 100%;
    padding: 0 4% 0 2%;
    text-align: center;
}
.media-sec .txt-wrap h2,
.media-sec .txt-wrap h3,
.media-sec .txt-wrap h4,
.media-sec .txt-wrap p,
.media-sec .txt-wrap ul{
    text-align: left;
}
.media-sec .pic-wrap {
  margin-top: 40px;
  width: 70.5vw;
  height: 355px;
}
.media-sec .pic-wrap p {
    margin: -10px auto 0 3%;
    font-size: 1rem;
}  
  
  
/**********************************
  バナー
**********************************/
.sp-banner{
  margin: 0 auto;
  width: 90vw;
}

/**********************************
  駆除宣言
**********************************/
.extermination-sec .wrap {
    margin: -20px 6% 0 0;
    background: #000;
    padding-top: 3px;
}
.extermination-sec .wrap div {
    margin: 0 3px 0 0;
    border-top: solid 1px #fff;
    border-right: solid 1px #fff;
    padding: 44px 0 0;
}
.extermination-sec dl {
    max-width: 96%;
    margin: 0 auto 55px;
}  
.extermination-sec dt {
    font-size: 1.4rem;
    background: #BE0000;
    width: 100%;
    line-height: 2;
    padding-left: 10px;
}
.extermination-sec .ttl_wrap h2 {
    margin: -10px 0 0 auto;
}
.extermination-sec h3,
.extermination-sec h4 {
    margin-left: 0;
}  
.ttl_wrap .inner2 {
    padding: 28px 0 46px;
    width: 94%;
}
.extermination-sec .reverse div{
    min-width: 270px;
}
.extermination-sec dd {
    margin: 0;
}

  
  

}