@charset "UTF-8";


#main .side-menu{ position: absolute; left: 50%; margin-left: -850px; border-left: 1px solid #000000; padding-left: 20px; z-index: 5; }
#main .side-menu .ttl{ font-size: 24px; }
#main .side-menu .navi-list{ margin-top: 20px; }
#main .side-menu .navi-list .navi+.navi{ margin-top: 10px; }
#main .side-menu .navi-list .navi a{ color: #000000; text-decoration: none; position: relative; }
#main .side-menu .navi-list .navi.active a{ color: #005da4; }
#main .side-menu .navi-list .navi a::before{ content: ''; position: absolute; left: -20px; top: 50%; border: solid transparent; border-left-color: #005da4; border-width: 7px 10px; transform: translateY(-50%); opacity: 0; }
#main .side-menu .navi-list .navi.active a::before{ opacity: 1; transition: opacity 0.25s; }
#main .root-list{ width: 1200px; margin: 0 auto; display: -ms-flex; display: flex; flex-wrap: wrap; }
#main .root-list .item{ width: 0; opacity: 0; height: 0; position: relative; }
#main .root-list .item.active{ position: relative; opacity: 1; z-index: 5; width: 256px; margin-left: 58px; height: auto; transition: opacity 0.5s; }
#main .root-list .item.active:nth-child(4n+1){ margin-left: 0; }
#main .root-list .item.active:nth-child(n+5){ margin-top: 70px; }
#main .root-list .item .overlay{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 5; }
#main .root-list .item .photo{ overflow: hidden; position: relative; }
#main .root-list .item .photo img{ transition: transform 0.5s; }
#main .root-list .item .photo .sold_out {position: absolute; color: white; text-align: center; font-size: 16px; line-height: 1.2em; padding: 10px 10px; background-color: rgba(182,0,0,0.9); width:65%; top: 50%; left: 50%; -ms-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); }
#main .root-list .item .overlay:hover+.photo img{ transform: scale(1.1); }
#main .root-list .item .category{ margin-top: 10px; color: #999999; border-left: 4px solid #999999; padding-left: 10px; }
#main .root-list .item .txt{ margin-top: 5px; line-height: 1.7; }
#main .root-list .item .date{ line-height: 1.7; }
#main .root-list .item .date .marker{ color: #ff3200; }
#main .child-content{ width: 1000px; margin: 0 auto; }
#main .child-content .category{ color: #999999; border-left: 4px solid #999999; padding-left: 10px; font-size: 30px; }
#main .child-content .intro > .sold_out {font-size: 24px; line-height: 1.2em; padding: 10px 0; font-weight: bold; color: red; }
#main .child-content .intro{ margin-top: 30px; }
#main .child-content .intro .photo { position: relative;  }
#main .child-content .intro .photo .sold_out {position: absolute; color: white; text-align: center; font-size: 16px; line-height: 1.2em; padding: 10px 10px; background-color: rgba(182,0,0,0.9); width:65%; top: 50%; left: 50%; -ms-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); }
#main .child-content .intro .ttl{ font-size: 30px; line-height: 1.5; margin-top: 30px; }
#main .child-content .intro .ttl2{ font-size: 30px; line-height: 1.5; clear: left; padding-top: 30px; }
#main .child-content .intro .ttl .date{ font-size: 16px; font-weight: normal; }
#main .child-content .intro .txt{ margin-top: 20px; }
#main .child-content .intro .caption{ margin-top: 5px; }
#main .child-content .intro .txt-photo{ margin-top: 20px; width: 48%; float: left; vertical-align : bottom;}
#main .child-content .intro .txt-photo:nth-child(2n+1){ margin-left: 4%;}
#main .child-content .navi a{ display: inline-block; background-color: #005da4; color: #ffffff; text-decoration: none; padding: 10px 20px; }
#main .child-content .brandstory-content{ margin-top: 80px; }
#main .child-content .brandstory-content .ttl{ color: #005da4; font-size: 20px; display: -ms-flex; display: flex; align-items: center; }
#main .child-content .brandstory-content .ttl+.txt{ margin-top: 30px; text-align: center; }
#main .child-content .brandstory-content .ttl::before,
#main .child-content .brandstory-content .ttl::after { content: ""; height: 1px; flex: 1; background-color: #005da4; }
#main .child-content .brandstory-content .ttl .word{ text-align: center; border: solid #005da4; border-width: 0 8px; box-sizing: border-box; padding: 0 20px; }
#main .child-content .brandstory-content .video video{ width: 100%; height: auto; }
#main .child-content .brandstory-content .list-item{ margin-top: 40px; display: -ms-flex; display: flex; flex-wrap: wrap; }
#main .child-content .brandstory-content .list-item .item{ width: 480px; display: -ms-flex; display: flex; }
#main .child-content .brandstory-content .list-item .item:nth-child(2n+2){ margin-left: 40px; }
#main .child-content .brandstory-content .list-item .item:nth-child(n+3){ margin-top: 70px; }
#main .child-content .brandstory-content .list-item .item .photo{ margin-right: 20px; }
#main .child-content .brandstory-content .list-item .item .txt-body{ flex: 1; }
#main .child-content .brandstory-content .list-item .item .txt-body .read{ color: #005da4; }
#main .child-content .brandstory-content .list-item .item .navi-netshop{ width: 100%; max-width: 256px; }
#main .child-content .brandstory-content .list-item .item .navi-netshop a{ display: block; background-color: #005da4; color: #ffffff; text-decoration: none; text-align: center; padding: 4px 0; }
#main .child-content .recipe-section{ margin-top: 40px; }
#main .child-content .recipe-section+.recipe-section{ margin-top: 80px; }
#main .child-content .recipe-section .ttl{ font-size: 20px; color: #005da4; border-bottom: 1px solid #005da4; margin-bottom: 20px; }
#main .child-content .recipe-section .split-view{ display: -ms-flex; display: flex; flex-wrap: wrap; flex-direction: row-reverse; }
#main .child-content .recipe-section .split-view .photo-body{ margin-left: 40px; }
#main .child-content .recipe-section .split-view .photo-body .caption{ margin-top: 5px; }
#main .child-content .recipe-section .split-view .txt-body{ flex: 1; }
#main .child-content .recipe-section .split-view .txt-body .recipe-list .item:first-letter{ color: #005da4; }
#main .child-content .recipe-section .split-view .txt-body .head{ color: #005da4; }
#main .child-content .recipe-section .split-view .txt-body .recipe-list+.head{ margin-top: 30px; }
#main .child-content .recipe-section .flow-list .item+.item{ margin-top: 20px; }
#main .child-content .workshop-photo{ display: -ms-flex; display: flex; flex-wrap: wrap; }
#main .child-content .workshop-photo .item{ width: 30%; margin-left: 5%; }
#main .child-content .workshop-photo .item:nth-child(3n+1){ margin-left: 0; }
#main .child-content .workshop-photo .item:nth-child(n+4){ margin-top: 5%; }




@media screen and (max-width: 1890px) {
	#main .side-menu{ position: relative; left: auto; margin: 0 auto 70px; width: 1200px; border: none; padding-left: 0; }
	#main .side-menu .ttl{ text-align: center; border: solid #005da4; border-width: 1px 0; padding: 10px 0; }
	#main .side-menu .navi-list{ margin-top: 50px; display: -ms-flex; display: flex; justify-content: center; flex-wrap: wrap; }
	#main .side-menu .navi-list .navi{ padding: 0 20px; position: relative; margin-left: -1px; }
	#main .side-menu .navi-list .navi::before{ content: ''; position: absolute; left: 0; top: 50%; width: 100%; height: 14px; border: dotted #999999; border-width: 0 1px; transform: translateY(-50%); box-sizing: border-box; }
	#main .side-menu .navi-list .navi+.navi{ margin-top: 0; }
	#main .side-menu .navi-list .navi a::before{ display: none; }
}
@media screen and (max-width: 860px) {
}
@media screen and (max-width: 640px) {
	#main .side-menu{ width: auto; padding: 0 5%; margin-bottom: 8%; }
	#main .side-menu .navi-list{ margin-top: 5%; }
	#main .root-list{ width: auto; padding: 0 5%; }
	#main .root-list .item.active:nth-child(n){ width: 48%; margin-left: 4%; }
	#main .root-list .item.active:nth-child(2n+1){ margin-left: 0; }
	#main .root-list .item.active:nth-child(n+3){ margin-top: 8%; }
	#main .root-list .item .photo img{ width: 100%; height: auto; }
	#main .child-content{ width: auto; margin: 0 5%; }
	#main .child-content .category{ font-size: 24px; }
	#main .child-content .intro{ margin-top: 5%; }
	#main .child-content .intro .ttl{ font-size: 24px; margin-top: 10%; }
	#main .child-content .intro .ttl2{ font-size: 24px; clear: left; padding-top: 10%; }
	#main .child-content .intro .ttl .date{ font-size: 14px; }
	#main .child-content .intro .txt{ margin-top: 5%; }
	#main .child-content .intro .caption{ margin-top: 1%; }
	#main .child-content .intro .txt-photo{ margin-top: 5%; width: 100%; }
	#main .child-content .intro .txt-photo:nth-child(2n+1){ margin-left: 0;}
	#main .child-content .brandstory-content{ margin-top: 10%; }
	#main .child-content .brandstory-content .ttl+.txt{ margin-top: 5%; text-align: left; }
	#main .child-content .brandstory-content .list-item{ margin-top: 5%; }
	#main .child-content .brandstory-content .list-item .item{ width: 48%; display: block; }
	#main .child-content .brandstory-content .list-item .item:nth-child(2n+2){ margin-left: 4%; }
	#main .child-content .brandstory-content .list-item .item:nth-child(n+3){ margin-top: 8%; }
	#main .child-content .brandstory-content .list-item .item .photo{ margin-right: 0; margin-bottom: 10px; }
	#main .child-content .brandstory-content .list-item .item .photo img{ width: 100%; height: auto; }
	#main .child-content .recipe-section{ margin-top: 10%; }
	#main .child-content .recipe-section+.recipe-section{ margin-top: 10%; }
	#main .child-content .recipe-section .ttl{ margin-bottom: 5%; }
	#main .child-content .recipe-section .split-view{ display: block; }
	#main .child-content .recipe-section .split-view .photo-body{ margin-left: 0; }
	#main .child-content .recipe-section .split-view .photo-body .photo img{ width: 100%; height: auto; }
	#main .child-content .recipe-section .split-view .txt-body{ margin-top: 5%; }
	#main .child-content .recipe-section .split-view .txt-body .recipe-list+.head{ margin-top: 5%; }
	#main .child-content .recipe-section .flow-list .item+.item{ margin-top: 5%; }
	#main .child-content .workshop-photo .item:nth-child(n){ width: 48%; margin-left: 4%; }
	#main .child-content .workshop-photo .item:nth-child(odd){ margin-left: 0; }
	#main .child-content .workshop-photo .item:nth-child(n+3){ margin-top: 4%; }
}
@media screen and (max-width: 480px){
}