@charset "utf-8";
/* CSS Document */

body{
	border: 15px solid #fff;
}

/** header style start**/
header{
	padding:20px;
	width: 200px;
	height: 100%;
	background: #fff;
	position: fixed;
	z-index: 888;
	left: 0px;
	top: 0px;}


header h1{
	text-align: center;
	padding-top: 20px;
	margin-bottom: 40px;
}

header h1 img{
	width: 90px;}

header ul{
	padding-top: 5px;}

header ul li{
	margin-bottom: 20px;
}

header ul li a{
	font-size: 11px;
	font-size: 1.0rem;
	padding-bottom: 5px;
	font-weight: 200;
	letter-spacing: 0.1em;
	font-family: 'Cabin', sans-serif;
	color: #000;}



.member_block .signin_btn{
	background: #333;
	color: #fff;
	padding: 5px 8px;}

.member_block .cart_btn{
	background: #333;
	color: #fff;
	padding: 5px 8px;
}



.under_navi li span{
	display: block;
	color: #989e9d;
	font-size: 10px;
	font-size: 1.0rem;
}

.under_navi li a{
	color: #000;
	display: block;
	width: 100%;
	max-width: 200px;
	font-family: 'Cabin', sans-serif;
	font-weight: normal;
	font-weight: 200;
	letter-spacing: 0.1em;
	display: inline-block;
	 position: relative;
  display: inline-block;
  transition: .3s;}

.under_navi li a:hover{
	opacity: 1;
	color: #054e3c;
}


.under_navi li a::after {
  position: absolute;
  bottom: 0;
  left: 0;
  content: '';
  width: 0;
  height: 1px;
  background-color: #054e3c;
  transition: .3s;
}
.under_navi li a:hover::after {
  width: 100%;
}

.sidenav{
	position: relative;
	z-index: 888;
	width: 100%;
	height: 100%;
}


.under_bnr{
	position: absolute;
	width: 100%;
	bottom: 0;
    font-family: 'Cabin', sans-serif;
    letter-spacing: 0.1em;
    font-size: 10px;
    font-size: 1.0rem;
    color: #fff;
}

.under_bnr a{
	display: block;
	width: 180px;
	max-width: 100%;
	border: 1px solid #ccc;
	padding: 10px;
	margin: auto;
}


.under_bnr a+a{
	margin-top: 10px;
}


.under_bnr a img{
	max-width: 100%;}


.copyright{
	position: fixed;
	width: 20px;
	height: 100%;
	background: #fff;
	right: 0;
	top: 0;
	z-index: 999;
	text-align: center;
}


.copyright p{
	display: block;
	position: relative;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
}

.copyright img{
	position: absolute;
	top: 40%;
	left: 5px;
	width: 7px;
	display: block;
	margin: auto;
}


/** header style end**/

/** mv style start**/


main{
	width: 100%;
	height: 100%;
}


.slick-track{
	height: 100%;
}

.slick-list{
	height: 100% ;}


.slider_contents{
	background-repeat: none;
	background-size: cover;
	background-position: center center;
}

.slider_contents img{
	max-width: 100%;}

.testtest{
	width: 100%;
	height: 100%;
	background: red;
}

.logo{
	width: 120px;
	position: fixed;
	z-index: 999;
	text-align: center;
	top: 39%;
	left: 60px;
	margin: auto;
	display: none;}


.logo img{
	width: 100%;}


.logo02{
	width: 100%;
	position: absolute;
	text-align: center;
	top: 0;
	left: 0;
	margin-left: -100px;
	margin: auto;
	display: none;}


.logo02 img{
	width: 100%;
	max-width: 200px;}





.top_contents02	{position: fixed;
	width: 1000px;
	text-align: center;
	top: 18%;
	left: 50%;
	padding-top: 300px;
	margin-left: -500px;
	color: #fff;
	z-index: 999;
	font-family: 'Cabin', sans-serif;}


.main_vis{
	position: fixed;
	width: 100%;
	text-align: left;
	top: 38%;
	right: 0;
	margin-left: -500px;
	color: #fff;
	z-index: 999;
	font-family: 'Cabin', sans-serif;
	display: none;}


.main_visbox{
	float: right;
}





.top_contents h1{
	font-size: 26px;
	font-size: 2.6rem;
	font-family: 'Playfair Display', serif;
	font-weight: normal;
	font-weight: 200;
	margin-bottom: 20px;
	letter-spacing: 0.1em;}


.top_contents02 h1{
	font-size: 24px;
	font-size: 2.4rem;
	font-family: 'Playfair Display', serif;
	font-weight: normal;
	font-weight: 200;
	margin-bottom: 30px;
	letter-spacing: 0.2em;
	padding-left: 10px;}


.parts_box{
	display: none;}





.menu_navi li{
	display: inline-block;
	vertical-align: top;
	margin-right: 30px;
}

.menu_navi li a{
	color: #fff;
	font-family: 'Cabin', sans-serif;
	font-weight: normal;
	font-weight: 200;
	padding: 10px 10px 10px 0px;
	letter-spacing: 0.1em;
	display: inline-block;
	 position: relative;
  display: inline-block;
  transition: .3s;}

.menu_navi li a:hover{
	opacity: 1;
}


 .menu_navi li a::after {
  position: absolute;
  bottom: 0;
  left: 0;
  content: '';
  width: 0;
  height: 1px;
  background-color: #fff;
  transition: .3s;
}
 .menu_navi li a:hover::after {
  width: 100%;
}



.jp{
	display: block;
	padding-top: 5px;
	font-size: 11px;
	font-size: 1.1rem;}


.mv{
	width: 100%;
	height: 100%;}

#slider {
    width: 100%;
    margin: 0 auto;
}
#slider img {
    width: 100%;
}

.slick-slide{
	display: block;
	width: 100%;
	height: 100%;
}

.slick-box{
	width: 100%;
	height: 100%;
}

.mv .slick-box .slider_contents img{
	max-width: 100%;}

.mv .slick-box .slider_contents{
	width: 100%;
	height: 100%;
	background-repeat:no-repeat;
	background-position: center center;
	background-size:cover;}


.top_bnr{
	position: absolute;
	font-family: 'Cabin', sans-serif;
	letter-spacing: 0.1em;
	font-size: 10px;
	font-size: 1.0rem;
	color: #fff;
	bottom: 45px;
	left: 30px;
	z-index: 888;
	display: none;}

.top_bnr a{
	display: block;
	background: #fff;
	margin-bottom: 15px;
	width: 260px;}

.top_bnr a img{
	max-width: 100%;}



.topbnr_02 a{
	display: block;
	background: #fff;
	margin: 15px auto;
	width: 340px;}

.topbnr_02 a img{
	max-width: 100%;}


.contents_mainarea{
	width: 100%;
	height: 80%;
	line-height: 1.8em;
	height: auto;
	text-align: left;}


.basic_title{
    font-family: 'Cabin', sans-serif;
    position: relative;
    letter-spacing: 0.1em;
    font-weight: normal;
    font-weight: 300;
    padding: 20px 30px 50px 30px;
    font-size: 2.6rem;
    font-size: 26px;}


.basic_title:before{
	content: '';
	display: block;
	width: 1px;
	height: 120px;
	background: #fff;
	position: absolute;
	top: 0;
	left: 0;}

.basic_title:after{
	content: '';
    display: block;
    width: 4px;
    height: 30px;
    background: #fff;
    position: absolute;
    top: 50px;
    left: -2px;}




.basic_title span{
	display: inline-block;
	margin-top: 40px;
	font-size: 1.2rem;
	font-size: 12px;
	padding-left: 20px;


}


.basictitle02{
	font-family: 'Cabin', sans-serif;
	color: #fff;
    font-weight: normal;
    font-weight: 300;
    margin-bottom: 40px;
	font-size: 22px;	
	font-size: 2.2rem;
	letter-spacing: 0.2em;
	position: relative;}

.basictitle02 span{
	font-size: 11px;
	font-size: 1.1rem;
	padding-left: 15px;}


.basictitle02:after{
content: '';
    display: block;
    width: 100px;
    height: 1px;
    background: #a0a0a0;
    margin-top: 10px;}


.backto_top a{
	display: inline-block;
	color: #fff;
	font-size: 10px;
	font-size: 1.0rem;
	position: relative;
    transition: .3s;
}



.backto_top{
	padding: 30px 0px;
}


.arrow{
position: relative;
display: inline-block;
padding: 0 0 0 16px;
color: #000;
vertical-align: middle;
text-decoration: none;
font-size: 15px;
}
.arrow::before,
.arrow::after{
position: absolute;
top: 0;
bottom: 0;
left: 0;
margin: auto;
content: "";
vertical-align: middle;
}

.arrownum01::before{
left: 3px;
width: 4px;
height: 4px;
border-top: 1px solid #fff;
border-right: 1px solid #fff;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}



  /* Lightbox で表示させるDIV要素のCSS */
  #lightbox-panel {
  background: #000;
  padding: 14px 22px;
  width: 100%;
  height: 100%;
  position:fixed;
  top:100px;
  left:50%;
  overflow-x: scroll;
  display:none;
  z-index:9999;
  padding:30px;
  margin-left:-50%;}

  /* Lightbox表示時に背景を黒に */
  #BlackWindow{
  display:none;
  background:#000000;
  opacity:0.9;/*黒地の背景の調整はこの数値で調整*/
  filter:alpha(opacity=90);/*黒地の背景の調整はこの数値で調整*/
  position:absolute;
  top:0px;
  left:0px;
  min-width:100%;
  min-height:100%;
  z-index:1;}


#show-panel{
	width: 200px;
	border: 1px solid #fff;
	text-align: center;
	padding: 5px;
	margin: 30px auto;
}

#close-panel{
	display: block;
	position: fixed;
	z-index: 999;
	bottom: 0px;
	left: 0px;
	width: 200px;
	height: 40px;
	color: #fff;
	bottom: 20px;
	left: 50%;
	margin-left: -100px;
}