@charset "UTF-8";


/*
■ 汎用
■ ヘッダー
■ リード
■ 各アイテム
■ THE MET コピーライト
■ 装飾
■ フッター
■ slick
*/



/* ■ 汎用 ==================================================================================== */

/*
横幅
アイテム名
ボタン
背景色
アニメーション
背景パララックス
*/


* {
min-width: 0;
min-height: 0;
}

#Wrapper {
display: none;
}


/* 横幅 --------------------------------------------------- */

@media only screen and (max-width: 767px) {

	.Width1 {
	margin: 0 20px;
	}

}

@media print, screen and (min-width: 768px) {

	.Width1 {
	max-width: 1050px;
	margin: 0 auto;
	}

	.Width2 {

	}

	.Width3 {
		
	}

}

@media print, screen and (min-width: 1090px) {


}


/* アイテム名 --------------------------------------------------- */

.InBox {
box-sizing: border-box;
}

@media only screen and (max-width: 767px) {

	.InBox {
	margin: 0 20px;
	}

}

@media only screen and (max-width: 372px) {



}

@media print, screen and (min-width: 768px) {
	
	.InBox {
	margin: 0 20px;
	}

}

@media print, screen and (min-width: 1090px) {

	.InBox {
	margin: 0 auto;
	}

}


/* 見出し --------------------------------------------------- */

h2.Mds,
h3.Mds {
font-weight: 500;
}


/* コピーライト --------------------------------------------------- */

.Copyright {
letter-spacing: 0.01em;
color: #000;
}

@media only screen and (max-width: 767px) {

	.Copyright {
	font-size: 67%;
	}

}

@media only screen and (max-width: 372px) {


}

@media print, screen and (min-width: 768px) {

	.Copyright {
	font-size: 74%;
	}

}

@media print, screen and (min-width: 1090px) {

}


/* リンク --------------------------------------------------- */
.LinkLine {
display: inline-block;
color: #3dadd1 !important;
text-decoration: underline !important;
}


/* ボタン --------------------------------------------------- */

.Btn {
display: inline-block;
border: 1px solid #d9bb6d;
line-height: 1.0em;
text-align: center;
color: #d9bb6d !important;
}

.Btn span {
background: url(../img/common/Icon_Cart.png) no-repeat;
}

.BtnFwd {
position: relative;
}

.BtnFwd:after {
display: block;
position: absolute;
top: 50%;
right: 20px;
border-top: solid 3px;
border-right: solid 3px;
-ms-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
content: '';
}

@media only screen and (max-width: 767px) {

	.Btn {
	width: 100%;
	padding: 15px 70px 12px 70px;
	font-size: 120%;
	}

	.Btn span {
	padding-left: 22px;
	background-position: 0 3px;
	background-size: 15px auto;
	}

	.BtnFwd:after {
	width: 12px;
	height: 12px;
	margin-top: -6px;
	}

}

@media print, screen and (min-width: 768px) {

	.Btn {
	padding: 12px 40px 11px 40px;
	font-size: 107%;
	}

	.Btn span {
	padding-left: 18px;
	background-position: 0 4px;
	background-size: 12px auto;
	}

	.BtnFwd:after {
	width: 16px;
	height: 16px;
	margin-top: -8px;
	}

}

@media print, screen and (min-width: 1090px) {

}


/* 終了ボタン --------------------------------------------------- */

.BtnEnd {
display: inline-block;
border-radius: 50px;
line-height: 1.0em;
font-weight: 700;
text-align: center;
color: #fff;
background: #473b00;
}

@media only screen and (max-width: 767px) {

	.BtnEnd {
	width: 100%;
	padding: 20px 0;
	}

}

@media print, screen and (min-width: 768px) {

	.BtnEnd {
	padding: 20px 70px;
	font-size: 147%;	
	}

}

@media print, screen and (min-width: 1090px) {

}


/* 背景色 --------------------------------------------------- */

.Bg1 {

}

.Bg2 {

}



/* ■ ヘッダー ==================================================================================== */

#Header {
position: relative;
}

#Header .Slider > li:not(:first-child) {
display: none;
}

@media only screen and (max-width: 767px) {			

	#Header .TitleWrap {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
    height: 100vh;
	background: #fff;
	}
	
	#Header.After .TitleWrap {
	animation-name: HeaderTitleWrap;
	animation-timing-function: cubic-bezier(0.000, 0.130, 0.000, 0.995);
	animation-fill-mode: forwards;
	animation-duration: 1.5s;
	animation-delay: 1.0s;
	}

	@keyframes HeaderTitleWrap {
		0% {
			opacity: 1;
		}
		100% {
			opacity: 0;
		}
	}	

	#Header h1.Title {
	position: absolute;
	left: 50%;
	top: 80%;
	width: 140px;
	margin-left: -70px;
	margin-top: -106.5px;;
	z-index: 20;
	}
		
	#Header.After h1.Title {
	animation-name: HeaderTitle;
	animation-timing-function: cubic-bezier(0.000, 0.130, 0.000, 0.995);
	animation-fill-mode: forwards;
	animation-duration: 1.5s;
	animation-delay: 1.0s;
	}
	
	@keyframes HeaderTitle {
		0% {
			top: 50%;
		}
		100% {
			top: 6%;			
			left: 4%;
			width: 99px;
			margin-top: 0;
			margin-left: 0;
		}
	}

	.KeyVisual {
	position: relative;
	width: 78%;
	margin: 0 0 0 auto;
	padding-top: 15%;
	opacity: 0;
	z-index: 10; 
	}
	
	#Header.After .KeyVisual {
	animation-name: HeaderKeyVisual;
	animation-fill-mode: forwards;
	animation-duration: 1s;
	animation-delay: 2.0s;
	}

	@keyframes HeaderKeyVisual {
		0% {
			opacity: 0;
			transform: translateX(15%);
		}
		100% {
			opacity: 1;
			transform: translateX(0);
		}
	}

}

@media only screen and (max-width: 372px) {
	
		
}

@media print, screen and (min-width: 768px) {

	#Header {
	height: 450px;
	}
	
	#Header h1.Title {
	position: absolute;
	left: 50%;
	top: 50%;
	width: 140px;
	margin-left: -70px;
	margin-top: -107px;
	z-index: 20;
	}	

	#Header.After h1.Title {
	animation-name: HeaderTitle;
	animation-timing-function: cubic-bezier(0.000, 0.130, 0.000, 0.995);
	animation-fill-mode: forwards;
	animation-duration: 2s;
	animation-delay: 1.0s;
	}

	@keyframes HeaderTitle {
		0% {
			top: 50%;
		}
		100% {
			left: 3.5%;
			margin-left: 0;
		}
	}

	.KeyVisual {
	width: 75%;
	margin-left: auto;
	opacity: 0;
	}

	.KeyVisual img {
    max-width: 100%;
    max-height: 100%;
	height: 450px;
	object-fit: cover; 
	}

	#Header.After .KeyVisual {
	animation-name: HeaderKeyVisual;
	animation-fill-mode: forwards;
	animation-duration: 2.0s;
	animation-delay: 1.5s;
	}

	@keyframes HeaderKeyVisual {
		0% {
			opacity: 0;
		}
		100% {
			opacity: 1;
		}
	}

}

@media print, screen and (min-width: 1090px) {

	#Header {
	height: 100vh;
	}			

	#Header h1.Title {
	width: 180px;
	margin-left: -90px;
	margin-top: -137px;
	}	

	@keyframes HeaderTitle {
		0% {
			top: 50%;
		}
		100% {
			left: 5.5%;
			margin-left: 0;
		}
	}

	.KeyVisual img {
    height: 100vh;
	}
	
}



/* ■ リード ==================================================================================== */

.SectionLead {
background: #f8f6f4;
}
	
.SectionLead h2.Mds {
font-weight: 700;
}

@media only screen and (max-width: 767px) {

	.SectionLead {
	margin-top: -25%;
	padding: 35% 40px 10% 40px;
	animation-name: SectionLeadfadeIn;
	animation-duration: 1s;
	animation-delay: 1.5s;
	animation-iteration-count: 1;
	animation-direction: normal;
	animation-fill-mode: backwards;	
	}

	@keyframes SectionLeadfadeIn {
	  0% {
	    opacity: 0;
		transform: translateY(20%);
	  }	  
	  30% {
	    opacity: 0.5;
	  }
	  100% {
	    opacity: 1;
	    transform: translateY(0);
	  }
	}

	.SectionLead h2.Mds {
	margin-bottom: 15px;
	font-size: 135%;
	line-height: 1.6em !important;
	}

	.SectionLead .Lead1 {
	font-size: 94%;
	line-height: 2.0em;
	}

}

@media only screen and (max-width: 372px) {

	.SectionLead h2.Mds {
	font-size: 114%;
	}
		
}

@media print, screen and (min-width: 768px) {

	.SectionLead {
	padding: 10% 20px 12% 20px;
	}

	.SectionLead h2.Mds {
	margin-bottom: 25px;
	font-size: 200%;
	text-align: center;
	line-height: 1.8em !important;
	}

	.SectionLead .Lead1 {
	max-width: 880px;
	margin: 0 auto;
	font-size: 107%;
	line-height: 2.2em;
	}		
}

@media print, screen and (min-width: 1090px) {

	.SectionLead {
	padding-left: 0;
	padding-right: 0;
	}		

}


/* ■ 各アイテム ==================================================================================== */

.SectionItems {
position: relative;
}

.SectionItems .BgTop {
position: absolute;
top: 0;
left: 0;
width: 100%;
z-index: -10;	
}

/* 導入 */
.SectionItems .Intro h2.Mds {
text-align: center;
line-height: 1.2em !important;
letter-spacing: 0.2em;
}

/* ラインナップ */
.SectionItems .SectionEachItem h3.Mds {
text-align: center;
line-height: 1.0em;
}
	
.SectionItems .ItemList a {
display: block;
color: #000;
}

.SectionItems .ItemList a {
display: block;
color: #000;
}

.SectionItems .ItemList .BtnBuy {
display: inline-block;
background: #000;
font-weight: 300;
text-align: center;
line-height: 1.0em;
letter-spacing: 0.2em;
}

.SectionItems .ItemList .BtnBuy span {
display: inline-block;
background: #000 url(../img/common/Icon_Cart.png) no-repeat;
background-position: 0 40%;
font-weight: bold;
color: #fff;
}

/* イメージフォト（スライド） */	
.SectionItems .ImagePhoto li {
pointer-events: none;
}

/* Cate1 */
.SectionItems#Cate1 .BgTop {
background-color: #dfe8de;
}

.SectionItems#Cate1 .ImagePhoto {
background: #dfe8de;
}

/* Cate2 */
.SectionItems#Cate2 .BgTop {
background-color: #f7f0cf;
}

.SectionItems#Cate2 .ImagePhoto {
background: #f7f0cf;
}
		
@media only screen and (max-width: 767px) {

	.SectionItems {
	padding: 10% 0 0 0;
	}

	.SectionItems .BgTop {
	height: 8.5%;
	}
	
	/* 導入 */
	.SectionItems .Intro {
	margin-bottom: 12%;
	padding: 0 40px;
	}
	
	.SectionItems .Intro h2.Mds {
	margin-bottom: 30px;
	font-size: 268% !important;	
	}

	.SectionItems .ItemMain {
	margin-bottom: 35px;
	}	

	.SectionItems .Intro .Artwork {
	margin-top: 30px;	
	}

	.SectionItems .Intro .Artwork .Photo {
	margin-bottom: 15px;	
	}

	.SectionItems .Intro .Artwork .Lead {
	font-size: 67%;
	}	

	/* ラインナップ */	
	.SectionItems .SectionEachItem {
	padding: 0 40px;
	}

	.SectionItems .SectionEachItem h3.Mds {
	margin-bottom: 25px;
	font-size: 154% !important;	
	letter-spacing: 0.15em;
	}
				
	.SectionItems .ItemList > li {
	margin-bottom: 15%;
	}

	.SectionItems .ItemList > li:last-child {
	margin-bottom: 0;
	}

	.SectionItems .ItemList .Photo {
	margin-bottom: 20px;
	}				

	.SectionItems .ItemList .Num {
	font-size: 100%;
	}	

	.SectionItems .ItemList .Name {
	font-size: 114%;
	}

	.SectionItems .ItemList .Price {
	font-size: 100%;
	}

	.SectionItems .ItemList .Price span {
	font-size: 80%;
	}

	.SectionItems .ItemList .BtnBuy {
	width: 60%;
	margin-top: 15px;
	padding: 10px 0 ;
	font-size: 108%;
	}

	.SectionItems .ItemList .BtnBuy span {
	padding-left: 25px;
	background-size: 13px auto;
	}	

	/* イメージフォト（スライド） */	
	.SectionItems .ImagePhoto {
	margin-top: 15%;
	padding-bottom: 15%;
	}
					
}

@media only screen and (max-width: 372px) {


}

@media print, screen and (min-width: 768px) {

	.SectionItems {
	padding: 8% 0 0 0;
	}
	
	.SectionItems .BgTop {
	height: 18%;
	}			

	.SectionItems#Cate2 .BgTop {
	height: 20%;
	}	
	
	/* 導入 */
	.SectionItems .Intro {
	display: flex;
	max-width: 890px;
	margin: 0 auto 6% auto;
	padding: 0 20px;
	justify-content: space-between;
	}

	.SectionItems .Intro.R {
	flex-direction : row-reverse;
	}
	
	.SectionItems .Intro .ItemMain {
	width: 55%;	
	margin-top: 15%;
	}

	.SectionItems#Cate2 .Intro .ItemMain {
	margin-top: 17%;
	}		

	.SectionItems .Intro .DetailBox {
	width: 40%;		
	}

	.SectionItems .Intro .LeadUnit {
	background: #dfe8de;	
	}
	
	.SectionItems .Intro h2.Mds {
	margin-bottom: 50px;
	font-size: 348% !important;	
	}

	.SectionItems .Intro .Artwork {
	margin-top: 40%;	
	}

	.SectionItems .Intro .Artwork .Photo {
	margin-bottom: 25px;	
	}

	.SectionItems .Intro .Artwork .Lead {
	font-size: 80%;
	line-height: 2.2em;	
	}			

	/* ラインナップ */
	.SectionItems .SectionEachItem h3.Mds {
	margin-bottom: 90px;
	font-size: 240% !important;
	letter-spacing: 0.2em;
	}
	
	.SectionItems .ItemList {
	display: flex;
	max-width: 920px;
	margin: 0 auto;
	padding: 0 20px;	
	justify-content: space-between;
	flex-wrap:wrap;
	}

	.SectionItems .ItemList > li {
	width: 45%;
	margin-bottom: 70px;
	}

	.SectionItems .ItemList > li:nth-child(2n+1):nth-last-child(-n+2),
	.SectionItems .ItemList > li:nth-child(2n+1):nth-last-child(-n+2) ~ li {	 
	margin-bottom: 0;
	}

	.SectionItems .ItemList .PhotoSlide1,
	.SectionItems .ItemList .PhotoSlide2 {
	margin-bottom: 30px;
	}				

	.SectionItems .ItemList .Name {
	font-size: 120%;
	}	
	
	.SectionItems .ItemList .Num {
	font-size: 107%;
	}	
	
	.SectionItems .ItemList .Price span {
	font-size: 80%;
	}

	.SectionItems .ItemList .BtnBuy {
	width: 45%;
	margin-top: 25px;
	padding: 10px 0 ;
	font-size: 108%;
	}

	.SectionItems .ItemList .BtnBuy span {
	padding-left: 25px;
	background-size: 13px auto;
	}	

	/* イメージフォト（スライド） */	
	.SectionItems .ImagePhoto {
	margin-top: 10%;
	padding-bottom: 10%;
	}	
			
}

@media print, screen and (min-width: 1090px) {
	
	.SectionItems .BgTop {
	height: 17%;
	}	

	.SectionItems#Cate2 .BgTop {
	height: 17%;
	}	

	/* 導入 */	
	.SectionItems .Intro {
	max-width: 1050px;
	padding-left: 0;
	padding-right: 0;
	}

	.SectionItems .Intro .ItemMain {
	margin-top: 8%;
	}

	/* ラインナップ */
	.SectionItems .ItemList {
	padding-left: 0;
	padding-right: 0;
	}
					
}



/* ■ THE MET コピーライト ==================================================================================== */

.TheMetCopyrightWrap {
background: #f8f6f4;
}

.TheMetCopyrightWrap .CopyrightUnit p {
line-height: 1.0em;
}

.TheMetCopyrightWrap .TheMetCopyright {
line-height: 1.0em;
}		

@media only screen and (max-width: 767px) {

	.TheMetCopyrightWrap {
	padding: 40px 0 50px 0;
	background: #f8f6f4;
	}

	.TheMetCopyrightWrap .CopyrightUnit {
	margin: 0 40px;
	}		

	.TheMetCopyrightWrap .CopyrightUnit .Sub {
	padding-top: 30px;
	}	
	
	.TheMetCopyrightWrap .TheMetCopyright {
	margin-top: 25px;
	margin: 25px 40px 0 40px;
	line-height: 1.0em;
	}	
	
	.TheMetCopyrightWrap .TheMetCopyright img {
	width: 205px;
	height: auto;
	}			
}

@media only screen and (max-width: 372px) {


}

@media print, screen and (min-width: 768px) {

	.TheMetCopyrightWrap {
	padding: 80px 0 70px 0;
	}	

	.TheMetCopyrightWrap .CopyrightUnit {
	display: flex;
	align-items: center;
	max-width: 790px;
	margin: 0 auto;
	padding: 0 20px;
	}	

	.TheMetCopyrightWrap .CopyrightUnit p {
	width: 50%;
	padding: 40px 0 30px 0;
	box-sizing: border-box;
	}

	.TheMetCopyrightWrap .CopyrightUnit .Main {
	padding-right: 5%;
	border-right: 1px solid #000;
	}

	.TheMetCopyrightWrap .CopyrightUnit .Sub {
	padding-left: 5%;
	}		

	.TheMetCopyrightWrap .TheMetCopyright {
	margin-top: 80px;
	text-align: center;
	}	
	
	.TheMetCopyrightWrap .TheMetCopyright img {
	width: 248px;
	height: auto;
	}	

}

@media print, screen and (min-width: 1090px) {

	.TheMetCopyrightWrap .CopyrightUnit {
	max-width: 790px;
	padding-left: 0;
	padding-right: 0;
	}	
		
}



/* ■ フッター ==================================================================================== */

/*
フッターセクション
SNSシェアボタン
ロゴ
オフィシャルSNS
Footer
ページの先頭へ
*/


/* フッターセクション --------------------------------------------------- */

.FooterWrap {
border-top: 1px solid #e5e5e5;
}
		
@media only screen and (max-width: 767px) {

	.FooterWrap {
	padding-top: 8%;
	}
		
}

@media print, screen and (min-width: 768px) {

	.FooterWrap {
	padding-top: 3%;
	}
		
}

@media print, screen and (min-width: 1090px) {

}


/* ロゴ --------------------------------------------------- */

#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;
z-index: 10000;
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;
	}
	
}


/* ■ slick ==================================================================================== */

.slick-slider
{
    position: relative;

    display: block;
    box-sizing: border-box;

    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;

    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
        touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}

.slick-list
{
    position: relative;

    display: block;
    overflow: hidden;

    margin: 0;
    padding: 0;
}
.slick-list:focus
{
    outline: none;
}
.slick-list.dragging
{
    cursor: pointer;
    cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list
{
    -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
         -o-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
}

.slick-track
{
    position: relative;
    top: 0;
    left: 0;

    display: block;
    margin-left: auto;
    margin-right: auto;
}
.slick-track:before,
.slick-track:after
{
    display: table;

    content: '';
}
.slick-track:after
{
    clear: both;
}
.slick-loading .slick-track
{
    visibility: hidden;
}

.slick-slide
{
    display: none;
    float: left;

    height: 100%;
    min-height: 1px;
}
[dir='rtl'] .slick-slide
{
    float: right;
}
.slick-slide img
{
    display: block;
}
.slick-slide.slick-loading img
{
    display: none;
}
.slick-slide.dragging img
{
    pointer-events: none;
}
.slick-initialized .slick-slide
{
    display: block;
}
.slick-loading .slick-slide
{
    visibility: hidden;
}
.slick-vertical .slick-slide
{
    display: block;

    height: auto;

    border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
    display: none;
}

/* 装飾 -------------------------------------- */

/* Dots */
.slick-dotted.slick-slider {
margin-bottom: 35px;
}

.slick-dots {
position: absolute;
display: block;
width: 100%;
padding: 0;
margin: 0;
list-style: none;
}

.SectionItems .ItemMain .slick-dots {
text-align: center;
}

.SectionItems#Cate3 .ItemMain .slick-dots {
display: none;
}

.SectionItems .SectionEachItem .ItemList .slick-dots {
text-align: center;
}

@media only screen and (max-width: 767px) {

	.SectionItems .ItemMain .slick-dots {
	bottom: -35px;
	}

	.SectionItems .SectionEachItem .ItemList .slick-dots {
	bottom: 5px;
	}
	
}

@media print, screen and (min-width: 768px) {

	.SectionItems .ItemMain .slick-dots {
	bottom: -65px;
	}

	.SectionItems .SectionEachItem .ItemList .slick-dots {
	bottom: 10px;
	}

}

.slick-slider .slick-dots li {
float: none;
position: relative;
display: inline-block;
padding: 0;
vertical-align: top;
cursor: pointer;
}

@media only screen and (max-width: 767px) {

	.SectionItems .ItemMain .slick-slider .slick-dots li {
	width: 22px;
	height: 4px;
	margin: 0 2px 0 0;
	}

	.SectionItems .SectionEachItem .ItemList .slick-slider .slick-dots li {
	width: 22px;
	height: 4px;
	margin: 0 2px 0 0;
	}
	
}

@media print, screen and (min-width: 768px) {

	.SectionItems .ItemMain .slick-slider .slick-dots li {
	width: 45px;
	height: 5px;
	margin: 0 4px 0 0;
	}

	.SectionItems .SectionEachItem .ItemList .slick-slider .slick-dots li {
	width: 45px;
	height: 3px;
	margin: 0 4px 0 0;
	}
				
}


.slick-dots li button {
font-size: 0;
line-height: 0;
display: block;
cursor: pointer;
color: transparent;
border: 0;
outline: none;
background: transparent;
}

@media only screen and (max-width: 767px) {

	.SectionItems .ItemMain .slick-dots li button {
	width: 22px;
	height: 4px;
	padding: 2px;
	}

	.SectionItems .SectionEachItem .ItemList .slick-dots li button {
	width: 22px;
	height: 4px;
	padding: 2px;
	}
	
}

@media print, screen and (min-width: 768px) {

	.SectionItems .ItemMain .slick-dots li button {
	width: 45px;
	height: 5px;
	padding: 4px;
	}

	.SectionItems .SectionEachItem .ItemList .slick-dots li button {
	width: 35px;
	height: 3px;
	padding: 4px;
	}
				
}

.slick-dots li button:hover,
.slick-dots li button:focus {
outline: none;
}

.slick-dots li button:hover:before,
.slick-dots li button:focus:before {
opacity: 1;
}

.slick-dots li button:before {
position: absolute;
top: 0;
left: 0;
content: '';
text-align: center;
opacity: 1;
color: #fff;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
/* background: #fff; */
}

.SectionItems .ItemMain .slick-dots li button:before {
color: #e4e4e4;
background: #e4e4e4;
}

.SectionItems .SectionEachItem .ItemList .slick-dots li button:before {
color: #cdcccc;
background: #cdcccc;
}

@media only screen and (max-width: 767px) {

	.SectionItems .ItemMain .slick-dots li button:before {
	font-size: 1;
	line-height: 1;
	width: 22px;
	height: 4px;
	border-radius: 0;
	border: none;
	}

	.SectionItems .SectionEachItem .ItemList .slick-dots li button:before {
	font-size: 1;
	line-height: 1;
	width: 22px;
	height: 4px;
	border-radius: 0;
	border: none;
	}
	
}

@media print, screen and (min-width: 768px) {

	.SectionItems .ItemMain .slick-dots li button:before {
	font-size: 1;
	line-height: 1;
	width: 45px;
	height: 5px;
	border-radius: 0;
	border: none;
	}

	.SectionItems .SectionEachItem .ItemList .slick-dots li button:before {
	font-size: 1;
	line-height: 1;
	width: 45px;
	height: 5px;
	border-radius: 0;
	border: none;
	}			

}

.SectionItems .ItemMain .slick-dots li.slick-active button:before {
opacity: 1;
color: #000;
background: #000;
}

.SectionItems .SectionEachItem .ItemList .slick-dots li.slick-active button:before {
opacity: 1;
color: #000;
background: #000;
}

/* Arrow（矢印ボタン） */
.slick-prev {
left: 50px !important;
}

.slick-next {
right: 50px !important;
}

.slick-prev,
.slick-next {
 z-index: 100;
}

.slick-arrow:before {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100% !important;
content: "" !important;
}

.slick-prev,
.slick-next {
font-size: 0;
line-height: 0;
position: absolute;
bottom: 0;
display: block;
padding: 0;
cursor: pointer;
color: transparent;
border: none;
outline: none;
background: transparent;
z-index: 1;
}

.SectionItems .SectionEachItem .slick-arrow {
top: 50% !important;
}
	
@media only screen and (max-width: 767px) {

	.SectionItems .SectionEachItem .slick-arrow {
	margin-top: -4px;
	width: 8px !important;
	height: 15px !important;
	}

	.SectionItems .SectionEachItem .slick-prev {
	margin-left: -40px;
	}

	.SectionItems .SectionEachItem .slick-next {
	margin-right: -40px;
	}

	.SectionItems .SectionEachItem .slick-prev:before {
	background: url(../img/item/Icon_Prev.png) no-repeat !important;
	background-size: 8px auto !important;
	}
	
	.SectionItems .SectionEachItem .slick-next:before {
	background: url(../img/item/Icon_Next.png) no-repeat !important;
	background-size: 8px auto !important;
	}
	
}

@media print, screen and (min-width: 768px) {

	.SectionItems .SectionEachItem .slick-arrow {
	margin-top: -6px;
	width: 11px !important;
	height: 20px !important;
	}

	.SectionItems .SectionEachItem .slick-prev {
	margin-left: -40px;
	}

	.SectionItems .SectionEachItem .slick-next {
	margin-right: -40px;
	}

	.SectionItems .SectionEachItem .slick-prev:before {
	background: url(../img/item/Icon_Prev.png) no-repeat !important;
	background-size: 11px auto !important;
	}
	
	.SectionItems .SectionEachItem .slick-next:before {
	background: url(../img/item/Icon_Next.png) no-repeat !important;
	background-size: 11px auto !important;
	}
	
}


user agent stylesheet
button {
appearance: auto;
-webkit-writing-mode: horizontal-tb !important;
text-rendering: auto;
color: -internal-light-dark(black, white);
letter-spacing: normal;
word-spacing: normal;
text-transform: none;
text-indent: 0px;
text-shadow: none;
display: inline-block;
text-align: center;
align-items: flex-start;
cursor: default;
background-color: -internal-light-dark(rgb(239, 239, 239), rgb(59, 59, 59));
box-sizing: border-box;
margin: 0em;
/*
font: 400 13.3333px Arial;
padding: 1px 6px;
border-width: 2px;
*/
border-style: outset;
border-color: -internal-light-dark(rgb(118, 118, 118), rgb(133, 133, 133));
border-image: initial;
}