@charset "utf-8";
#contents {
	width: 100%;
	color: #fff;
	background-color: transparent;
}

/* --------------------------------------------------
*
    #header
*
-------------------------------------------------- */
body {
	background-color: #470004;
	color: #fff;
}

#intro .main_image img {
	width: 150.68%;
	margin-left: -25.34%;
}

/****** Header Setting ********/
#header {
	z-index: 20001;
}

header {
	border-bottom: 1px solid #ccc;
}

header .container-fluid {
	height: 60px;
	padding: 0;
	display: block;
}

header .container-fluid .sns,
header .container-fluid #member {
	display: none;
}

header .header_logo_area {
	width: 100%;
	padding-top: 20px;
	text-align: center;
	line-height: 0;
	left: 0;
	position: relative;
}

header .header_logo img {
	width: 164px;
	height: auto;
}

header #btn_menu {
	display: block;
}

#cart_area {
	position: absolute;
	top: 0;
	right: 0;
}

#cart_area .btn {
	display: block;
	width: 47px;
	height: 60px;
}

#cart_area .badge {
	top: 6px;
}

#cart_area .btn img {
	position: absolute;
	bottom: 14px;
	left: 12px;
}

.btn_group {
	display: block;
	margin: 0 0 30px;
}

.btn_group > p {
	width: auto;
	margin: 0 0 30px;
}

.btn_area a,
.btn_group a {
	width: auto;
	margin: 0 12px 30px;
	height: 60px;
	line-height: 60px;
}


header .nav-trigger{
	width: 80px;
	height: 60px;
	position: absolute;
	text-align: right;
	display: block;
	top: 0;
	left: 0;
	cursor: pointer;
	z-index: 201;
}

header .nav-trigger span{
	border-radius: 3px;
}

header .nav-trigger span.top{
	width: 22px;
	border-top: 2px solid #333;
	position: absolute;
	top: 22px;
	left: 14px;
}

header .nav-trigger span.middle{
	content: '';
	display: block;
	width: 22px;
	border-top: 2px solid #333;
	position: absolute;
	top: 29px;
	left: 14px;
}

header .nav-trigger span.bottom{
	content: '';
	display: block;
	width: 22px;
	border-top: 2px solid #333;
	position: absolute;
	top: 36px;
	left: 14px;
}

header .nav-trigger.on span{
	border-color: #333;
}

#drawer {
	display: inherit;
}

/* open */
.drawer-open {
	height: 100vh;
	overflow: hidden;
	box-sizing: border-box;
}

.drawer-open header .nav-trigger span.top{
	top: 29px;
	transform: rotate(135deg);
	-webkit-transform: rotate(135deg);
	transition: top .17s ease, -webkit-transform .13s ease-out .17s, transform .13s ease-out .17s;
}

.drawer-open header .nav-trigger span.bottom{
	top: 29px;
	transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	transition: top .17s ease, -webkit-transform .13s ease-out .17s, transform .13s ease-out .17s;
}

.drawer-open header .nav-trigger span.middle{
	opacity: 0;
	-ms-filter: "alpha(opacity=0)";
	transition: opacity 0s ease .17s;
}

/* close */
header .nav-trigger span.top{
	transform: rotate(0);
	-webkit-transform: rotate(0);
	transition: top .17s ease .13s, -webkit-transform .13s ease-in, transform .13s ease-in;
}

header .nav-trigger span.btm{
	transform: rotate(0);
	-webkit-transform: rotate(0);
	transition: top .17s ease .13s, -webkit-transform .13s ease-in, transform .13s ease-in;
}

header .nav-trigger span.mid{
	opacity: 1;
	-ms-filter: "alpha(opacity=100)";
	transition: opacity 0s ease .13s;
}

#drawer {
	width: 100%;
	height: 100%;
	min-height: 100%;
	margin: 0 auto;
	opacity: 0;
	visibility: hidden;
	box-sizing: border-box;
	color: #000;
	font-size: 12px;
	letter-spacing: .1em;
	position: fixed;
	top: 0;
	left: 0;
	transition: all 300ms ease;
	overflow-y: auto !important;
	-webkit-overflow-scrolling: touch !important;
	z-index: 20000;
}

.drawer-open #drawer {
	visibility: visible;
	opacity: 1;
}

#drawer .inner{
	height: auto !important;
	padding: 60px 0 0 0;
	background-color: #fff;
	box-sizing: border-box;
	position: relative;
	z-index: 200;
	display: flex !important;
	-ms-flex-direction: column;
	flex-direction: column;
}

#drawer .user {
	display: none;
}

#drawer .member_link {
	order: 3;
}

#drawer .category-nav {
	background-color: #fff;
	position: relative;
	order: 1;
}

#drawer .category-nav li{
	width: 100%;
	position: relative;
	font-size: 14px;
}

#drawer .category-nav li .parents_title{
	margin: 0 30px;
	padding: 25px 0;
	border-bottom: 1px solid #ccc;
	position: relative;
}

#drawer .category-nav  li a {
	padding: 25px 50px 25px 25px;
	display: block;
	position: relative;
	border-bottom: 1px solid #ccc;
}

#drawer .category-nav li a:hover {
	text-decoration: none;
}

#drawer .category-nav li a::after{
	content: '';
	width: 10px;
	height: 100%;
	display: block;
	background-image:url(../img/common/parts_gnav_list_arrow_btm.png);
	background-repeat: no-repeat;
	background-size: 10px;
	background-position: center;
	position: absolute;
	top: 0;
	right: 32px;
	transition: all .1s ease;
	-webkit-transition: all .1s ease;
}

#drawer .category-nav li > a:last-child::after {
	background-image: none;
}

#drawer .category-nav li.on > a::after{
	transform: rotate(-180deg);
	-webkit-transform: rotate(-180deg);
}

#drawer .category-nav li li a {
	padding: 25px 50px 25px 40px;
	border-bottom: 1px solid #ccc;
}

#drawer .category-nav li ul{ overflow: hidden; display: none;}

#drawer .product_search {
	order: 2;
	padding: 35px 30px 25px;
}

#drawer .member_link {
	padding: 25px 30px;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
}

#drawer .member_link li {
	margin: 0 0 15px;
}

#drawer .member_link li:last-child {
	margin-bottom: 0;
}

#drawer .member_link li a {
	width: 100% !important;
	height: 50px;
	display: block;
	text-align: center;
	line-height: 50px;
	border-radius: 5px;
	color: #fff;
	font-size: 14px;
	font-weight: bold;
	letter-spacing: .1em;
	background-color: #9a947e;
}

#drawer .member_link .login a,
#drawer .member_link .mypage a{
	background-color: #3b8de1;
}

#drawer .member_link .signin a,
#draewr .member_link .logout a {
	background-color: #b1bc39;
}

#drawer .footer_link {
	border-bottom: 1px solid #ccc;
	order: 5;
}

#drawer .footer_link li {
	margin: 0;
	border-bottom: 1px solid #ccc;
	position: relative;
	font-size: 1.4rem;
}

#drawer .footer_link li:last-child {
	border-bottom: none;
}

#drawer .footer_link li a {
	width: 100%;
	height: 60px;
	font-size: 1.4rem;
	line-height: 60px;
	text-align: center;
	display: block;
}

#drawer .copyright {
	display: none;
}

#drawer .extend_list {
	border-bottom: 1px solid #ccc;
	order: 4;
}

#drawer .extend_list li {
	margin: 0;
	border-bottom: 1px solid #ccc;
	position: relative;
	font-size: 1.4rem;
}

#drawer .extend_list li.pc {
	display: none;
}

#drawer .extend_list li:last-child {
	border-bottom: none;
}

#drawer .extend_list li a {
	width: 100%;
	height: 60px;
	font-size: 1.4rem;
	line-height: 60px;
	text-align: center;
	display: block;
}

.overlay {
	width: 100vw;
	height: 100vh;
	position: fixed;
	top: 0;
	left: 0;
	background: #fff;
	opacity: 0;
	visibility: hidden;
	z-index: 170;
}

.overlay.is-visible {
	opacity: 1;
	visibility: visible;
	transition: all 300ms ease;
}

/****** Side Setting ********/
#side_left {
	display: none;
}


@media print, screen and (min-width : 769px){
/*------------------------------------------------------------------------------------------
*
*
    min-width : 769px
*
*
------------------------------------------------------------------------------------------ */
br.sp{ display: none !important;}
a:hover{ opacity: 0.7;}

/* EC-CUBE3 組み込み対応 */
#contents > .container-fluid {
	display: block;
	max-width: 1180px;
	margin-top: 60px;
}

#main {
	width: auto;
	max-width: none;
}
	
#drawer .member_link {
	letter-spacing: -0.4em;
}

#drawer .member_link li {
	width: 48%;
	margin: 0 4% 0 0;
	display: inline-block;
	letter-spacing: normal;
}

#drawer .member_link li:last-child {
	margin-right: 0;
}

/* ここまで */
	
#container {
  width: 1180px;
  margin: 0 auto 0;
  padding-top: 0;
}

/* --------------------------------------
    #intro
---------------------------------------- */
#intro {
	text-align: center;
}

#intro h2{
	margin: 120px auto 63px;
}
#intro p{
	font-size: 16px;
	line-height: 40px;
	letter-spacing: 0.2em;
	margin-bottom: 148px;
}

/* --------------------------------------
    article
---------------------------------------- */

.section {
	clear: both;
	margin-bottom: 135px;
	overflow: hidden;
}
.section div{
	width: 600px;
	height: 899px;
	float: left;
}

.photo{
	position: relative;
	background-color: #fff;
}
.photo p{
	position: absolute;
	top: 0;
	left: 0;
	background-color: #fff;
}
.section.right .photo{
	float: right;
}

.section .detail{
	width: 575px;
	display: flex;
	flex-direction: column;
	justify-content:flex-end;
	position: relative;
}


.detail h3 {
	text-align: center;
	margin-bottom: 100px;
	position: absolute;
	top: 280px;
	left: 0;
	width:100%;
}
.detail h3 span{
	font-size: 16px;
	display: block;
	margin-bottom: 28px;
}
.detail .txt{
	font-size: 14px;
	line-height: 26px;
	margin: 0 0 0 50px;
}
.detail .txt:first-letter{
	margin-left: -10px;
}
.detail .buy_online{
	margin:0 0 -12px 45px;
}
.detail ul{
  display: flex;
  flex-flow: row wrap;
	margin-left: 50px;
}
.detail ul li{
	margin:21px 24px 0 0;
	position: relative;
}

.detail ul li.soon:after{
	content: '';
	width:104px;
	height: 104px;
	display: block;
	position: absolute;
	top:0;
	left: 0;
	background: url(../img/link_btn_soon.png) no-repeat;
	background-size:cover;
	}

/* --------------------------------------
    #credit
---------------------------------------- */
#credit{
	text-align: center;
	background-color: #fff;
}
#credit ul li{
	margin-top: 42px;
}
#credit p{
	margin: 94px 0 0;
	padding: 70px 0 120px;
}

}