@charset "utf-8";

/* CSSアニメーションの設定 */
@keyframes SlideIn {
  0% {
    opacity: 0;/*初期状態では透明に*/
    transform: translateX(-64px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
@keyframes gradientEffect {
  from {background-position: left}
  to {background-position: right}
}
@keyframes gradientEffect {
  from {background-position: left}
  to {background-position: right}
}
h1{
	font-size: 1.2rem;
	font-weight: 400;
	white-space: nowrap;
}

.content{
	padding-bottom: 88px;
}
.top_ttl {
	font-size: 4rem;
	padding-top:88px;
	margin-bottom: 44px;
	}

.content h2 {
	font-size: 3.8rem;
	margin-bottom: 44px;
	}
.img01 {
	margin-bottom: 88px;
	
	}

.txt {
	font-size: 2.6rem;
	margin-bottom: 88px;
	}

.txt_01 {
	margin-bottom: 88px;
	
	}

.gold {}

.ttl {
	font-size: 3rem;
	margin-bottom: 22px;
	}

.ttl_01 {

}

.img05 {
	margin-bottom: 120px;
	}

.ttl_02 {
		margin-bottom: 44px;
}

.img03 {
	margin-bottom: 140px;
	}

.txt_02 {
	
	margin-bottom: 88px;
	}

.img06 {
	margin-bottom: 88px;
	}

.flexArea{
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
}

.flexArea div{
	width: 35%;
	margin-bottom: 44px;
}

.flexArea div img{
	margin-bottom: 10px;
}
.flexArea div h4{
	font-size: 2.4rem;
	font-weight: 400;
}


.ttl_03 {}

.txt_03 {}

.flexArea {}

.ttl_04 {}

.txt_04 {}

.img011 {
	margin-bottom: 88px;
	}

.ttl_05 {}

.ttl_06 {}

.ttl_07 {
	
	}

.img020 {
	margin-bottom: 88px; 
	}

.content h3 {}

.prodct_txt {
	font-size: 2.8rem;
	}

.prodct_no {
	
	font-size: 2.8rem;
	}

.prodct_ttl {
	font-size: 3.4rem;
	margin-bottom: 44px;
	}

.img021 {
	margin-bottom: 44px;
	}

.img022 {margin-bottom: 88px;}

.img023 {margin-bottom: 44px;}

.btn {
	padding: 3% 5%;
	border: thin #fff solid;
	}

.btn:hover {
	opacity: .5;
	
}




@media all and (min-width: 767px) {
/*--------------------------------------
フェードイン
--------------------------------------*/

/*右から*/
.fadein2 {
    opacity : 0;
    transform : translate(50px, 0);
    transition : all 800ms;
    }

.fadein2.scrollin {
    opacity : 1;
    transform : translate(0, 0);
    }

/*左から*/
.fadein22 {
    opacity : 0;
    transform : translate(-50px, 0);
    transition : all 600ms;
    }
.fadein22.scrollin2 {
    opacity : 1;
    transform : translate(0, 0);
    }

/*したから*/
.fadein23 {
    opacity : 0;
    transform : translate(0, 50px);
    transition : all 600ms;
    }
.fadein23.scrollin3 {
    opacity : 1;
    transform : translate(0, 0);
    }
}
  .pc {
    display: block!important;
  }
  .sp {
    display: none !important;
  }
@media all and (max-width: 767px) {

.pc {
    display: none!important;
  }
  .sp {
    display: block!important;
  }
	
	
.logoArea{
	margin: 20px 0 0 3vw;
    position: absolute;
}

/*--------------------------------------
フェードイン
--------------------------------------*/

/*右から*/
.fadein2 {
    opacity : 0;
    transform : translate(50px, 0);
    transition : all 800ms;
    }

.fadein2.scrollin {
    opacity : 1;
    transform : translate(0, 0);
    }

/*左から*/
.fadein22 {
    opacity : 0;
    transform : translate(-50px, 0);
    transition : all 600ms;
    }
.fadein22.scrollin2 {
    opacity : 1;
    transform : translate(0, 0);
    }

/*したから*/
.fadein23 {
    opacity : 0;
    transform : translate(0, 50px);
    transition : all 600ms;
    }
.fadein23.scrollin3 {
    opacity : 1;
    transform : translate(0, 0);
    }

	
.content{
	padding-bottom: 88px;
}
.top_ttl {
	font-size: 3rem;
	padding-top:88px;
	margin-bottom: 44px;
	}

.content h2 {
	font-size: 2.6rem;
	margin-bottom: 44px;
	}
.img01 {
	margin-bottom: 88px;
	
	}

.txt {
	font-size: 1.6rem;
	margin-bottom: 88px;
	}

.txt_01 {
	margin-bottom: 88px;
	
	}

.gold {}

.ttl {
	font-size: 2.2rem;
	margin-bottom: 22px;
	}

.ttl_01 {

}

.img05 {
	margin-bottom: 120px;
	}

.ttl_02 {
		margin-bottom: 44px;
}

.img03 {
	margin-bottom: 88px;
	}

.txt_02 {
	
	margin-bottom: 88px;
	}

.img06 {
	margin-bottom: 88px;
	}

.flexArea{
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
}

.flexArea div{
	width: 35%;
	margin-bottom: 44px;
}

.flexArea div img{
	margin-bottom: 10px;
}
.flexArea div h4{
	font-size: 1.6rem;
	font-weight: 400;
}


.ttl_03 {}

.txt_03 {}

.flexArea {}

.ttl_04 {}

.txt_04 {}

.img011 {
	margin-bottom: 44px;
	}

.ttl_05 {}

.ttl_06 {}

.ttl_07 {
	
	}

.img020 {
	margin-bottom: 88px; 
	}

.content h3 {}

.prodct_txt {
	font-size: 2rem;
	}

.prodct_no {
	
	font-size: 1.8rem;
	}

.prodct_ttl {
	font-size: 2rem;
	margin-bottom: 44px;
	}

.img021 {
	margin-bottom: 44px;
	}

.img022 {margin-bottom: 88px;}

.img023 {margin-bottom: 44px;}

.btn {
	padding: 3% 5%;
	border: thin #fff solid;
	}

.btn:hover {
	opacity: .5;
	
}


	
}