/*
 *  メインヴィジュアル
 */
#mv {
	position: relative;
	height: 95% !important;
}

.mv_wrapper_title {
	width: 100%;
	height: 60%;
	position: absolute;
	left: 0;
	top: 10%;
	bottom: 0;
	right: 0;
	margin: auto 0;

	overflow: hidden;

}

#mv .mv_wrapper_title {
	text-align: center;
}

.mv_circle {
	position: absolute;
	/* top: 25%; */
	left: 0;
	right: 0;
	margin: 0 auto;

  width: auto;
	height: 25%;
  border-radius: 50%;
	background: #fdecde;
	opacity: 0;

	animation: fadeIn 2.0s ease 0.0s 1 forwards;
}

.mv_flowerstorm {
	width: 100%;
	position: absolute;
	top: 3%;
	left: 13%;
	opacity: 0;
	
	animation: fadeIn 2.0s ease 0.5s 1 forwards;
}

.mv_title {
  -webkit-writing-mode: vertical-rl;
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
	word-break: keep-all;  /* 改行させない */
	color: #fdecde;
	font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	/* font-size: 30px; */
	font-size: 4vh;
	font-weight: bold;

	/* position: absolute; */
	position: relative;
	border: 0;
	top: 51%;
	opacity: 0;

	transform: translateY(-50%) translateX(0%);
	-webkit-transform: translateY(-50%) translateX(0%);
	
	/* transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%); */
	
	animation: titleFadeIn 1.0s ease 0.5s 1 forwards;
}

.mv_title_chiba {
	color: #e95364;
	margin-bottom: 6px;
	text-shadow:2px 2px 0 #fdecde, -2px -2px 0 #fdecde, 
							-2px 2px 0 #fdecde, 2px -2px 0 #fdecde, 
							0px 2px 0 #fdecde, 0 -2px 0 #fdecde, 
							-2px 0 0 #fdecde, 2px 0 0 #fdecde;

}

.mv_frame_top {
	width: 100%;
	position: absolute;
	left: 0;
	top: 0;
	opacity: 0;

	animation: rightFadeIn 4.0s ease 0.5s 1 forwards;
}

.mv_frame_bottom {
	width: 100%;
	position: absolute;
	bottom: 0;
	left: 0;
	opacity: 0;

	animation: leftFadeIn 4.0s ease 0.5s 1 forwards;
}

.mv_sushi01 {
	width: 30%;
	position: absolute;
	top: 30%;
	left: 5%;
	border-radius: 50%;
	background-image: url(../img/book_bg.png);
  background-size: 150px 150px;
  padding: 5px;
}

.mv_sushi01 img , .mv_sushi02 img, 
.mv_sushi03 img , .mv_sushi04 img,
.mv_sushi05 img {
	width: 100%;
}

.mv_sushi02 {
	width: 20%;
	position: absolute;
	top: 75%;
	left: 20%;
	border-radius: 50%;
	background-image: url(../img/book_bg.png);
  background-size: 150px 150px;
  padding: 5px;
}
.mv_sushi03 {
	width: 20%;
	position: absolute;
	top: 15%;
	left: 60%;
	border-radius: 50%;
	background-image: url(../img/book_bg.png);
  background-size: 150px 150px;
  padding: 5px;
}

.mv_sushi04 {
	width: 17%;
	position: absolute;
	top: 40%;
	left: 62%;
	border-radius: 50%;
	background-image: url(../img/book_bg.png);
  background-size: 150px 150px;
  padding: 5px;
}

.mv_sushi05 {
	width: 20%;
	position: absolute;
	top: 60%;
	left: 75%;
	border-radius: 50%;
	background-image: url(../img/book_bg.png);
  background-size: 150px 150px;
  padding: 5px;
}

.mv_peanuts {
	width: 17%;
	position: absolute;
	top: 57%;
	left: 7%;
}

.mv_nanohana {
	width: 10%;
	position: absolute;
	top: 28%;
	left: 80%;
}

.mv_makizushi {
	width: 10%; 
	position: absolute;
	top: 75%;
	left: 55%;
}

#whatis {
	padding-top: 100px;
	font-weight: bold;
}

.whatis_denken {
	position: relative;
	margin-left: 3%;
  width: 94%;
	background-color: #fdecde;
	text-align: center;
	margin-bottom: 60px;
	background-image: url(../img/shippo200.png);

	-webkit-box-shadow: 1px 1px 4px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 1px 1px 4px 0px rgba(0,0,0,0.75);
	box-shadow: 1px 1px 4px 0px rgba(0,0,0,0.75);
}

.whatis_denken_tape {
	width: 30%;
	position: absolute;
	top: -35px;
	left: 35%;
}

.whatis_denken_title {
	width: 95%;
	margin-top: 10px;
}
.whatis_denken_image {
	width: 95%;
	border: 5px #c89962 solid;
	border-radius: 5px;
}

.whatis_denken_text {
	color: black;
	padding: 10px 3% 10px 3%;
}

.whatis_detail_btn {
	border: solid;
    color: #e95364;
    border-color: #e95364;
    background-color: #fdecde;
    border-radius: 20px;
    width: 140px;
    font-weight: bold;
}

.whatis_sushi {
	position: relative;
	margin-left: 3%;
  width: 94%;
	background-color: #fdecde;
	text-align: center;
	margin-bottom: 20px;
	background-image: url(../img/shippo200.png);

	-webkit-box-shadow: 1px 1px 4px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 1px 1px 4px 0px rgba(0,0,0,0.75);
	box-shadow: 1px 1px 4px 0px rgba(0,0,0,0.75);
}

.whatis_sushi_tape {
	width: 30%;
	position: absolute;
	top: -35px;
	left: 35%;
}

.whatis_sushi_title {
	width: 95%;
	margin-top: 10px;
}

.whatis_sushi_image {
	width: 95%;
	border: 5px #c89962 solid;
	border-radius: 5px;
}

.whatis_sushi_text {
	color: black;
	padding: 10px 3% 10px 3%;
}

.whatis_makisu {
	width: 94%;
	margin-left: 3%;
	position: relative;
}

.whatis_makisu_makisu {
	width: 100%;
}

.whatis_makisu_washi {
	width: 90%;
	position: absolute;
	left: 5%;
	top: 10%;
	filter: drop-shadow(2px 2px 2px rgba(0,0,0,0.2));
}

.whatis_makisu_sushi1 {
	position: absolute;
	width: 26%;
	top: 10%;
	left: 7%;
}

.whatis_makisu_sushi2 {
	position: absolute;
	width: 24%;
	top: 10%;
	left: 38%;
}

.whatis_makisu_sushi3 {
	position: absolute;
	width: 26%;
	top: 10%;
	left: 67%;
}

.whatis_makisu_sushi4 {
	position: absolute;
	width: 24%;
	top: 40%;
	left: 8%;
}

.whatis_makisu_sushi5 {
	position: absolute;
	width: 28%;
	top: 40%;
	left: 36%;
}

.whatis_makisu_sushi6 {
	position: absolute;
	width: 20%;
	top: 40%;
	left: 70%;
}

.whatis_makisu_sushi7 {
	position: absolute;
	width: 24%;
	top: 68%;
	left: 8%;
}

.whatis_makisu_sushi8 {
	position: absolute;
	width: 24%;
	top: 66%;
	left: 38%;
}

.whatis_makisu_sushi9 {
	position: absolute;
	width: 22%;
	top: 65%;
	left: 69%;
}

.whatis_makisu_sushi1, .whatis_makisu_sushi2, .whatis_makisu_sushi3,
.whatis_makisu_sushi4, .whatis_makisu_sushi5, .whatis_makisu_sushi6,
.whatis_makisu_sushi7, .whatis_makisu_sushi8, .whatis_makisu_sushi9 {
	filter: drop-shadow(2px 2px 5px rgba(0,0,0,0.5));
}

.flower_line {
	width: 50%;
	margin-top: 100px;
	/* margin-bottom: 50px; */
	filter: drop-shadow(1px 1px 1px rgba(0,0,0,0.3));
}

#information {
	padding-top: 100px;
}

.information_wrapper {
	background-color: #f3aca3;
	background-image: url(../img/saaya177.png);
	padding-top: 50px;
	padding-bottom: 50px;
	width: 90%;
	margin-left: auto;
	margin-right: auto;
	-webkit-box-shadow: 1px 1px 4px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 1px 1px 4px 0px rgba(0,0,0,0.75);
	box-shadow: 1px 1px 4px 0px rgba(0,0,0,0.75);
}

.information_scrollbox {
  max-height: 300px; /* お好みで調整可能 */
  overflow-y: auto;
  /* padding-right: 10px; */
	margin-right: 10px;
}

.information_inner {
	background-image: url(../img/washi.jpg);
	width: 90%;
	/* margin-left: 5%; */
}

.information_inner_content {
	text-align: left;
  padding-left: 15%;
  padding-right: 7%;
}

.information_inner_content_date {
  font-weight: bold;
  margin-left: -3%;
}

.information_inner_content_body {

}

.information_flower-line_top {
	width: 76%;
	margin-top: 19px;
	margin-bottom: 20px;
}

.information_flower-line_bottom {
	width: 76%;
	margin-top: 20px;
	margin-bottom: 10px;
}

#book {
	width: 100%;
	padding-top: 100px;
}

#book h1 { 
	color: white;
	margin-bottom: 30px;
}

.book_wrapper {
	background-image: url(../img/book_bg.png);
	width: 90%;
	background-size: 150px 150px;
	padding: 5px;
	height: fit-content;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 20px;
	
	-webkit-box-shadow: 1px 1px 4px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 1px 1px 4px 0px rgba(0,0,0,0.75);
	box-shadow: 1px 1px 4px 0px rgba(0,0,0,0.75);
}

.book_wrapper_inner {
	background-color: #ffffff;
	padding-top: 20px;
	padding-bottom: 20px;
}

.book_wrapper img {
	width: 70%;
	border: solid 1px gray;
}

.book_wrapper hr {
	width: 90%;
	height: 1px;
	background-color: #e95364;
	/* margin-left: 5%; */
}

.book_wrapper_text {
	width: 90%;
	margin-left: 5%;
	text-align: left;
	/* font-size: 12px; */
	color: #000000;
	/* font-weight: bold; */
}

.book_wrapper_text_title {
	font-size: 1em;
	font-weight: bold;
}

.book_wrapper.is-hidden {
	/* opacity: 0; B
	height: 0; 
	margin: 0; */
	display: none;
}

.more {
	text-align: center;
	margin-top: 20px;
}
.more button {
	font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
	background-color: #e95364;
	color: #fdecde;
	border: solid;
	border-color: #fdecde;
	cursor: pointer;
	outline: none;
	padding: 0;
	/* height: 32px; */
	line-height: 32px;
	width: 120px;
	border-radius: 20px;
	
	/* -webkit-box-shadow: 1px 1px 4px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 1px 1px 4px 0px rgba(0,0,0,0.75);
	box-shadow: 1px 1px 4px 0px rgba(0,0,0,0.75); */
}

#contact {
	color: white;
	padding-top: 100px;
	margin-bottom: 30px;
}

#contact h1 {
	margin-bottom: 30px;
}

#contact p {
	text-align: left;
	padding: 5px;
}


input {
	border-radius: 10px;
	height: 32px;
	border: none;
	-webkit-appearance:none;
	padding: 10px;
	font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
}
textarea {
	width: 100%;
	border-radius: 10px;
	border: none;
	-webkit-appearance:none;
	padding: 10px;
	font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
}

.submit {
	width: 100%;
	height: 48px;
	font-size: 1.2em;
}

.pc { display: none !important; }
.sp { display: block !important; }

@media (min-width: 600px) {
	.whatis_denken_tape {
		top: -27px;
	}

	.whatis_sushi_tape {
		top: -24px;
	}

	.book_wrapper {
		width: 45%;
    margin-bottom: 30px;
    flex: none;
	}

	.flower_line {
		width: 30%;
	}
	.mv_flowerstorm {
		width: 87%;
	}
}

@media (min-width: 1280px) {
	/* 表示の切り替え */
	.pc { display: block !important; }
	.sp { display: none !important; }
	
	/* メインヴィジュアル */
	.mv_flowerstorm {
		width: 44%;
    top: -12%;
    left: 26%;
	}

	/* 伝研とは */
	.whatis_denken {
		width: 50%;
		float: right !important;
	}

	.whatis_denken_tape {
		top: -27px;
	}

	.whatis_sushi {
		width: 50%;
		float: left !important;
	}

	.whatis_sushi_tape {
		top: -24px;
	}

	.whatis_makisu {
    width: 40%;
	}

	/* お知らせ */
	.information_wrapper {
		width: 37%;
	}

	/* 書籍紹介 */
	.book_wrapper {
		width: 23%;
	}
	
	.book_wrapper_text {
		font-size: 15px;
	}
	.book_wrapper_text_title { 
		font-size: 15px;
	}

	/* お問い合わせ */
	#contact p {
		width: 55%;
	}
	#mailform {
		width: 55%;
	}

	.flower_line {
		width: 12%;
	}
}

/* エフェクト */
.ScrollFadein {
  opacity : 0;
  transform: translateY(20px);
  transition: all 1s;
}

@keyframes fadeIn {
  0% {opacity: 0} /*アニメーション開始時は不透明度0%*/
  100% {opacity: 1} /*アニメーション終了時は不透明度100%*/
}

@keyframes titleFadeIn {
  0% {
		transform: translate(0%, -40%);
		opacity: 0;
  }

  100% {
		transform: translate(0%, -50%);
		opacity: 1;
  }
}

@keyframes rightFadeIn {
  0% {
		transform: translateX(20px);
		opacity: 0;
  }

  100% {
		transform: translateX(0px);
		opacity: 1;
  }
}

@keyframes leftFadeIn {
  0% {
		transform: translateX(-20px);
		opacity: 0;
  }

  100% {
		transform: translateX(0px);
		opacity: 1;
  }
}