@charset "utf-8";

/*+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-     Font     -+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+*/
@import url('https://fonts.googleapis.com/css?family=Noto+Serif+JP:400&display=swap&subset=japanese');

/*+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-     Site Contents     -+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+*/
/*          loading          */
#overlay{position:fixed;width:100%;height:100%;text-align:center;background:#FFF;z-index:9999;}

/*          Site Contents          */
#siteWrap {
	position: relative;
	width: 100%;
	height: 100%;
	height: auto !important;
	min-height: 100%;
	overflow: hidden;
}
.white {
	color: #fffaf1;
}
.bgFixed {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100vh;
background-position: top;
background-size: cover;
z-index: -1;
}
.bg {
	position: relative;
	background-image: url(/shop/violet-background/img/wallpaper.jpg);
}
.arrow {
	display: inline-block;
	border: 1px solid #FFF;
	background: rgba(255, 250, 241, .8);
	transition: .6s ease-out;
}
.arrow:hover {
	background: rgba(255, 250, 241, .4);
}
.arrow ul {
	-webkit-display: flex; display: flex;
	-webkit-align-items: center;align-items: center;
}

/*PC*/
@media screen and (min-width:769px) {
	#siteWrap {
		min-width: 1200px;
	}
	.bgFixed {
	background-image: url(/shop/violet-background/img/overviewBg.jpg);
	background-image: url(/shop/violet-background/img/descriptBg.jpg);
	}
	.bgFixed.switching {
	background-image: url(/shop/violet-background/img/overviewBg.jpg);
	}
}
/*SP*/
@media screen and (max-width:768px) {
	.bg {
		background-size: 30%;
	}
	.bgFixed {
	background-image: url(/shop/violet-background/img/overviewBg_sp.jpg);
	background-image: url(/shop/violet-background/img/descriptBg_sp.jpg);
	}
	.bgFixed.switching {
	background-image: url(/shop/violet-background/img/overviewBg_sp.jpg);
	}

}

/*メインビジュアルコンテンツ*/
.mainVisual {
	position: relative;
	z-index: 2;
}
.visual {
	position: relative;
}
.visual .heading {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
}
.visual .heading .link {
	text-align: center;
}
.visual .heading .link .arrow {
	text-align: left;
}
.visual .heading .link .arrow .deco {
	padding-left: 1em;
}
.visual .heading .link.red a {
	color: #bf1919;
}
.visualSlider {
	position: relative;
}
.visualSlider li {
	position: absolute;
	top: 0;
	left: 0;
	width: calc(100% + 100px);
	animation-duration: 21s;
	animation-timing-function: ease-out;
	animation-iteration-count: infinite;
	background-size: cover;
}
.visualSlider li.show {
	animation-name: slide;
}
.visualSlider li:nth-of-type(1) {
	animation-delay: -1s;
}
.visualSlider li:nth-of-type(2) {
	animation-delay: 6s;
	opacity: 0;
}
.visualSlider li:nth-of-type(3) {
	animation-delay: 13s;
	opacity: 0;
}
@keyframes slide {
	0% {
		opacity: 0;
	}
	9.523% {
		opacity: 1;
	}
	33.3% {
		opacity: 1;
	}
	52.38% {
		opacity: 0;
	}
	100% {
		opacity: 0;
		transform: translateX(-80px);
	}
}
/*PC*/
@media screen and (min-width:769px) {
	.mainVisual {
		min-width: 1200px;
	}
	.visual {
		height: calc(100vh + 100px);
	}
	.visual .heading {
		width: 950px;
		margin-top: -60px;
	}
	.visual .heading .link {
		padding-top: 30px;
	}
	.visual .heading .link .arrow {
		padding: .8em 2em;
		font-size: 17px;
	}
	.visualSlider li {
		height: calc(100vh + 100px);
	}
	.visualSlider li:nth-of-type(1) {
		background-image: url("/shop/violet-background/img/mainVisual1.jpg");
	}
	.visualSlider li:nth-of-type(2) {
		background-image: url("/shop/violet-background/img/mainVisual2.jpg");
	}
	.visualSlider li:nth-of-type(3) {
		background-image: url("/shop/violet-background/img/mainVisual3.jpg");
	}
}
/*SP*/
@media screen and (max-width:768px) {
	.visual {
		height: calc(100vh + 20px);
	}
	.visual .heading {
		width:82%;
		margin-top: -60px;
	}
	.visual .heading .link {
		padding-top: 15px;
	}
	.visual .heading .link .arrow {
		padding: .5em 1em;
		font-size: 13px;
	}
	.visualSlider li {
		height: calc(100vh + 20px);
	}
	.visualSlider li:nth-of-type(1) {
		background-image: url("/shop/violet-background/img/mainVisual1_sp.jpg");
	}
	.visualSlider li:nth-of-type(2) {
		background-image: url("/shop/violet-background/img/mainVisual2_sp.jpg");
	}
	.visualSlider li:nth-of-type(3) {
		background-image: url("/shop/violet-background/img/mainVisual3_sp.jpg");
	}
}

/* メインコンテンツ */
.contentsBox {
	position: relative;
}
/*PC*/
@media screen and (min-width:769px) {
	.contentsBox {
		width: 1200px;
		margin: 0 auto;
	}
	.decoFrame li {
		position: absolute;
	}
	.decoFrame .dFL {
		top: 50px;
		left: -1070px;
	}
	.decoFrame .dFR {
		top: 270px;
		right: -1000px;
		width:940px
	}
}

/* イントロダクションコンテンツ */
.introWrap {
	position: relative;
}
.introWrap::before {
	content: '';
	position: absolute;
	top: -160px;
	right: -100%;
	left: -100%;
	width: 100vw;
	height: 100%;
	margin: auto;
	background: -webkit-linear-gradient(top, rgba(28,16,6,.4) 0%,rgba(77,101,119,0) 95%,rgba(125,185,232,0) 100%);
	background: linear-gradient(to bottom, rgba(28,16,6,.4) 0%,rgba(77,101,119,0) 95%,rgba(125,185,232,0) 100%);
}
.intro {
	position: relative;
	text-align: center;
}
/*PC*/
@media screen and (min-width:769px) {
	.introWrap::before {
		top: -160px;
		min-width: 1200px;
	}
	.intro {
		padding: 120px 0 200px;
	}
}
/*SP*/
@media screen and (max-width:768px) {
	.introWrap::before {
		top: -60px;
	}
	.intro {
		width: 100%;
		padding: 60px 0 120px;
	}
}

/* 商品説明コンテンツ */
.preamble {
	margin: 0 auto;
}
.spec .box {
	background: rgba(255, 239, 210, .6);
}
.spec .textBox .text {
	line-height: 2.2;
}
.spec .textBox .headingBox {
	position: relative;
}
.spec .textBox .headingBox .textImg {
	position: absolute;
}
.spec .imgBox {
	letter-spacing: .1em;
}
.spec .imgBox .imgList {
	display: -webkit-flex;display: flex;
}
.spec .imgBox .imgList .img1 {
	border-color: #be8e3f;
	border-style: solid;
	border-top-width: 2px;
	border-right-width: 1px;
	border-bottom-width: 2px;
	border-left-width: 2px;
}
.spec .imgBox .imgList .img2 {
	border-color: #be8e3f;
	border-style: solid;
	border-top-width: 2px;
	border-right-width: 2px;
	border-bottom-width: 2px;
	border-left-width: 1px;
}
.spec .imgBox .imgList .triangle {
	vertical-align: middle;
}
.spec .imgBox .descList li {
	padding-left: 1em;
	text-indent: -1em;
}
/*PC*/
@media screen and (min-width:769px) {
	.descript {
		padding-top: 145px;
	}
	.preamble {
		width: 1000px;
	}
	.preamble .text {
		padding-top: 40px;
		font-size: 18px;
		line-height: 2.7;
	}
	.spec {
		width: 1200px;
		margin: 0 auto;
		padding: 120px 0 70px;
	}
	.spec .box {
		width: 100vw;
		margin: 0 calc(50% - 50vw) 0 0;
	}
	.spec .container {
		padding: 100px 0 100px 100px;
	}
	.spec .inner {
		display: -webkit-flex;display: flex;
		-webkit-align-items: center;align-items: center;
		min-width: 830px;
	}
	.spec .textBox {
		width: 400px;
		margin-right: 100px;
	}
	.spec .textBox .heading {
		font-size: 32px;
	}
	.spec .textBox .headingBox .textImg {
		top: -27px;
		left: -47px;
	}
	.spec .textBox .text {
		padding-top: 35px;
	}
	.spec .imgBox {
		font-size: 13px;
	}
	.spec .imgBox .imgList .img img {
		width: 250px;
	}
	.spec .imgBox .imgList .triangle {
		padding-right: 5px;
		font-size: 8px;
	}
	.spec .imgBox .imgList2 {
		padding-top: 30px;
	}
	.spec .imgBox .descList {
		width: 500px;
		padding-top: 25px;
	}
}
/*SP*/
@media screen and (max-width:768px) {
	.descript {
		padding-top: 80px;
	}
	.preamble {
		width: 92%;
	}
	.preamble .text {
		padding: 25px 0 30px;
		font-size: 14px;
		line-height: 2;
	}
	.spec {
		padding-bottom:70px;
	}
	.spec .box {
		width: 96%;
		margin: 0 0 0 auto;
	}
	.spec .container {
		width: 92%;
		margin: 0 auto;
		padding: 60px 0 40px 20px;
	}
	.spec .textBox .heading {
		font-size: 22px;
	}
	.spec .textBox .text {
		padding-top: 20px;
	}
	.spec .textBox .headingBox .textImg {
		top: -15px;
		left: -10px;
		width: 120px;
	}
	.spec .imgBox {
		width: 100%;
		padding-top: 30px;
		font-size: 10px;
	}
	.spec .imgBox .imgList2 {
		padding-top: 20px;
	}
	.spec .imgBox .imgList .triangle {
		padding-right: 3px;
		font-size: 6px;
	}
	.spec .imgBox .descList {
		padding-top: 20px;
	}
}

/*書籍紹介コンテンツ*/
.chapter {
	position: relative;
}
.chapterSlider {
	position: relative;
}
.chapterSlider li {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	animation-duration: 15s;
	animation-timing-function: ease-out;
	animation-iteration-count: infinite;
	background-position: center;
	background-size: cover;
}
.chapterSlider li.show {
	animation-name: fade;
}
.chapterSlider li:nth-of-type(1) {
	animation-delay: -1s;
}
.chapterSlider li:nth-of-type(2) {
	animation-delay: 4s;
	opacity: 0;
}
.chapterSlider li:nth-of-type(3) {
	animation-delay: 9s;
	opacity: 0;
}
@keyframes fade {
	0% {
		opacity: 0;
	}
	13.33% {
		opacity: 1;
	}
	33.3% {
		opacity: 1;
	}
	46.66% {
		opacity: 0;
	}
	100% {
		opacity: 0;
	}
}
.chapter .chapterBg {
	background-position: center;
	background-size: cover;
}
.chapter .heading {
	position: relative;
	padding-top: 15px;
}
.chapter .chapterBox {
	background: rgba(255, 250, 241, .9);
}
.chapter .chapterBox.one {
	position: absolute;
}
.chapter .chapterBoxList {
	position: absolute;
}
.chapter .chapterBoxList .chapterBox {
	position: relative;
}
.chapter .chapterBox .container {
	border: 2px solid #7c6651;
}
.chapter .chapterBox .textImg {
	text-align: center;
}
.chapter .chapterBox .textBox {
	text-align: center;
}
.chapter .chapterBox .textBox .text {
	display: inline-block;
	text-align: left;
}
.chapter .chapterBox .deco {
	position: absolute;
}
/*PC*/
@media screen and (min-width:769px) {
	.chapter {
		height: 620px;
	}
	.chapterSlider li, .chapter .chapterBg {
		height: 620px;
	}
	.chapter1 .chapterSlider li:nth-of-type(1) {
		background-image: url("/shop/violet-background/img/chapter1Bg1.jpg");
	}
	.chapter1 .chapterSlider li:nth-of-type(2) {
		background-image: url("/shop/violet-background/img/chapter1Bg2.jpg");
	}
	.chapter1 .chapterSlider li:nth-of-type(3) {
		background-image: url("/shop/violet-background/img/chapter1Bg3.jpg");
	}
	.chapter2 .chapterSlider li:nth-of-type(1) {
		background-image: url("/shop/violet-background/img/chapter2Bg1.jpg");
	}
	.chapter2 .chapterSlider li:nth-of-type(2) {
		background-image: url("/shop/violet-background/img/chapter2Bg2.jpg");
	}
	.chapter2 .chapterSlider li:nth-of-type(3) {
		background-image: url("/shop/violet-background/img/chapter2Bg3.jpg");
	}
	.chapter3 .chapterBg {
		background-image: url("/shop/violet-background/img/chapter3Bg.jpg");
	}
	.chapter4-5 .chapterBg {
		background-image: url("/shop/violet-background/img/chapter4-5Bg.jpg");
	}
	.chapter .heading {
		width: 1200px;
		margin: 0 auto;
	}
	.chapter .chapterBox {
		padding: 10px;
	}
	.chapter .chapterBox.one {
		top: 50%;
		transform: translateY(-50%);
	}
	.chapter .chapterBox.right.one {
		right: 50px;
	}
	.chapter .chapterBox.left.one {
		left: 70px;
	}
	.chapter .chapterBoxList {
		display: -webkit-flex;display: flex;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
	}
	.chapter .chapterBoxList .chapterBox:first-child {
		margin-right: 100px;
	}
	.chapter .chapterBox .container {
		padding: 60px;
	}
	.chapter .chapterBox .textImg {
		width: 300px;
	}
	.chapter .chapterBox .textBox {
		margin: auto;
		padding-top: 40px;
	}
	.chapter .chapterBox.one .textBox {
		width: 230px;
	}
	.chapter .chapterBoxList .chapterBox .textBox {
		width: 295px;
	}
	.chapter .chapterBox .deco {
		width: 260px;
		top: -25px;
		left: -22px;
	}
}
/*SP*/
@media screen and (max-width:768px) {
	.chapter {
		height: 90vh;
	}
	.chapterSlider li, .chapter .chapterBg {
		height: 90vh;
	}
	.chapter.chapter4-5, .chapter.chapter4-5 .chapterBg {
		height: 110vh;
		}
	.chapter1 .chapterSlider li:nth-of-type(1) {
		background-image: url("/shop/violet-background/img/chapter1Bg1_sp.jpg");
	}
	.chapter1 .chapterSlider li:nth-of-type(2) {
		background-image: url("/shop/violet-background/img/chapter1Bg2_sp.jpg");
	}
	.chapter1 .chapterSlider li:nth-of-type(3) {
		background-image: url("/shop/violet-background/img/chapter1Bg3_sp.jpg");
	}
	.chapter2 .chapterSlider li:nth-of-type(1) {
		background-image: url("/shop/violet-background/img/chapter2Bg1_sp.jpg");
	}
	.chapter2 .chapterSlider li:nth-of-type(2) {
		background-image: url("/shop/violet-background/img/chapter2Bg2_sp.jpg");
	}
	.chapter2 .chapterSlider li:nth-of-type(3) {
		background-image: url("/shop/violet-background/img/chapter2Bg3_sp.jpg");
	}
	.chapter3 .chapterBg {
		background-image: url("/shop/violet-background/img/chapter3Bg_sp.jpg");
	}
	.chapter4-5 .chapterBg {
		background-image: url("/shop/violet-background/img/chapter4-5Bg_sp.jpg");
	}
.chapter .heading {
	width: 96%;
	margin: 0 0 0 auto;
}
.chapter .heading img {
	width: 75%;
}
	.chapter .chapterBox {
		width: 80%;
		margin: 0 auto;
		padding: 10px;
	}
	.chapter .chapterBox.one {
		right: 0;
		bottom: 40px;
		left: 0;
	}
	.chapter .chapterBoxList {
		top: 50%;
		transform: translateY(-50%);
	}
	.chapter .chapterBoxList .chapterBox:nth-child(2) {
		margin-top: 20px;
	}
	.chapter .chapterBox .container {
		padding: 35px;
	}
	.chapter .chapterBoxList .chapterBox .container {
		padding: 35px 20px;
	}
	.chapter .chapterBox .textBox {
		padding-top: 30px;
	}
	.chapter .chapterBoxList .chapterBox .textBox {
		padding-top: 20px;
	}
	.chapter .chapterBox .deco {
		top: -10px;
		left: -12px;
		width: 150px;
	}
}

/*商品概要コンテンツ*/
.overview .headingBox {
	text-align: center;
}
.overview .detailBox {
	margin: 0 auto;
}
.overview .detail .textBox .list {
	padding: 25px 0;
}
.overview .detail .textBox .arrow {
	padding: 1em;
}
.overview .detail .textBox .arrow .deco {
	padding-left: 4em;
}
/*PC*/
@media screen and (min-width:769px) {
	.overview .box {
		margin: 20px;
		border: solid 4px #a36c2f;
	}
	.overview .box .innerBorder {
		margin: 6px;
		padding: 90px 0;
		border: solid 2px #a36c2f;
	}
	.overview .headingBox .heading {
		padding-bottom: 30px;
		font-size: 34px;
	}
	.overview .headingBox .supp {
		padding: 30px 0;
		font-size: 22px;
	}
	.overview .detailBox {
		width: 600px;
	}
	.overview .detail {
		font-size: 14px;
	}
	.overview .detail .textBox {
		padding-left: 30px;
	}
	.overview .detail .textBox .list {
		line-height: 2.2;
	}
	.overview .detail .textBox .ti3 {
		padding-left: 3em;
		text-indent: -3em;
	}
}
/*SP*/
@media screen and (max-width:768px) {
	.overview .box {
		width: 97%;
		margin: 20px auto;
		border: solid 2px #a36c2f;
	}
	.overview .box .innerBorder {
		margin: 4px;
		padding: 45px 10px;
		border: solid 1px #a36c2f;
	}
	.overview .headingBox .heading {
		padding-bottom: 15px;
		font-size: 22px;
	}
	.overview .headingBox .heading .small {
		font-size: 15px;
		letter-spacing: .07em;
	}
	.overview .headingBox .supp {
		padding: 15px 0;
		font-size: 14px;
	}
	.overview .detailBox {
		width: 88%;
	}
	.overview .detail {
		font-size: 12px;
	}
	.overview .detail .textBox .list {
		line-height: 2;
	}
	.overview .detail .link {
		text-align: center;
	}
	.overview .detail .textBox .arrow {
		width: 100%;
		max-width: 400px;
	}
	.overview .detail .textBox .arrow ul {
		-webkit-justify-content: space-between;justify-content: space-between;
	}
}

/* ムービーコンテンツ */
.movie {
	position: relative;
}
/*PC*/
@media screen and (min-width:769px) {
	.movieWrap {
		padding-top: 80px;
	}
	.movie {
		width: 750px;
		margin-top: 90px;
	}
	.movie a {
		display: block;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%,-50%);
		width: 646px;
		background: #eab857;
	}
	.movie a img {
		transition: .8s ease-out;
	}
	.movie a:hover img {
		opacity: .8;
	}
	.movie .frame {
		position: relative;
		pointer-events: none;
	}
}
/*SP*/
@media screen and (max-width:768px) {
	.movieWrap {
		padding-top: 40px;
	}
	.movie {
		margin-top: 45px;
	}
	.movie a {
		width: 83%;
	}
}


/* SNSコンテンツ */
.socialWrap {
	position: relative;
}
.social {
	display: -webkit-flex; display: flex;
}
.socialList {
	display: -web-kit-flex; display: flex;
	-webkit-align-items: center; align-items: center;
}
	.socialList li a {
		color: #291809;
	}
/*PC*/
@media screen and (min-width:769px) {
	.social {
		-webkit-align-items: center; align-items: center;
		padding: 100px 0 0 100px;
	}
	.social .heading {
		width: 95px;
	}
	.socialList {
		padding-left: 15px;
	}
	.socialList li a {
		font-size: 55px;
		transition: .6s ease-out;
	}
	.socialList li a.icon-tw {
		font-size: 65px;
	}
	.socialList li a:hover {
		opacity: .6;
	}
}
/*SP*/
@media screen and (max-width:768px) {
	.social {
		-webkit-flex-direction: column;flex-direction: column;
		width: 92%;
		margin: 0 auto;
		padding: 50px 0 48%;
	}
	.social .heading {
		width: 55px;
		margin-left: 20px;
	}
	.socialList {
		padding-left: 15px;
	}
	.socialList li a {
		font-size: 40px;
	}
	.socialList li a.icon-tw {
		font-size: 50px;
	}
}
/*Tab*/
@media screen and (width:768px) {
	.social .heading {
		width: 70px;
	}
	.socialList li a {
		font-size: 55px;
	}
	.socialList li a.icon-tw {
		font-size: 65px;
	}

}

/* 飾りのテーブル */
.decoTable {
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
}
/*PC*/
@media screen and (min-width:769px) {
	.decoTable {
		width: 1486px;
	}
}
/*SP*/
@media screen and (max-width:768px) {
	.decoTable {
		width: 100%;
		margin-bottom: -1px;
	}
}

/*+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-     Footer Contents     -+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+*/
.footerWrap {
	position: relative;
}
.bannerList {
	display: -webkit-flex; display: flex;
	-webkit-justify-content: center; justify-content: center;
}
.copyright {
	text-align: center;
	color: #a09069;
}
/*PC*/
@media screen and (min-width:769px) {
	.footerWrap {
		padding: 390px 0 30px 0;
	}
	.bannerList li {
		width: 200px;
		margin: 0 15px;
	}
	.bannerList li a {
		transition: .8s ease-out;
	}
	.bannerList li a:hover {
		opacity: .8;
	}
	.copyright {
		padding-top: 30px;
		font-size: 13px;
	}
}
/*SP*/
@media screen and (max-width:768px) {
	.footerWrap {
		padding: 40px 0 30px 0;
		background: #20140e;
	}
	.bannerList {
		-webkit-flex-direction: column;flex-direction: column;
		width: 50%;
		max-width: 180px;
		margin: 0 auto;
	}
	.bannerList li {
		max-width: 180px;
	}
	.bannerList li:nth-child(n + 2) {
		margin-top: 13px;
	}
	.copyright {
		width: 82%;
		margin: 0 auto;
		padding-top: 15px;
		font-size: 10px;
	}
}
/*Tab*/
@media screen and (width:768px) {
	.bannerList {
		-webkit-flex-direction: unset;flex-direction: unset;
		width: 92%;
		max-width: none;
	}
	.bannerList li {
		margin: 0 15px;
	}
	.bannerList li:nth-child(n + 2) {
		margin-top: 0;
	}
}