/* content style
-----------------------------------------------------------*/
/* common */

.w-half #contents {
  /*max-width: 980px;*/
  width: 100%;
  margin: 0;
  padding: 0;
}


/*--------------------------------*/
/*アニメーション*/

.tsp{ opacity:0; }


.bottom_to_top_anime {
	animation: bottom_to_top_anime_flm 1s forwards;
	-webkit-animation: bottom_to_top_anime_flm 1s forwards;
}
@keyframes bottom_to_top_anime_flm {
0% {transform: translate(0px, 40px); opacity:0;}
100% {transform: translate(0px, 0px); opacity:1;}
}



/*--------------------------------*/
/*fv*/

.w-half .fv {
  position: relative;
  width: 100%;
  height: 70vh;
  min-height: 600px;
  max-height: 800px;
  background: url(../images/pc/fv/bg.jpg) center center no-repeat;
  background-size: auto 100%;
}

.w-half .fv h1 {
  position: absolute;
	top: 50%;
	left: 50%;
	margin-right: -50%;
  margin-top: 20px;
	transform: translate(-50%, -55%);
  display: block;
  overflow: hidden;
  padding-top: 550px;
  height: 0 !important;
  line-height: 250%;
  width: 650px;
  background: url(../images/pc/fv/image.png?2) center center no-repeat;
  background-size: 100%;
}

.w-half .fv img {
  position: absolute;
  bottom: 4%;
  left: 50%;
  margin-left: -700px;
  width: 370px;
}



/*--------------------------------*/
/*製品の特徴*/

.w-half .attribute {
  position: relative;
  margin: 40px auto;
  width: 100%;
  max-width: 1200px;
}

.w-half .attribute h1 {
  display: block;
  overflow: hidden;
  margin: 0 auto;
  padding-top: 10%;
  height: 0 !important;
  line-height: 250%;
  width: 100%;
  background: url(../images/pc/attribute/title_text.svg) top center no-repeat;
  background-size: 100%;
}

.w-half .attribute .in_block {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 70px;
}

.w-half .attribute .in_block div:nth-of-type(1) h2 {
  display: block;
  overflow: hidden;
  margin: 0;
  margin-bottom: 10px;
  padding-top: 12%;
  height: 0 !important;
  line-height: 250%;
  width: 100%;
  background: url(../images/pc/attribute/sub_title_2.svg) center center no-repeat;
  background-size: 95%;
  background-color: #003b90;
  border-radius: 5px;
}

.w-half .attribute .in_block div:nth-of-type(2) h2 {
  display: block;
  overflow: hidden;
  margin: 0;
  margin-bottom: 10px;
  padding-top: 12%;
  height: 0 !important;
  line-height: 250%;
  width: 100%;
  background: url(../images/pc/attribute/sub_title_1.svg) center center no-repeat;
  background-size: 95%;
  background-color: #003b90;
  border-radius: 5px;
}

.w-half .attribute .u_line {
  border-bottom: 1px solid #000000;
}

.w-half .attribute .in_block p {
  margin-bottom: 10px;
}



/*--------------------------------*/
/*動画での紹介*/

.w-half .attribute-movie{
  position: relative;
  margin: 40px auto 140px auto;
  width: 100%;
  max-width: 1200px;
  text-align: center;
}

.w-half .attribute-movie h1 {
  display: block;
  overflow: hidden;
  margin: 0 auto;
  padding-top: 8%;
  height: 0 !important;
  line-height: 250%;
  width: 100%;
  background: url(../images/pc/attribute-movie/title_text.svg) top center no-repeat;
  background-size: 100%;
}

.w-half .attribute-movie .youtube{
position: relative;
margin: 0px auto;
width: 100%;
max-width: 600px;
}

.w-half .attribute-movie .youtube::after {
	content: "";
	display: block;
	position: absolute;
	bottom: 0px;
	right: -280px;
	width: 240px;
	height: 300px;
  background: url(../images/pc/attribute-movie/item.jpg) bottom center no-repeat;
  background-size: 100%;
}

.w-half .attribute-movie .brand-youtube__thumbnail {
margin: 15px auto 0;
width: 100%;
}

.w-half .attribute .sp_block{
display: none;
}



/*--------------------------------*/
/*ショップリンク*/

.shop_link {
  margin: 0 0 100px 0;
  padding: 0;
  text-align: center;
}

.shop_link a {
  position: relative;
  display: inline-block;
  margin: 0;
  padding: 20px 70px 20px 60px;
  background-color: #3d8b42;
  text-align: center;
  color: #fff;
  text-decoration: none;
  font-weight: bold;
  font-size: 1.5em;
  border-radius: 3.2rem;
}

.shop_link a:hover {
  background-color: #53a658;
  color: #fff;
}

.shop_link a::after {
  content: "";
  display: block;
  position: absolute;
  top: calc(50% - 9px);
  right: 20px;
  width: 15px;
  height: 15px;
  border-top: 4px solid #ffffff;
  border-right: 4px solid #ffffff;
  transform: rotate(45deg);
}








/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/

/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/

/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/

/* For SP -------------------------------------- */
@media screen and (max-width: 736px) {

.w-half .fv {
  /*height: 90vh;
  min-height: 200px;*/
	height: 700px;
  background: url(../images/sp/fv/bg.jpg) center center no-repeat;
  /*background-size: cover;*/
  background-size: 100%;
}

.w-half .fv h1 {
  position: absolute;
	top: 55%;
	left: 15%;
	transform: translate(0, -55%);
  display: block;
  overflow: hidden;
  padding-top: 70%;
  height: 0 !important;
  line-height: 250%;
  width: 70%;
  background: url(../images/pc/fv/image.png?2) center center no-repeat;
  background-size: 100%;
}

.w-half .fv img {
  position: absolute;
  top: 50%;
  left: 30%;
	bottom:auto;
  margin-left: -50px;
	margin-top: -80%;
  height: auto;
  width: 65%;
}


/*--------------------------------*/
/*製品の特徴*/

.w-half .attribute {
  box-sizing: border-box;
  position: relative;
  margin: 40px 10px;
  width: auto;
}

.w-half .attribute h1 {
  display: none;
}

.w-half .attribute .in_block {
  display: grid;
  grid-template-columns: 1fr;
  grid-gap: 70px;
}

.w-half .attribute .in_block div:nth-of-type(1) h2 {
  display: block;
  overflow: hidden;
  margin: 0;
  margin-bottom: 10px;
  padding-top: 50%;
  height: 0 !important;
  line-height: 250%;
  width: 100%;
  background: url(../images/sp/attribute/sub_title_2.svg) center center no-repeat;
  background-size: 95%;
}

.w-half .attribute .in_block div:nth-of-type(2) h2 {
  display: block;
  overflow: hidden;
  margin: 0;
  margin-bottom: 10px;
  padding-top: 50%;
  height: 0 !important;
  line-height: 250%;
  width: 100%;
  background: url(../images/sp/attribute/sub_title_1.svg) center center no-repeat;
  background-size: 95%;
}

.w-half .attribute .u_line {
  border-bottom: 1px solid #000000;
}

.w-half .attribute .in_block p {
  margin: 0px auto;
  margin-bottom: 30px;
  width:73%;
}

.w-half .attribute .sp_block{
display: block;
width:40%;
float: right;
margin-left: 10px;
}

.w-half .attribute picture img{
display: block;
margin: 0px auto;
width:73%;
}



/*--------------------------------*/
/*動画での紹介*/

.w-half .attribute-movie{
  margin: 40px auto 40px auto;
}

.w-half .attribute-movie h1 {
  padding-top: 80%;
  background: url(../images/sp/attribute-movie/title_text.jpg) top center no-repeat;
  background-size: auto 100%;
}

.w-half .attribute-movie .youtube{
width: calc(100% - 40px);
}

.w-half .attribute-movie .youtube::after {
	content: "";
	display: none;
}







/*--------------------------------*/
/*ショップリンク*/

.shop_link a {
  font-size: 1em;
  border-radius: 2.9rem;
}


.shop_link a::after {
  width: 12px;
  height: 12px;
}


} /* end sp*/



/* end */
