@charset "utf-8";

.sns {
	top: 500px !important;
	background-color: rgba(255,255,255,0) !important;
}

.brSP {
	display: none;
}

@media screen and (min-width: 0) and (max-width: 768px) {
	.brSP {
		display: inline-block;
	}
}



/*-----------------------------------------------
	フェードインアニメーション
-----------------------------------------------*/


.list-mv01{
	opacity: 0;
	transform: translate(0,60px); 
	-webkit-transform: translate(0,60px); 
	transition: .8s;
}

.mv01{
	opacity: 1.0;
	transform: translate(0,0); 
	-webkit-transform: translate(0,0);
}


/*-----------------------------------------------
	全体
-----------------------------------------------*/

#Main{
	margin-bottom: 166px;
}

@media screen and (min-width: 0) and (max-width: 768px) {
#Main{
	margin-bottom: 18vw;
}
}

/*-----------------------------------------------
	タイトル
-----------------------------------------------*/

.Craftsmantitle {
	width: 100%;
	height: 0;
	padding-top: 21.61583333%;
	background: url(../images/brandstory/craftsman/title.jpg) no-repeat;
	background-size: cover;
	background-position: center center;
	position: relative;
}

.Craftsmantitle div {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	text-align: right;
	font-weight: normal;
	font-family: 'Yu Gothic',YuGothic,'游ゴシック体','游ゴシック','YuGothM','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',sans-serif;
	font-size: 30px;
	color: #fff;
	letter-spacing: 0.1em;
}

.Craftsmantitle div p {
	max-width: 1140px;
	height: 100%;
	margin: 0 auto;
	display: flex;
	align-items: center;
	flex-direction: row-reverse;
}

@media screen and (min-width: 0) and (max-width: 768px) {
	/*-----------------------------------------------
		タイトル
	-----------------------------------------------*/

	.Craftsmantitle {
		width: 100%;
		height: 0;
		padding-top: 30.666666666%;
		background: url(../images/brandstory/craftsman/title.jpg) no-repeat;
		background-size: 150%;
		background-position: center;
		position: relative;
	}

	.Craftsmantitle div {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		text-align: right;
		font-weight: normal;
		font-family: 'Yu Gothic',YuGothic,'游ゴシック体','游ゴシック','YuGothM','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',sans-serif;
		font-size: 4vw;
		color: #fff;
		letter-spacing: 0.1em;
	}

	.Craftsmantitle div p {
		max-width: 100%;
		height: 100%;
		margin: 0 auto;
		display: flex;
		align-items: center;
		flex-direction: row-reverse;
	}
}

/*-----------------------------------------------
	kissoraのモノづくり。
-----------------------------------------------*/
.kissora_Craftsman {
	text-align: center;
	letter-spacing: 0.07em;
	line-height: 2.25;
	margin-top: 81px;
	margin-bottom: 145px;
}

.kissora_Craftsman span{
	font-size: 30px;
	line-height: 2;
	display: block;
	margin-bottom: 2.15em;
	font-weight: normal;
	letter-spacing: 0.15em;
	
}


@media screen and (min-width: 0) and (max-width: 768px) {
	/*-----------------------------------------------
		kissoraのモノづくり。
	-----------------------------------------------*/

	.kissora_Craftsman {
	margin-top: 13vw;
	margin-bottom: 22.4vw;
	}

	.kissora_Craftsman span {
		font-size: 3.8vw;
	}
}


/*-----------------------------------------------
	kissora職人の 4つの秘密 タイトル
-----------------------------------------------*/
.kissora_Secret{
	text-align: center;
	font-size: 20px;
	letter-spacing: 0.15em;
	line-height: 188%;
}
.kissora_Secret img{
	display:block;
	margin: 0 auto 0.5em;
	width: 67px;
	
}

@media screen and (min-width: 0) and (max-width: 768px) {
	.kissora_Secret{
		font-size: 3.8vw;
		line-height: 188%;
	}
	.kissora_Secret img{
		margin: 0 auto 0.5em;
		width: 15.7vw;
	}

}


/*-----------------------------------------------
	kissora職人の 4つの秘密　内容
-----------------------------------------------*/
.Craftsman .Secret{
	text-align: center;
	width: 1050px;
	margin: 0 auto;
}

.Craftsman .Secret .Secret_title{
	margin-top: 169px;
}

.Craftsman .Secret01 .Secret_title{
	margin-top: 145px;
}

.Craftsman .Secret .Secret_title p{/*数字*/
	font-family: 'Roboto-Thin','Roboto-Light','Raleway-Regular','Raleway-Bold','Raleway-ExtraLight','游ゴシック体','游ゴシック','YuGothM','YuGothB','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',sans-serif;
	font-weight: normal;
	font-size: 60px;
}

.Craftsman .Secret .Secret_title h3{/*コメント*/
	font-size: 20px;
	letter-spacing: 0.16em;
	margin-top: 0.32em;
	margin-bottom: 2em;
}

.Craftsman .Secret .Secret_title h3:before,
.Craftsman .Secret .Secret_title h3:after{content: "-"; margin: 0 0.5em; font-weight: bold;}

.Craftsman .Secret .Secret_text:before{
	content: "";
	display: block;
	width: 100%;
	background-image: url(https://kissora.sbs/info/wp-content/uploads/2023/06/key_icon_23-2.png);
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	height: 20px;
	margin-top: 52px;
	margin-bottom: 33px;
}

.Craftsman .Secret .Secret_text p {
	text-align: center;
	letter-spacing: 0.08em;
	line-height: 2.25;
}

.Craftsman .Secret .Secret_text p span{
	font-size: 20px;
	display: block;
	line-height: 180%;
	margin-top:1.6em;
	margin-bottom:1.6em;
}

@media screen and (min-width: 0) and (max-width: 768px) {
/*-----------------------------------------------
kissora職人の 4つの秘密　内容
-----------------------------------------------*/

	.Craftsman .Secret{
	width: 100%;
	}


	.Craftsman .Secret .Secret_title{
		margin-top: 17.3vw;
	}

	.Craftsman .Secret01 .Secret_title{
		margin-top: 19.4vw;
	}

	.Craftsman .Secret .Secret_title p{
		font-size: 9.6vw;
	}

	.Craftsman .Secret .Secret_title h3{/*コメント*/
		font-size: 3.8vw;
		margin-top: 0.32em;
		margin-bottom: 1.2em;
		letter-spacing: 0.1em;
	}

	.Craftsman .Secret .Secret_text:before{
		height: 4.133vw;
		margin-top: 6vw;
		margin-bottom: 6vw;
	}

	.Craftsman .Secret .Secret_text p {
		line-height: 2.25;
	}

	.Craftsman .Secret .Secret_text p span{
		font-size: 3.8vw;
		margin-top:1.3em;
		margin-bottom:1.3em;
	}
	
	
}