@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200;300;400;500;600;700;900&display=swap');
@import url('https://fonts.googleapis.com/css?family=Noto+Serif+JP&display=swap');
/*初期設定*/
body{
	min-width: 320px;
	background:#fff;
	line-height:1.5;
	color:#000;
	font-family: 'Noto Sans JP', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro','メイリオ', 'Meiryo', '游ゴシック', 'Yu Gothic', 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	height:100%;
	text-align:center;
	margin:0;
	padding:0;
	font-size:16px;
	}
h1{
	font-family: "Rock Salt", cursive;
	font-weight: 400;
	font-style: bold;
}
	
	
.ie8 img{
	width:auto;
	}
a,a:link,a:visited,a:hover{
	max-width:100%;
	height:auto;
	color:#000;
	text-decoration:none;
	}
a{
	width:auto;
	}
.clearfix{
	zoom:1;
	}
.clearfix:after{
	content:"";
	display:block;
	clear:both;
	}
	
img{
	zoom:0.5;
	height:auto;
	vertical-align:bottom;
}
/* フェードイン */
.fadein.is-animated {
	animation: fadeIn 2.7s cubic-bezier(0.33, 1, 0.68, 1) 1 forwards;
}
@keyframes fadeIn {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}
/* ズームイン */
.zoomin.is-animated {
	animation: zoomIn 0.8s cubic-bezier(0.25, 1, 0.5, 1) forwards;
}
@keyframes zoomIn {
	0% {
		transform: scale(0.7);
		opacity: 0;
	}
	100% {
		opacity: 1;
		transform: scale(1);
	}
}
/* フェードアップ */
.fadeup.is-animated {
	animation: fadeup 2.7s cubic-bezier(0.33, 1, 0.68, 1) 1 forwards;
}
@keyframes fadeup {
	0% {
		transform: translateY(40px);
		opacity: 0;
	}
	80% {
		opacity: 1;
	}
	100% {
		opacity: 1;
		transform: translateY(0);
	}
}
/*///////////////////////////////////////////base///////////////////////////////////////////*/
	
/*///////////////////////////////////////////media Queries///////////////////////////////////////////*/
@media only screen and (min-width:320px){
	.pc{
		display:none;
		}
	.sp{
		display:block;
		}
	
	/*///////////////////////////////////////////header///////////////////////////////////////////*/
	
	div.header_rogo_wrapper{
		width:100%;
		margin:0 auto;
	}
	div.header_rogo_wrapper h1{
		margin:100px auto 100px;
		padding:0;
	}
	div.header_rogo_wrapper h1{
		margin:100px auto 100px;
		padding:0;
	}
	
	div.header_rogo_wrapper img{
		width:75%;
	}
	
	.header_rogo_wrapper h2{
		margin:50px auto 20px;
		font-size:5vw;
		font-weight:normal;
		font-family: 'Noto Serif JP', serif;
	}
	
	div.header_rogo_wrapper h2 img{
		width:95%;
	}
	
	
	/*///////////////////////////////////////////main///////////////////////////////////////////*/
	
	div.all_wrapper{
		width:90%;
		margin:0 auto;
	}
	div.main_copy_wrapper{
		width:100%;
		margin:20px auto 20px;
		display:flex;
		flex-direction:column;
		align-items:flex-start;
		gap:2.5%;
		text-align:left;
	}
	div.main_copy_wrapper div.main_copy{
		width:100%;
		padding:10px;
		box-sizing:border-box;
		font-size:4vw;
		font-family: 'Noto Serif JP', serif;
		line-height:180%;
	}
	div.main_copy_wrapper div.katz_copy{
		margin:0 0 50px;
		width:100%;
		padding:10px;
		color:#fff;
		background:#000;
		box-sizing:border-box;
		font-size:3.5vw;
		line-height:180%;
	}
	div.main_copy_wrapper div.katz_copy span{
		display:block;
		text-align:right;
	}
	
	
	/*///////////////////////////////////////////detail///////////////////////////////////////////*/
	div.detail_wrapper{
		width:95%;
		margin:20px auto 20px;
		display:flex;
		flex-direction:column-reverse;
		align-items:flex-start;
		gap:2.5%;
		text-align:left;
	}
	div.detail_text_wrapper{
		width:100%;
		text-align:left;
	}
	div.detail_pict_wrapper{
		padding:50px 0 40px;
		width:100%;
		text-align:center;
	}
	div.detail_pict_wrapper img{
		width:80%;
	}
	div.detail_text_wrapper h2{
		margin:0;
		padding:0 10px;
		font-size:4.5vw;
	}
	
	ul.detail_list,ul.detail_list{
		margin:5px 0;
		padding:0 0 0 10px;
		list-style-type:none;
		font-size:4vw
	}
	ul.detail_list li,ul.detail_list li{
		margin:0 0 20px;
		padding:0;
		
	}
	ul.detail_list li a{
		font-weight:bold;
		color:#6900ff;
	}
	div.detail_text_wrapper h3{
		margin:0;
		padding:0;
		font-size:3.5vw;
	}
	
	div.detail_text_wrapper h3 a{
		display:inline-block;
		margin:0 10px;
		padding:2px 10px 0px;
		background:#ff0000;
		font-size:2vw;
		color:#fff;
		border-radius:10px;
	}
	div.detail_text_wrapper p{
		font-size:3.5vw;
	}
		
	.sp_photo{
			margin:0 0 30px;
		}
	
	h4.ec{
		margin:0 10px 20px;
		font-size:4vw;
	}
	
	h4.ec span{
		font-size:3vw;
	}
	
	h5{
		margin:0px 10px 20px;
		font-size:3vw;
		text-align:left;
		font-weight:normal;
	}
	h5.compile{
		text-align:right;
	}
	
	/*///////////////////////////////////////////profile///////////////////////////////////////////*/
	div.p_detail_wrapper{
		width:90%;
		margin:50px auto 20px;
		display:flex;
		flex-direction:column-reverse;
		align-items:flex-start;
		text-align:left;
	}
	
	div.p_detail_wrapper a span{
		font-size:2.8vw;
		}
	div.p_detail_text_wrapper{
		width:100%;
		text-align:left;
	}
	div.p_detail_pict_wrapper{
		padding:20px 0 0;
		width:100%;
		text-align:center;
	}
	div.p_detail_text_wrapper img,
	div.p_detail_pict_wrapper img{
		width:100%;
		margin:0 0 20px;
	}
	div.p_detail_text_wrapper p{
		font-size:3.8vw;
		line-height:1.8;
		margin:0 0 50px;
	}
	div.p_detail_text_wrapper h2{
		margin:5px 0;
	}
	/*///////////////////////////////////////////bio///////////////////////////////////////////*/
	table.info{
	}
	table.info th{
		width:25%;
		font-size:3vw;
		vertical-align:top;
	}
	table.info td{
		width:80%;
		font-size:3vw;
	}
	/*///////////////////////////////////////////goods///////////////////////////////////////////*/
	
	div.goods{
		width:100%;
		text-align:left;
	}
	div.goods h3{
		text-align:left;
	}
	div.goods ul{
		list-style-type:none;
		margin:0;
		padding:0;
		display:flex;
		flex-direction:row;
		gap:5%;
	}
	div.goods ul li{
		width:21.25%;
	}
	div.goods ul li img{
		width:100%;
	}
	
	/*///////////////////////////////////////////btn///////////////////////////////////////////*/
	
	div.btn_wrapper{
		margin:20px auto 20px;
		text-align:center;
		font-family: 'Noto Serif JP', serif;
	}
	
	div.btn_wrapper h2{
		margin:20px auto 10px;
		font-size:4vw;
		font-weight:normal;
	}
	div.btn_wrapper h2 span{
		font-size:2.5vw;
	}
	div.btn_wrapper h3{
		margin:20px auto;
		font-size:9vw;
		font-weight:normal;
		letter-spacing:3px;
	}
	
	div.btn_wrapper h4{
		margin:20px auto 25px;
		font-size:3vw;
		font-weight:normal;
	}
	
	div.btn_wrapper a{
		display:inline-block;
		padding:15px 50px;
		background:#ff0000;
		color:#fff;
		font-size:4vw;
		border-radius:45px;
	}
	
	/*///////////////////////////////////////////footer///////////////////////////////////////////*/
	div.footer_wrapper{
		margin:100px auto 20px;
	}
	div.footer_wrapper img{
		margin:100px auto;
		width:80%;
	}
	div.footer_wrapper small{
		font-size:1.5vw;
	}
}
/*///////////////////////////////////////////media Queries///////////////////////////////////////////*/
@media only screen and (min-width:768px){
	.pc{
	display:block;
		}
	.sp{
		display:none;
		}
	
	/*///////////////////////////////////////////header///////////////////////////////////////////*/
	
	div.header_rogo_wrapper{
		width:90%;
		margin:100px auto 0;
	}
	div.header_rogo_wrapper h1{
		margin:100px auto 100px;
		padding:0;
	}
	div.header_rogo_wrapper h1{
		margin:100px auto 100px;
		padding:0;
	}
	div.header_rogo_wrapper img{
		width:60%;
	}
	
	.header_rogo_wrapper h2{
		margin:20px auto 20px;
		font-size:1.8rem;
		font-weight:normal;
		font-family: 'Noto Serif JP', serif;
	}
	
	/*///////////////////////////////////////////main///////////////////////////////////////////*/
	
	div.all_wrapper{
		width:90%;
		margin:0 auto;
	}
	div.main_copy_wrapper{
		width:100%;
		margin:100px auto;
		display:flex;
		flex-direction:column;
		align-items:flex-start;
		gap:2.5%;
		text-align:left;
	}
	div.main_copy_wrapper div.main_copy{
		width:100%;
		padding:10px;
		box-sizing:border-box;
		font-size:1.2rem;
		line-height:2.0rem;
		font-family: 'Noto Serif JP', serif;
	}
	div.main_copy_wrapper div.katz_copy{
		width:100%;
		padding:10px;
		color:#fff;
		background:#000;
		box-sizing:border-box;
		font-size:16px;
	}
	div.main_copy_wrapper div.katz_copy span{
		display:block;
		text-align:right;
	}
	
	/*///////////////////////////////////////////detail///////////////////////////////////////////*/
	div.detail_wrapper{
		width:100%;
		margin:50px auto 50px;
		display:flex;
		flex-direction:row;
		align-items:flex-start;
		gap:2.5%;
		text-align:left;
	}
	div.detail_text_wrapper{
		width:70%;
		text-align:left;
	}
	div.detail_pict_wrapper{
		padding:50px 0 0;
		width:27.5%;
		text-align:center;
	}
	div.detail_pict_wrapper img{
		width:100%;
	}
	div.detail_text_wrapper h2{
		margin:0;
		padding:0 10px;
		font-size:1.5rem;
	}
	
	ul.detail_list,
	ul.detail_list2{
		margin:25px 0;
		padding:0 0 0 10px;
		list-style-type:none;
		font-size:1.2rem;
	}
	ul.detail_list li,
	ul.detail_list2 li{
		margin:0 0 40px;
		padding:0;
	}
	
	ul.detail_list li:before,
	ul.detail_list2 li:before{
		color:#000;
		margin:5px 5px 0 0;
		font-size:0.9rem;
		font-weight:bold;
		float:left;
	}
	div.detail_text_wrapper h3{
	margin:0;
	padding:0;
	font-size:1.2rem;
}
div.detail_text_wrapper h3 a{
	display:inline-block;
	margin:0 10px;
	padding:2px 10px 0px;
	background:#ff0000;
	font-size:0.8rem;
	color:#fff;
	border-radius:10px;
}
div.detail_text_wrapper p{
	font-size:0.9rem;
}
h4.ec{
	margin:0 10px 20px;
	font-size:1rem;
}
h4.ec span{
	font-size:0.8rem;
}
h5{
	margin:0 10px;
	font-size:1rem;
}
	
	/*///////////////////////////////////////////profile///////////////////////////////////////////*/
	div.p_detail_wrapper{
		width:100%;
		margin:50px auto 50px;
		display:flex;
		flex-direction:row;
		align-items:flex-start;
		gap:2.5%;
		text-align:left;
	}
	div.p_detail_wrapper a span{
		font-size:0.9rem;
	}
	div.p_detail_text_wrapper{
		width:77%;
		text-align:left;
	}
	div.p_detail_pict_wrapper{
		padding:20px 0 0;
		width:20.5%;
		text-align:center;
	}
	div.p_detail_pict_wrapper img{
		width:100%;
		margin:0 0 10px;
	}
	div.p_detail_text_wrapper p{
		font-size:100%;
		margin:0 0 50px;
	}
	div.p_detail_text_wrapper h2{
		margin:5px 0;
	}
	/*///////////////////////////////////////////bio///////////////////////////////////////////*/
	table.info{
	}
	table.info th{
		width:20%;
		font-size:100%;
	}
	table.info td{
		width:85%;
		font-size:100%;
	}
	/*///////////////////////////////////////////goods///////////////////////////////////////////*/
	
	div.goods{
		width:100%;
		text-align:left;
	}
	div.goods h3{
		text-align:left;
	}
	div.goods ul{
		list-style-type:none;
		margin:0;
		padding:0;
		display:flex;
		flex-direction:row;
		gap:5%;
	}
	div.goods ul li{
		width:21.25%;
	}
	div.goods ul li img{
		width:100%;
	}
/*///////////////////////////////////////////btn///////////////////////////////////////////*/
	div.btn_wrapper{
		margin:100px auto;
		text-align:center;
		font-family: 'Noto Serif JP', serif;
	}
	
	div.btn_wrapper h2{
		margin:20px auto 10px;
		font-size:1.8rem;
		font-weight:normal;
	}
	div.btn_wrapper h2 span{
		font-size:1.0rem;
	}
	div.btn_wrapper h3{
		margin:20px auto;
		font-size:2.8rem;
		font-weight:normal;
		letter-spacing:5px;
	}
	
	div.btn_wrapper h4{
		margin:50px auto 25px;
		font-size:1.0rem;
		font-weight:normal;
	}
	
	div.btn_wrapper a{
		display:inline-block;
		padding:15px 100px;
		background:#ff0000;
		color:#fff;
		font-size:4.5vw;
		border-radius:45px;
	}
/*///////////////////////////////////////////footer///////////////////////////////////////////*/
	div.footer_wrapper{
		margin:100px auto 20px;
	}
	div.footer_wrapper img{
		margin:100px auto;
		width:auto;
	}
	div.footer_wrapper small{
		font-size:0.5rem;
	}
	
}
/*///////////////////////////////////////////media Queries///////////////////////////////////////////*/
@media only screen and (min-width:1200px){
	
	h1{
		font-size:8em;
	}
	
/*///////////////////////////////////////////header///////////////////////////////////////////*/
	div.header_rogo_wrapper{
		width:1200px;
		margin:100px auto 0;
	}
	div.header_rogo_wrapper h1{
		margin:100px auto 100px;
		padding:0;
	}
	div.header_rogo_wrapper h1{
		margin:100px auto 100px;
		padding:0;
	}
		
		
	div.header_rogo_wrapper img{
			width:70%;
		}
	
/*///////////////////////////////////////////main///////////////////////////////////////////*/
	
	div.all_wrapper{
		width:1200px;
		margin:0 auto;
	}
	div.main_copy_wrapper{
		width:100%;
		margin:100px auto;
		display:flex;
		flex-direction:row;
		align-items:flex-start;
		gap:2.5%;
		text-align:left;
	}
	div.main_copy_wrapper div.main_copy{
		width:100%;
		padding:10px;
		box-sizing:border-box;
		font-size:2.2rem;
		line-height:2.0rem;
		font-family: 'Noto Serif JP', serif;
	}
	div.main_copy_wrapper div.katz_copy{
		width:100%;
		padding:50px;
		color:#fff;
		background:#000;
		box-sizing:border-box;
	}
	div.main_copy_wrapper div.katz_copy span{
		display:block;
		text-align:right;
	}
	
	/*///////////////////////////////////////////detail///////////////////////////////////////////*/
	div.detail_wrapper{
		width:100%;
		margin:50px auto 50px;
		display:flex;
		flex-direction:row;
		align-items:flex-start;
		gap:2.5%;
		text-align:left;
	}
	div.detail_text_wrapper{
		width:60%;
		text-align:left;
	}
	div.detail_pict_wrapper{
		padding:50px 0 0;
		width:37.5%;
		text-align:center;
	}
	div.detail_pict_wrapper img{
		width:100%;
	}
	div.detail_text_wrapper h2.side{
		margin:0;
		padding:0 10px;
		font-size:1.5rem;
		border:1px solid #000;
	}
	
	ul.detail_list,ul.detail_list2{
		margin:25px 0;
		padding:0 0 0 10px;
		list-style-type:none;
		font-size:1.2rem;
	}
	ul.detail_list li,ul.detail_list2 li{
		margin:0 0 40px;
		padding:0;
	}
	div.detail_text_wrapper h3{
		margin:0;
		padding:0;
		font-size:1.2rem;
	}
		
	div.detail_text_wrapper h3 a{
		display:inline-block;
		margin:0 10px;
		padding:2px 10px 0px;
		background:#ff0000;
		font-size:0.8rem;
		color:#fff;
		border-radius:10px;
	}
	div.detail_text_wrapper p{
		font-size:0.9rem;
	}
	
	h4.ec{
	margin:0 10px 20px;
	font-size:1rem;
	}
	h4.ec span{
	font-size:0.8rem;
	}
	h5{
	margin:0 10px;
	font-size:1rem;
	}
	
/*///////////////////////////////////////////profile///////////////////////////////////////////*/
	div.p_detail_wrapper{
		width:100%;
		margin:50px auto 50px;
		display:flex;
		flex-direction:row;
		align-items:flex-start;
		gap:2.5%;
		text-align:left;
	}
	div.p_detail_text_wrapper{
		width:77%;
		text-align:left;
	}
	div.p_detail_pict_wrapper{
		padding:20px 0 0;
		width:20.5%;
		text-align:center;
	}
	div.p_detail_pict_wrapper img{
		width:100%;
		margin:0 0 10px;
	}
	div.p_detail_text_wrapper p{
		margin:0 0 50px;
	}
	div.p_detail_text_wrapper h2{
		margin:5px 0;
	}
/*///////////////////////////////////////////bio///////////////////////////////////////////*/
	table.info{
	}
	table.info th{
		width:20%;
	}
	table.info td{
		width:85%;
	}
/*///////////////////////////////////////////goods///////////////////////////////////////////*/
	
	div.goods{
		width:100%;
		text-align:left;
	}
	div.goods h3{
		text-align:left;
	}
	div.goods ul{
		list-style-type:none;
		margin:0;
		padding:0;
		display:flex;
		flex-direction:row;
		gap:5%;
	}
	div.goods ul li{
		width:21.25%;
	}
	div.goods ul li img{
		width:100%;
	}
		
	
/*///////////////////////////////////////////btn///////////////////////////////////////////*/
	div.btn_wrapper,.header_rogo_wrapper{
		margin:100px auto;
		text-align:center;
		font-family: 'Noto Serif JP', serif;
	}
	div.btn_wrapper h2,.header_rogo_wrapper h2{
		margin:20px auto 10px;
		font-size:1.8rem;
		font-weight:normal;
	}
	div.btn_wrapper h2 span{
		font-size:1.0rem;
	}
	div.btn_wrapper h3{
		margin:20px auto;
		font-size:2.8rem;
		font-weight:normal;
		letter-spacing:5px;
	}
	div.btn_wrapper h4{
		margin:50px auto 25px;
		font-size:1.0rem;
		font-weight:normal;
	}
	div.btn_wrapper a{
		display:inline-block;
		padding:15px 100px;
		background:#ff0000;
		color:#fff;
		font-size:2.8rem;
		border-radius:45px;
	}
/*///////////////////////////////////////////footer///////////////////////////////////////////*/
	div.footer_wrapper{
		margin:100px auto 20px;
	}
	div.footer_wrapper img{
		margin:100px auto;
	}
	div.footer_wrapper small{
		font-size:0.5rem;
	}
}