@charset "UTF-8";

/*===============================================
●tablet.css 画面の横幅が992pxまで
===============================================*/
@media screen and (min-width: 993px){
img{
max-width: 100%;
height: auto;
width /***/:auto;　
}
#container{
width:100%;
}

/*font*/
@font-face {
  font-family: 'Questrial-Regular';
  src: url("../fonts/Questrial-Regular.ttf");
}

/* 共通 */
*{
	cursor: url(../images_new/top/cursor.cur),url(../images_new/top/cursor.png),url(../images_new/top/cursor.gif),auto;
}

body {
	font-size: 18px;
	font-family: 'Sawarabi Mincho', sans-serif;
/*	font-family:"小塚ゴシック", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "ＭＳ Ｐゴシック", "MS PGothic";*/
}

p{
line-height: 200%;
}

#wrap {
}



ul{
	list-style-type: none;
}




.top10{
	margin-top:10px;
}

.top20{
	margin-top:20px;
}

.top30{
	margin-top:30px;
}

.top40{
	margin-top:40px;
}

.top50{
	margin-top:50px;
}

.top60{
	margin-top:60px;
}

.top70{
	margin-top:70px;
}

.top80{

	margin-top:80px;
}
.top100{
	margin-top:100px;
}

.bottom5{
	margin-bottom:5px;
}

.bottom10{
	margin-bottom:10px;
}

.bottom20{
	margin-bottom:20px;
}

.bottom30{
	margin-bottom:30px;
}

.bottom40{
	margin-bottom:40px;
}

.bottom50{
	margin-bottom:50px;
}

.bottom60{
	margin-bottom:60px;
}

.padding30{
	padding-right:30px;
}

/* clear */
.clear {
	clear: both;
}


/* section01 */
.section01 img {
	width:100%;
}





/* section02 */
.section02 {
	margin-top: 200px;
	margin-bottom: 200px;
}

.section02 img.exhibitionconcept {
	width: 280px;
}

.section02 .h2img{
	margin-top:auto;
	margin-bottom:auto;
}

.section02 .h2text {
	margin-top:auto;
	margin-bottom:auto;
	line-height:200%;/*◆*/
}



/* section03 */
.map{
	width:100%;
	height:500px;
	padding:30px;
}


/* section04 */
.section04 {
	margin-top: 150px;
	margin-bottom: 60px;
}

.section04 img.exhibitioncontents {
	width: 280px;
	height: 115px;
	margin-right:auto;
}

.section04 .h2img{
	margin-top:auto;
	margin-bottom:auto;
}

.section04 .h2text {
	line-height:200%;/*◆*/
	margin-top:auto;
	margin-bottom:auto;
}








/* section05 */
.section05 img {
	width:100%;
}

.p_hidden{
display:none;
}


/* 画像上に文字 反転 */
/* Seeknit by Kinkiamibari */
.imgWrap1 {
	overflow: hidden;
}
.imgEff1 {
	position: relative;
	width: 100%;
	height: 100%;
	transition-duration: 0.2s;/*変化に掛かる時間*/
}
.imgEff1:hover {
	transform: scale(1.05);/*拡大率*/
}
.imgEff1:before {
	position: absolute;
	width: 100%;
	height: 100%;
	background: radial-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.8)); /* 円形グラデーション */
	transition-duration: 0.4s;/*文字の変化に掛かる時間*/
	opacity: 0; /* 見えないように透過しておく */
	white-space: pre;
	content: '       Seeknit\A by Kinkiamibari'; /* 表示するテキスト */
font-family:'Century Gothic','Questrial-Regular';
	background: radial-gradient(rgba(0, 0, 0, 0.3), #000000); /* けっこう暗くしないと文字が見にくいので注意 */
	display: flex; /* 文字の中央配置 */
	justify-content: center; /* 文字の中央配置 */
	align-items: center; /* 文字の中央配置 */
	color: #fff;
	font-size: 18px;
/*	text-shadow: 0 0 2px #000;*/
	filter: blur(4px); /* ブラー効果 */
}
.imgEff1:hover:before {
	opacity: 1; /* マウスオーバーで可視化 */
	transform: scale(1.3); /* 文字の拡大率 */
	filter: blur(0); /* ブラー効果を解除 */
}



/* Japan Quality */
.imgWrap2 {
	overflow: hidden;
}
.imgEff2 {
	position: relative;
	width: 100%;
	height: 100%;
	transition-duration: 0.2s;/*変化に掛かる時間*/
}
.imgEff2:hover {
	transform: scale(1.05);/*拡大率*/
}
.imgEff2:before {
	position: absolute;
	width: 100%;
	height: 100%;
	background: radial-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.8)); /* 円形グラデーション */
	transition-duration: 0.4s;/*文字の変化に掛かる時間*/
	opacity: 0; /* 見えないように透過しておく */
	white-space: pre;
	content: 'Japan Quality'; /* 表示するテキスト */
font-family:'Century Gothic','Questrial-Regular';
	background: radial-gradient(rgba(0, 0, 0, 0.3), #000000); /* けっこう暗くしないと文字が見にくいので注意 */
	display: flex; /* 文字の中央配置 */
	justify-content: center; /* 文字の中央配置 */
	align-items: center; /* 文字の中央配置 */
	color: #fff;
	font-size: 18px;
/*	text-shadow: 0 0 2px #000;*/
	filter: blur(4px); /* ブラー効果 */
}
.imgEff2:hover:before {
	opacity: 1; /* マウスオーバーで可視化 */
	transform: scale(1.3); /* 文字の拡大率 */
	filter: blur(0); /* ブラー効果を解除 */
}



/* Sustainable */
.imgWrap3 {
	overflow: hidden;
}
.imgEff3 {
	position: relative;
	width: 100%;
	height: 100%;
	transition-duration: 0.2s;/*変化に掛かる時間*/
}
.imgEff3:hover {
	transform: scale(1.05);/*拡大率*/
}
.imgEff3:before {
	position: absolute;
	width: 100%;
	height: 100%;
	background: radial-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.8)); /* 円形グラデーション */
	transition-duration: 0.4s;/*文字の変化に掛かる時間*/
	opacity: 0; /* 見えないように透過しておく */
	white-space: pre;
	content: 'Sustainable'; /* 表示するテキスト */
font-family:'Century Gothic','Questrial-Regular';
	background: radial-gradient(rgba(0, 0, 0, 0.3), #000000); /* けっこう暗くしないと文字が見にくいので注意 */
	display: flex; /* 文字の中央配置 */
	justify-content: center; /* 文字の中央配置 */
	align-items: center; /* 文字の中央配置 */
	color: #fff;
	font-size: 18px;
/*	text-shadow: 0 0 2px #000;*/
	filter: blur(4px); /* ブラー効果 */
}
.imgEff3:hover:before {
	opacity: 1; /* マウスオーバーで可視化 */
	transform: scale(1.3); /* 文字の拡大率 */
	filter: blur(0); /* ブラー効果を解除 */
}


/*Koshitsu Interchangeable Circlur Needles*/
.imgWrap4 {
	overflow: hidden;
}
.imgEff4{
	position: relative;
	width: 100%;
	height: 100%;
	transition-duration: 0.2s;/*変化に掛かる時間*/
}
.imgEff4:hover {
	transform: scale(1.05);/*拡大率*/
}
.imgEff4:before {
	position: absolute;
	width: 100%;
	height: 100%;
	background: radial-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.8)); /* 円形グラデーション */
	transition-duration: 0.4s;/*文字の変化に掛かる時間*/
	opacity: 0; /* 見えないように透過しておく */
	white-space: pre;
	content: 'Interchangeable Circlur Needles'; /* 表示するテキスト */
font-family:'Century Gothic','Questrial-Regular';
	background: radial-gradient(rgba(0, 0, 0, 0.3), #000000); /* けっこう暗くしないと文字が見にくいので注意 */
	display: flex; /* 文字の中央配置 */
	justify-content: center; /* 文字の中央配置 */
	align-items: center; /* 文字の中央配置 */
	color: #fff;
	font-size: 18px;
/*	text-shadow: 0 0 2px #000;*/
	filter: blur(4px); /* ブラー効果 */
}
.imgEff4:hover:before {
	opacity: 1; /* マウスオーバーで可視化 */
	transform: scale(1.3); /* 文字の拡大率 */
	filter: blur(0); /* ブラー効果を解除 */
}



/*Over 100 Years*/
.imgWrap5 {
	overflow: hidden;
}
.imgEff5 {
	position: relative;
	width: 100%;
	height: 100%;
	transition-duration: 0.2s;/*変化に掛かる時間*/
}
.imgEff5:hover {
	transform: scale(1.05);/*拡大率*/
}
.imgEff5:before {
	position: absolute;
	width: 100%;
	height: 100%;
	background: radial-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.8)); /* 円形グラデーション */
	transition-duration: 0.4s;/*文字の変化に掛かる時間*/
	opacity: 0; /* 見えないように透過しておく */
	white-space: pre;
	content: 'Over 100 Years'; /* 表示するテキスト */
font-family:'Century Gothic','Questrial-Regular';
	background: radial-gradient(rgba(0, 0, 0, 0.3), #000000); /* けっこう暗くしないと文字が見にくいので注意 */
	display: flex; /* 文字の中央配置 */
	justify-content: center; /* 文字の中央配置 */
	align-items: center; /* 文字の中央配置 */
	color: #fff;
	font-size: 18px;
/*	text-shadow: 0 0 2px #000;*/
	filter: blur(4px); /* ブラー効果 */
}
.imgEff5:hover:before {
	opacity: 1; /* マウスオーバーで可視化 */
	transform: scale(1.3); /* 文字の拡大率 */
	filter: blur(0); /* ブラー効果を解除 */
}



/*Koshitsu Shirotake*/
.imgWrap6 {
	overflow: hidden;
}
.imgEff6 {
	position: relative;
	width: 100%;
	height: 100%;
	transition-duration: 0.2s;/*変化に掛かる時間*/
}
.imgEff6:hover {
	transform: scale(1.05);/*拡大率*/
}
.imgEff6:before {
	position: absolute;
	width: 100%;
	height: 100%;
	background: radial-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.8)); /* 円形グラデーション */
	transition-duration: 0.4s;/*文字の変化に掛かる時間*/
	opacity: 0; /* 見えないように透過しておく */
	white-space: pre;
	content: 'Koshitsu\A Shirotake'; /* 表示するテキスト */
font-family:'Century Gothic','Questrial-Regular';
	background: radial-gradient(rgba(0, 0, 0, 0.3), #000000); /* けっこう暗くしないと文字が見にくいので注意 */
	display: flex; /* 文字の中央配置 */
	justify-content: center; /* 文字の中央配置 */
	align-items: center; /* 文字の中央配置 */
	color: #fff;
	font-size: 18px;
/*	text-shadow: 0 0 2px #000;*/
	filter: blur(4px); /* ブラー効果 */
}
.imgEff6:hover:before {
	opacity: 1; /* マウスオーバーで可視化 */
	transform: scale(1.3); /* 文字の拡大率 */
	filter: blur(0); /* ブラー効果を解除 */
}



/*Great Lineup*/
.imgWrap7 {
	overflow: hidden;
}
.imgEff7 {
	position: relative;
	width: 100%;
	height: 100%;
	transition-duration: 0.2s;/*変化に掛かる時間*/
}
.imgEff7:hover {
	transform: scale(1.05);/*拡大率*/
}
.imgEff7:before {
	position: absolute;
	width: 100%;
	height: 100%;
	background: radial-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.8)); /* 円形グラデーション */
	transition-duration: 0.4s;/*文字の変化に掛かる時間*/
	opacity: 0; /* 見えないように透過しておく */
	white-space: pre;
	content: 'Great Lineup'; /* 表示するテキスト */
font-family:'Century Gothic','Questrial-Regular';
	background: radial-gradient(rgba(0, 0, 0, 0.3), #000000); /* けっこう暗くしないと文字が見にくいので注意 */
	display: flex; /* 文字の中央配置 */
	justify-content: center; /* 文字の中央配置 */
	align-items: center; /* 文字の中央配置 */
	color: #fff;
	font-size: 18px;
/*	text-shadow: 0 0 2px #000;*/
	filter: blur(4px); /* ブラー効果 */
}
.imgEff7:hover:before {
	opacity: 1; /* マウスオーバーで可視化 */
	transform: scale(1.3); /* 文字の拡大率 */
	filter: blur(0); /* ブラー効果を解除 */
}



/*ProductFeatures*/
.imgWrap8 {
	overflow: hidden;
}
.imgEff8 {
	position: relative;
	width: 100%;
	height: 100%;
	transition-duration: 0.2s;/*変化に掛かる時間*/
}
.imgEff8:hover {
	transform: scale(1.05);/*拡大率*/
}
.imgEff8:before {
	position: absolute;
	width: 100%;
	height: 100%;
	background: radial-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.8)); /* 円形グラデーション */
	transition-duration: 0.4s;/*文字の変化に掛かる時間*/
	opacity: 0; /* 見えないように透過しておく */
	white-space: pre;
	content: 'Product Features'; /* 表示するテキスト */
font-family:'Century Gothic','Questrial-Regular';
	background: radial-gradient(rgba(0, 0, 0, 0.3), #000000); /* けっこう暗くしないと文字が見にくいので注意 */
	display: flex; /* 文字の中央配置 */
	justify-content: center; /* 文字の中央配置 */
	align-items: center; /* 文字の中央配置 */
	color: #fff;
	font-size: 18px;
/*	text-shadow: 0 0 2px #000;*/
	filter: blur(4px); /* ブラー効果 */
}
.imgEff8:hover:before {
	opacity: 1; /* マウスオーバーで可視化 */
	transform: scale(1.3); /* 文字の拡大率 */
	filter: blur(0); /* ブラー効果を解除 */
}



/*NotionSet*/
.imgWrap9 {
	overflow: hidden;
}
.imgEff9 {
	position: relative;
	width: 100%;
	height: 100%;
	transition-duration: 0.2s;/*変化に掛かる時間*/
}
.imgEff9:hover {
	transform: scale(1.05);/*拡大率*/
}
.imgEff9:before {
	position: absolute;
	width: 100%;
	height: 100%;
	background: radial-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.8)); /* 円形グラデーション */
	transition-duration: 0.4s;/*文字の変化に掛かる時間*/
	opacity: 0; /* 見えないように透過しておく */
	white-space: pre;
	content: 'Notion Set'; /* 表示するテキスト */
font-family:'Century Gothic','Questrial-Regular';
	background: radial-gradient(rgba(0, 0, 0, 0.3), #000000); /* けっこう暗くしないと文字が見にくいので注意 */
	display: flex; /* 文字の中央配置 */
	justify-content: center; /* 文字の中央配置 */
	align-items: center; /* 文字の中央配置 */
	color: #fff;
	font-size: 18px;
/*	text-shadow: 0 0 2px #000;*/
	filter: blur(4px); /* ブラー効果 */
}
.imgEff9:hover:before {
	opacity: 1; /* マウスオーバーで可視化 */
	transform: scale(1.3); /* 文字の拡大率 */
	filter: blur(0); /* ブラー効果を解除 */
}



/*Vision*/
.imgWrap10 {
	overflow: hidden;
}
.imgEff10 {
	position: relative;
	width: 100%;
	height: 100%;
	transition-duration: 0.2s;/*変化に掛かる時間*/
}
.imgEff10:hover {
	transform: scale(1.05);/*拡大率*/
}
.imgEff10:before {
	position: absolute;
	width: 100%;
	height: 100%;
	background: radial-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.8)); /* 円形グラデーション */
	transition-duration: 0.4s;/*文字の変化に掛かる時間*/
	opacity: 0; /* 見えないように透過しておく */
	white-space: pre;
	content: 'Vision'; /* 表示するテキスト */
font-family:'Century Gothic','Questrial-Regular';
	background: radial-gradient(rgba(0, 0, 0, 0.3), #000000); /* けっこう暗くしないと文字が見にくいので注意 */
	display: flex; /* 文字の中央配置 */
	justify-content: center; /* 文字の中央配置 */
	align-items: center; /* 文字の中央配置 */
	color: #fff;
	font-size: 18px;
/*	text-shadow: 0 0 2px #000;*/
	filter: blur(4px); /* ブラー効果 */
}
.imgEff10:hover:before {
	opacity: 1; /* マウスオーバーで可視化 */
	transform: scale(1.3); /* 文字の拡大率 */
	filter: blur(0); /* ブラー効果を解除 */
}



/**/
.imgWrap11 {
	overflow: hidden;
}
.imgEff11 {
	position: relative;
	width: 100%;
	height: 100%;
	transition-duration: 0.2s;/*変化に掛かる時間*/
}
.imgEff11:hover {
	transform: scale(1.05);/*拡大率*/
}
.imgEff11:before {
	position: absolute;
	width: 100%;
	height: 100%;
	background: radial-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.8)); /* 円形グラデーション */
	transition-duration: 0.4s;/*文字の変化に掛かる時間*/
	opacity: 0; /* 見えないように透過しておく */
	white-space: pre;
	content: '       Seeknit\A by Kinkiamibari'; /* 表示するテキスト */
font-family:'Century Gothic','Questrial-Regular';
	background: radial-gradient(rgba(0, 0, 0, 0.3), #000000); /* けっこう暗くしないと文字が見にくいので注意 */
	display: flex; /* 文字の中央配置 */
	justify-content: center; /* 文字の中央配置 */
	align-items: center; /* 文字の中央配置 */
	color: #fff;
	font-size: 18px;
/*	text-shadow: 0 0 2px #000;*/
	filter: blur(4px); /* ブラー効果 */
}
.imgEff11:hover:before {
	opacity: 1; /* マウスオーバーで可視化 */
	transform: scale(1.3); /* 文字の拡大率 */
	filter: blur(0); /* ブラー効果を解除 */
}



/**/
.imgWrap12 {
	overflow: hidden;
}
.imgEff12{
	position: relative;
	width: 100%;
	height: 100%;
	transition-duration: 0.2s;/*変化に掛かる時間*/
}
.imgEff12:hover {
	transform: scale(1.05);/*拡大率*/
}
.imgEff12:before {
	position: absolute;
	width: 100%;
	height: 100%;
	background: radial-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.8)); /* 円形グラデーション */
	transition-duration: 0.4s;/*文字の変化に掛かる時間*/
	opacity: 0; /* 見えないように透過しておく */
	white-space: pre;
	content: '       Seeknit\A by Kinkiamibari'; /* 表示するテキスト */
font-family:'Century Gothic','Questrial-Regular';
	background: radial-gradient(rgba(0, 0, 0, 0.3), #000000); /* けっこう暗くしないと文字が見にくいので注意 */
	display: flex; /* 文字の中央配置 */
	justify-content: center; /* 文字の中央配置 */
	align-items: center; /* 文字の中央配置 */
	color: #fff;
	font-size: 18px;
/*	text-shadow: 0 0 2px #000;*/
	filter: blur(4px); /* ブラー効果 */
}
.imgEff12:hover:before {
	opacity: 1; /* マウスオーバーで可視化 */
	transform: scale(1.3); /* 文字の拡大率 */
	filter: blur(0); /* ブラー効果を解除 */
}





















/* section06 */
.section06 {
	margin-top: 150px;
	margin-bottom: 150px;
}

.section06 img.exhibitioncontents {
	width: 280px;/*280*/
	height: 115px;
}

.section06 .h2img{
	margin-top:auto;
	margin-bottom:auto;
	text-align: left;
	margin-bottom: 30px;
}

.section06 .h2text {
	line-height:200%;/*◆*/
	margin-top:auto;
	margin-bottom:auto;
}

.section06 img.Event {
	width: 162px;/*162*/
	height: 58px;/*58*/
	background-color:pink;/*◆color◆*/

}

.section06 .img01{
	margin-top:auto;
	margin-bottom:auto;
	text-align: right;
}

/* section07 */







/* section08 */

.section08 {
	margin-top: 150px;
	margin-bottom: 150px;
}


.parent_08 {
	display: flex;
	justify-content: space-between;
}

.Catalog{
height:170px;
}

.Leaflet1{
height:170px;
}

.Leaflet2{
height:170px;
}

.cursor_link {
	cursor: pointer;
}










/* section09 */

.parent {
	display: flex;
	justify-content: space-between;
}

.seeknit_logo{
	width:150px;
}

.OnlineExhibition_2020{
	width:397px;
}

.facebook{
	width:30px;
}

.instagram{
	width:30px;
}

.sns_ico {
	margin-top:auto;
	margin-bottom:auto;
}

	/*iframe*/
	/*外枠*/
.outer_frame{
	width:100%;
	height:1490px;
	margin:0;
	overflow:hidden;
}
	/*内側*/
.inside_content{
	width:100%;
	height:1840px;
	margin-left:0px;
	margin-top:-70px;
	overflow:hidden;
}






/* スクロールフェードイン */
 .fadein {
  opacity: 0;
  transform : translate(0, 50px);
  transition : all 1500ms;
}

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




/*video*/

video{
  width: 100%;
  height: 100vh;
  object-fit: cover;
}

.example {/*親div*/
	position: relative;/*相対配置*/
	width:100%;
}

.example .daiji {
	position: absolute;/*絶対配置*/
	color: white;/*文字は白に*/
	top: 40%;
	left: 50%;
	-webkit-transform : translate(-50%,-50%);
	transform : translate(-50%,-50%);
	width: 100%;
	text-align: center;/*	left: 50%;
	-ms-transform: translate(-50%,-50%);
	-webkit-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
*/
	margin:0;
	padding:0;
	font-family:'Century Gothic','Questrial-Regular';
	font-size: 3em;
	letter-spacing:3px;/*字間*/
}

.example .mark1 {
	position: absolute;/*絶対配置*/
	color: white;/*文字は白に*/
	top: 55%;
	left: 50%;
	-ms-transform: translate(-50%,-50%);
	-webkit-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
	margin:0;
	padding:0;
	font-family:'Century Gothic','Questrial-Regular';
	font-size: 1em;
	letter-spacing:3px;/*字間*/
	width:3%;
}

.example .mark2 {
	position: absolute;/*絶対配置*/
	color: white;/*文字は白に*/
	top: 61%;
	left: 50%;
	-ms-transform: translate(-50%,-50%);
	-webkit-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
	margin:0;
	padding:0;
	font-family:'Century Gothic','Questrial-Regular';
	font-size: 1em;
	letter-spacing:3px;/*字間*/
}

.example .mark3 {
	position: absolute;/*絶対配置*/
	color: white;/*文字は白に*/
	top: 69%;
	left: 50%;
	-ms-transform: translate(-50%,-50%);
	-webkit-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
	margin:0;
	padding:0;
	font-family:'Century Gothic','Questrial-Regular';
	font-size: 1em;
	letter-spacing:3px;/*字間*/
	width:3%;
}

.example .mark4 {
	position: absolute;/*絶対配置*/
	color: white;/*文字は白に*/
	top: 75%;
	left: 50%;
	-ms-transform: translate(-50%,-50%);
	-webkit-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
	margin:0;
	padding:0;
	font-family:'Century Gothic','Questrial-Regular';
	font-size: 1em;
	letter-spacing:3px;/*字間*/
}



/* video もっと見る */
.s_video{
	margin-left:auto;
	margin-right:10px;
	margin-top:10px;
}



/*全体をフェードイン 表示*/
body {
    animation: fadeIn 2s ease 0s 1 normal;
    -webkit-animation: fadeIn 3s ease 0s 1 normal;
}

@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}



/*再生ボタン スクロールボタン 拡大*/
.hover_zoom{
border-radius: 50%;
  transition: all 0.2s ease 0s;
}
.hover_zoom:hover {
transform: scale(1.15, 1.15);
}