@charset "UTF-8";


/*
■ 汎用
■ ヘッダー
■ リード
■ スタイル
■ 商品紹介
■ インスタライブ
■ プロフィール
■ バックナンバー メニュー
■ フッター
*/



/* ■ 汎用 ==================================================================================== */

/* 背景色 */
.Bg1 {
background-color: #e8e7fb;
}

.Bg2 {
background-color: #f6f6f6;
}

/* アニメーション */
.InView {
opacity: 0;
}

.Effect1 {
opacity: 1;
transition: 1.5s ease 0.01s;
}

/* Disabled */
.Disabled {
opacity: 0.15;
pointer-events: none;
}

@media only screen and (max-width: 767px) {

	.Width1,
	.Width3 {
	margin: 0 6%;
	}

}

@media print, screen and (min-width: 768px) {

	.Width1 {
	max-width: 840px;
	margin: 0 auto;
	padding: 0 20px;
	}

	.Width2 {
	max-width: 710px;
	margin: 0 auto;
	}

	.Width3 {
	max-width: 1090px;
	margin: 0 auto;
	padding: 0 20px;
	}

}

@media print, screen and (min-width: 1090px) {

}



/* ■ ヘッダー ==================================================================================== */

#Header {
position: relative;
}

#Header .InstaSticker {
position: absolute;
}

@media only screen and (max-width: 767px) {

	#Header .InstaSticker {
	width: 32%;
	right: 4%;
	bottom: 31%;
	}

}

@media print, screen and (min-width: 768px) {

	#Header .InstaSticker {
	width: 18%;
	right: 4%;
	bottom: 4%;
	}

}

@media print, screen and (min-width: 1090px) {

	#Header .InstaSticker a:hover {
	opacity: 0.95;
	}

}



/* ■ リード ==================================================================================== */

.SectionLead h2.Mds {
font-weight: 500;
}

.SectionLead h2.Mds small {
display: inline-block;
margin-top: 1.5%;
font-size: 50%;
vertical-align: top;
}

.SectionLead .Lead1 {
line-height: 2.2em;
}

.SectionLead .Notice,
.SectionLead .Notice2 {
color: #e53656;
}

@media only screen and (max-width: 767px) {

	.SectionLead {
	padding: 10% 0 7% 0;
	}

	.SectionLead h2.Mds {
	margin-bottom: 4%;
	font-size: 140%;
	line-height: 1.8em;
	}

	.SectionLead .Lead1 {
	font-size: 94%;
	}

	.SectionLead .Notice2 {
	margin-top: 4%;
	font-size: 80%;
	}

}

@media print, screen and (min-width: 768px) {

	.SectionLead {
	padding: 6% 0 8% 0;
	}

	.SectionLead h2.Mds {
	margin-bottom: 5%;
	font-size: 253%;
	line-height: 1.8em;
	font-weight: 500;
	}

	.SectionLead .Lead1 {
	font-size: 107%;
	}

	.SectionLead .Notice2 {
	margin-top: 2%;
	font-size: 87%;
	}

}

@media print, screen and (min-width: 1090px) {

}



/* ■ スタイル ==================================================================================== */

.SectionStyle .Lead1 {
position: relative;
}

.SectionStyle .Lead1:before,
.SectionStyle .Lead1:after {
display: inline-block;
position: absolute;
font-weight: 200;
font-family: "Noto Sans JP","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ","Meiryo","ＭＳ Ｐゴシック",Sans-Serif;
}

.SectionStyle .Lead1:before {
content: "“";
}

.SectionStyle .Lead1:after {
content: "”";
}

.SectionStyle .Lead1 span {
font-weight: 300;
background: linear-gradient(transparent 70%, #e8e7fb 70%);
}

@media only screen and (max-width: 767px) {

	.SectionStyle {
	margin-bottom: 12%;
	}

	.SectionStyle .Lead1 {
	margin: 8% 8%;
	font-size: 107%;
	line-height: 2.2em;
	}

	.SectionStyle .Lead1:before,
	.SectionStyle .Lead1:after {
	font-size: 134%;
	}

	.SectionStyle .Lead1:before {
	left: -12px;
	top: 2px;
	}

	.SectionStyle .Lead1:after {
	bottom: 0;
	}

}

@media print, screen and (min-width: 768px) {

	.SectionStyle {
	margin-bottom: 8%;
	}

	.SectionStyle h2.Mds,
	.SectionStyle .Photo1,
	.SectionStyle .Photo2 {
	width: 50%;
	}

	.SectionStyle.LR .Mds {
	float: right;
	}

	.SectionStyle.LR .Photo1 {
	float: left;
	}

	.SectionStyle.LR .Photo2 {
	float: right;
	}

	.SectionStyle.RL .Mds {
	float: left;
	}

	.SectionStyle.RL .Photo1 {
	float: right;
	}

	.SectionStyle.RL .Photo2 {
	float: left;
	}

	.SectionStyle .Lead1 {
	width: 60%;
	margin-top: 8%;
	}

	.SectionStyle.LR .Lead1 {
	margin-left: 20%;
	}

	.SectionStyle.RL .Lead1 {
	margin-left: 12%;
	}

	.SectionStyle .Lead1 span {
	font-size: 136%;
	line-height: 2.2em;
	}

	.SectionStyle .Lead1:before,
	.SectionStyle .Lead1:after {
	font-size: 200%;
	}

	.SectionStyle .Lead1:before {
	left: -18px;
	top: 5px;
	}

	.SectionStyle .Lead1:after {
	bottom: 10px;
	}
	
}

@media print, screen and (min-width: 1090px) {

	.SectionStyle {
	margin-bottom: 13%;
	}

	.SectionStyle .Lead1 {
	width: 56%;
	}

	.SectionStyle.LR .Lead1 {
	margin-left: 36%;
	}

}



/* ■ 商品紹介 ==================================================================================== */

.SectionItem {
border-top: 1px solid #e5e5e5;
text-align: center;	
}

.SectionItem .Notice,
.SectionItem .Notice2 {
color: #e53656;
}

/* サンプル展示店舗 */
.SectionStore {
border: 1px solid #000;
}

.SectionStore h3.Mds {
font-weight: 500;
}

.SectionStore .StoreUnit {
background: #f6f6f6;
}

.SectionStore .StoreUnit dt {
font-weight: 500;
}

/* ポイント */
.SectionPoints h3.Mds {
position: relative;
display: inline-block;
font-weight: 500;
}

.SectionPoints h3.Mds:before,
.SectionPoints h3.Mds:after {
position: absolute;
height: 1px;
background: #000;
content: "";
}

.SectionPoints h3.Mds:before {
transform: rotate(65deg);
}

.SectionPoints h3.Mds:after {
transform: rotate(-65deg);
}

.SectionPoints h4.Mds {
font-weight: 500;
}

.SectionPoints .Lead3 {
text-align: left;
font-weight: 300;
}

/* 注釈 */
.SectionItem .ListKomeS li {
display: inline-block;
font-weight: 300;
}

@media only screen and (max-width: 767px) {

	.SectionItem {
	margin-top: 15%;
	padding: 10% 0;
	}

	.SectionItem h2.Mds {
	margin-bottom: 2%;
	padding: 0 8%;
	}

	.SectionItem .Photo {
	margin: 10px -6% 0 -6%;
	padding: 12px 0;
	}

	.SectionItem .Lead1 {
	margin-top: 10px;
	font-size: 94%;
	}

	.SectionItem .Lead2 {
	margin-bottom: 10px;
	font-size: 94%;
	}

	.SectionItem .Lead2 .Tax {
	display: inline-block;
	font-size: 70%;
	}
	
	.SectionItem .Notice {
	margin-top: 4%;
	font-size: 108%;
	line-height: 2.0em;
	}

	.SectionItem .Notice2 {
	margin-top: 4%;
	font-size: 80%;
	text-align: left;
	line-height: 2.0em;
	}
	
	.SectionItem .BtnBuy a {
	margin-bottom: 30px;
	width: 240px;
	padding: 15px 0;
	font-size: 134%;
	}

	/* サンプル展示店舗 */
	.SectionStore {
	padding: 25px 20px;
	}

	.SectionStore h3.Mds {
	margin-bottom: 5%;
	font-size: 94%;
	text-align: left;
	}

	.SectionStore .StoreUnit {
	padding: 20px;
	}

	.SectionStore .StoreUnit dt,
	.SectionStore .StoreUnit dd {
	text-align: left;
	}
	
	.SectionStore .StoreUnit dt {
	font-size: 87%;
	}

	.SectionStore .StoreUnit dd {
	margin-inline-start: 0;
	font-size: 80%;
	line-height: 1.8em;
	}

	.SectionStore .Notice2 {
	margin-top: 4%;
	font-size: 80%;
	text-align: left;
	}	
		
	/* ポイント */
	.SectionPoints {
	margin-top: 8%;
	}

	.SectionPoints h3.Mds {
	margin-bottom: 2%;
	font-size: 120%;
	}

	.SectionPoints h3.Mds:before,
	.SectionPoints h3.Mds:after {
	top: 15px;
	width: 25px;
	}

	.SectionPoints h3.Mds:before {
	left: -30px;
	}
	
	.SectionPoints h3.Mds:after {
	right: -25px;
	}

	.SectionPointsSub {
	margin-top: 8%;
	}

	.SectionPoints h4.Mds {
	margin-bottom: 2%;
	font-size: 114%;
	}

	.SectionPoints .Lead3 {
	font-size: 94%;
	line-height: 2.0em;
	}

	/* 注釈 */
	.PageRev2 .SectionItem .ListKomeS {
	margin-top: 8%;
	}

}

@media only screen and (max-width: 372px) {

	.SectionItem .Notice {
	font-size: 108%;
	}
	
	.SectionItem .Notice2 {
	font-size: 86%;
	}

}

@media print, screen and (min-width: 768px) {

	.SectionItem {
	padding: 6% 0;
	}

	.SectionItem .InBox {
	}

	.SectionItem h2.Mds {
	max-width: 578px;
	margin: 0 auto 7% auto;
	}

	.SectionItem .Photo {
	margin: 30px -80px 30px -80px;
	padding: 10px 0;
	}

	.PageRev2 .SectionItem .Photo {
	margin-bottom: 20px;
	}

	.SectionItem .Lead1 {
	margin-top: 30px;
	font-size: 154%;
	line-height: 1.0em;
	}

	.SectionItem .Lead2 {
	font-size: 134%;
	}

	.SectionItem .Lead2 .Tax {
	display: inline-block;
	font-size: 70%;
	}

	.SectionItem .Notice {
	position: relative;
	z-index: 1000;
	font-size: 115%;
	}

	.SectionItem .Notice2 {
	margin-top: 2%;
	font-size: 93%;
	line-height: 1.8em;
	z-index: 1000;
	}
	
	.SectionItem .BtnBuy a {
	margin-top: 15px;
	margin-bottom: 60px;
	width: 240px;
	font-size: 134%;
	}

	/* サンプル展示店舗 */
	.SectionStore {
	padding: 30px 40px;
	}

	.SectionStore h3.Mds {
	margin-bottom: 4%;
	font-size: 115%;
	line-height: 1.7em;
	}

	.SectionStore .StoreUnit {
	padding: 20px 25px;
	}

	.SectionStore .StoreUnit dl {
	display: table;
	}

	.SectionStore .StoreUnit dt,
	.SectionStore .StoreUnit dd {
	display: table-cell;
	font-size: 94%;
	text-align: left;
	vertical-align: middle;
	}

	.SectionStore .StoreUnit dt {
	width: 20%;
	}

	.SectionStore .StoreUnit dd {
	width: 80%;
	padding-left: 20px;
	line-height: 1.8em;
	}

	.SectionStore .Notice2 {
	font-size: 87%;
	}				

	/* ポイント */
	.SectionPoints {
	margin-top: 6%;
	}

	.SectionPoints h3.Mds {
	font-size: 187%;
	font-weight: 500;
	}

	.SectionPoints h3.Mds:before,
	.SectionPoints h3.Mds:after {
	top: 30px;
	width: 30px;
	}

	.SectionPoints h3.Mds:before {
	left: -40px;
	}
	
	.SectionPoints h3.Mds:after {
	right: -35px;
	}

	.SectionPointsSub {
	margin-top: 6%;
	}

	.SectionPoints h4.Mds {
	margin-bottom: 1%;
	font-size: 134%;
	}

	.SectionPoints .Lead3 {
	margin-top: 2%;
	font-size: 107%;
	line-height: 2.4em;
	}

	/* 注釈 */
	.SectionItem .ListKomeS {
	margin-top: 6%;
	}

}

@media print, screen and (min-width: 1090px) {

}



/* ■ インスタライブ ==================================================================================== */

.SectionInstaLive {
text-align: center;
}

.SectionInstaLive .InBox {
border: 1px solid #000;
background: #fff;
}

.SectionInstaLive h2.Mds {
font-weight: 500;
color: #ae92c3;
}

.SectionInstaLive .Lead2 {
font-weight: 300;
text-align: left;
}

.SectionInstaLive .BtnTo a {
display: inline-block;
color: #fff;
background: #000;
}

.SectionInstaLive .BtnTo a span {
background: url(../img/common/Icon_Instagram2.png) no-repeat;
}

.SectionInstaLive .LinkTo a {
display: inline-block;
margin: 0 2%;
line-height: 1.0em;
font-weight: 300;
color: #78b5c2;
}

@media only screen and (max-width: 767px) {

	.SectionInstaLive {
	padding: 8% 0;
	}

	.SectionInstaLive .InBox {
	padding: 8% 6%;
	}

	.SectionInstaLive .MdsSub {
	margin-bottom: 4%;
	}

	.SectionInstaLive h2.Mds {
	margin-bottom: 3%;
	font-size: 174%;
	line-height: 1.4em;
	}

	.SectionInstaLive .Lead1 {
	margin-bottom: 6%;
	font-size: 140%;
	line-height: 1.4em;
	}

	.SectionInstaLive .Lead2 {
	font-size: 94%;
	}

	.SectionInstaLive .BtnTo {
	margin-top: 6%;
	}

	.SectionInstaLive .BtnTo a {
	width: 100%;
	padding: 5% 0;
	font-size: 114%;
	}

	.SectionInstaLive .BtnTo a span {
	padding-left: 28px;
	background-size: 18px 18px;
	}

	.SectionInstaLive .LinkTo {
	margin-top: 6%;
	font-size: 94%;
	}

}

@media print, screen and (min-width: 768px) {

	.SectionInstaLive {
	padding: 6% 0;
	}

	.SectionInstaLive .InBox {
	padding: 6% 6%;
	}

	.SectionInstaLive .MdsSub {
	max-width: 416px;
	margin: 0 auto;
	}

	.SectionInstaLive h2.Mds {
	font-size: 280%;
	}

	.SectionInstaLive .Lead1 {
	font-size: 200%;
	}

	.SectionInstaLive .Lead2 {
	max-width: 800px;
	margin: 2% auto 0 auto;
	}

	.SectionInstaLive .BtnTo {
	margin-top: 4%;
	}

	.SectionInstaLive .BtnTo a {
	padding: 3% 9%;
	font-size: 160%;
	}

	.SectionInstaLive .BtnTo a span {
	padding-left: 28px;
	background-size: 20px 20px;
	}

	.SectionInstaLive .LinkTo {
	margin-top: 2%;
	}

}

@media print, screen and (min-width: 1090px) {

	.SectionInstaLive .BtnTo a span {
	padding-left: 37px;
	background-size: 26px 26px;
	}

}



/* ■ プロフィール ==================================================================================== */

.SectionProfile h2.Mds,
.SectionProfile .Lead2 {
font-weight: 300;
}

.SectionProfile .LinkTo {
margin-bottom: 10px;
}

.SectionProfile .LinkTo a {
display: inline-block;
background: url(../img/common/Icon_Instagram.png) no-repeat;
background-position: 0 50%;
}

.SectionProfile .LinkTo.Web a {
background: url(../img/common/Icon_Web.png) no-repeat;
}

.SectionProfile .LinkTo.Twitter a {
background: url(../img/common/Icon_Twitter.png) no-repeat;
}

.SectionProfile .LinkTo.YouTube a {
background: url(../img/common/Icon_YouTube.png) no-repeat;
}

@media only screen and (max-width: 767px) {

	.SectionProfile .InBox {
	margin: 0 10% 10% 10%;
	padding: 10% 0;
		}

	.SectionProfile .LBox,
	.SectionProfile .RBox {
	float: none;
	}

	.SectionProfile .Photo {
	margin-bottom: 10%;
	}

	.SectionProfile .Mds {
	margin-bottom: 5px;
	font-size: 134%;
	line-height: 1.0em;
	}

	.SectionProfile .Lead1 {
	margin-bottom: 10px;
	font-size: 94%;
	}

	.SectionProfile .Lead2 {
	margin-bottom: 20px;
	}

	.SectionProfile .LinkTo a {
	padding-left: 38px;
	font-size: 107%;
	color: #000;
	background-size: 25px 25px;
	}

	.SectionProfile .LinkTo.Web a {
	background-size: 25px 25px;
	}

	.SectionProfile .LinkTo.Twitter a {
	background-size: 25px 25px;
	}

	.SectionProfile .LinkTo.YouTube a {
	background-position: 0 3px;
	background-size: 25px 18px;
	}

}

@media print, screen and (min-width: 768px) {

	.SectionProfile {
	padding: 45px 0;
	}

	.SectionProfile .LBox {
	width: 38%;
	}

	.SectionProfile .RBox {
	width: 58%;
	}

	.SectionProfile .Mds {
	margin-bottom: 5px;
	font-size: 147%;
	line-height: 1.0em;
	}

	.SectionProfile .Lead1 {
	margin-bottom: 10px;
	font-size: 134%;
	}

	.SectionProfile .Lead2 {
	margin-bottom: 20px;
	}

	.SectionProfile .LinkTo a {
	padding-left: 35px;
	font-size: 107%;
	color: #000;
	background-size: 22px 22px;
	}

	.SectionProfile .LinkTo.Web a {
	background-size: 22px 22px;
	}

	.SectionProfile .LinkTo.Twitter a {
	background-size: 22px 22px;
	}

	.SectionProfile .LinkTo.YouTube a {
	background-position: 0 3px;
	background-size: 22px 16px;
	}

}

@media print, screen and (min-width: 1090px) {

	.SectionProfile {
	padding: 90px 0;
	}

	.SectionProfile .LinkTo a {
	padding-left: 40px;
	background-size: 26px 26px;
	}

	.SectionProfile .LinkTo.Web a {
	background-size: 26px 26px;
	}

	.SectionProfile .LinkTo.Twitter a {
	background-size: 26px 26px;
	}

	.SectionProfile .LinkTo.YouTube a {
	background-position: 0 5px;
	background-size: 26px 18px;
	}

}



/* ■ フッター ==================================================================================== */

/*
フッターセクション
SNSシェアボタン
ロゴ
オフィシャルSNS
Footer
ページの先頭へ
*/


/* フッターセクション --------------------------------------------------- */

.FooterWrap {
border-top: 1px solid #e5e5e5;
}

@media only screen and (max-width: 767px) {

	.FooterWrap {
	margin-top: 40px;
	padding-top: 30px;
	}

}

@media print, screen and (min-width: 768px) {

	.FooterWrap {
	margin-top: 80px;
	padding-top: 60px;
	}

}

@media print, screen and (min-width: 1090px) {

	.FooterWrap {
	margin-top: 100px;
	padding-top: 60px;
	}

}


/* ロゴ --------------------------------------------------- */

#Logo {
text-align: center;
}

@media only screen and (max-width: 767px) {

	#Logo {
	margin-bottom: 30px;
	}

	#Logo img {
	width: 120px;
	height: auto;
	}
	
}

@media print, screen and (min-width: 768px) {

	#Logo {
	margin-bottom: 30px;
	}

	#Logo img {
	width: 140px;
	height: auto;
	}
	
}


/* オフィシャルSNS --------------------------------------------------- */

#OfficialSNS {
text-align: center;
}

@media only screen and (max-width: 767px) {

	#OfficialSNS {
	margin-bottom: 20px;
	}
	
	#OfficialSNS ul li {
	display: inline;
	margin: 0 10px;
	}
	
	#OfficialSNS ul li img {
	width: 30px;
	height: auto;
	}

}

@media print, screen and (min-width: 768px) {

	#OfficialSNS {
	margin-bottom: 30px;
	}
	
	#OfficialSNS li {
	display: inline;
	margin: 0 15px;
	}
	
	#OfficialSNS li img {
	width: 26px;
	height: auto;
	}

}


/* Footer --------------------------------------------------- */

#Footer .Copyright {
font-size: 67%;
text-align: center;
}

@media only screen and (max-width: 767px) {

	#Footer {
	padding-bottom: 20px;
	}
	
	#Footer .Copyright {
	}

}

@media print, screen and (min-width: 768px) {

	#Footer {
	padding-bottom: 40px;
	text-align: center;
	}
	
}


/* ページの先頭へ --------------------------------------------------- */

#PageTop {
display: none;
position: fixed;
opacity: 0.7;
}

@media only screen and (max-width: 767px) {

	#PageTop {
	bottom: 10px;
	right: 10px;
	}

	#PageTop {
	width: 40px;
	}

}

@media print, screen and (min-width: 768px) {

	#PageTop {
	bottom: 20px;
	right: 20px;
	}
	
}