@charset "UTF-8";

/* top
---------------------------------------------------------------------------*/
header {
	margin-bottom: 0;
}

#mainContents {
	max-width: 100%;
}

.contents {
	width: 100%;
	max-width: 1400px;
	margin: 0 auto;
}

.container {
	width: 1120px !important;
}

body.index .page-title-item {
	padding:0;
	margin-top:20px;
	background:none!important;
}

body.index .recommendseries-container .page-title-item {
	padding-left: 10px;
}

body.index .page-title-item em {
	font-size: 23px !important;
	font-weight: 300;
	letter-spacing: 0.1em;
}


/* #img-scroll
---------------------------------------------------------------------------*/
#img-scroll {
	width: 100%;
}

#img-scroll ul li img {
	margin:0 5px 0 0;
}

#img-scroll .simply-scroll-container {
	position:relative;
}

#img-scroll .simply-scroll-clip {
	position:relative;
	overflow:hidden;
}

#img-scroll .simply-scroll-list {
	overflow:hidden;
	margin:0;
	padding:0;
}

#img-scroll .simply-scroll-list li {
	float:left;
	padding:0;
	margin:0;
}

#img-scroll .simply-scroll-list li img {
	display:block;
}

#js-slide1 {
	top:-420px;
	position: relative;
	opacity: 0;
}

#js-slide2 {
	bottom:-420px;
	position: relative;
	opacity: 0;
}

.js-slide li a:hover img {
	transition:all .3s ease-in-out;
	opacity:.6!important;
}

.title-scroll {
	margin:35px auto;
	position:relative;
	z-index:5000;
	text-align:center;
}

.title-scroll img {
/*
	height:22px;
	width:auto;
*/
	margin:0 3px;
	opacity:0;
	position:relative;
	top:-20px;
}

/* simply-scroll
------------------------------------*/
#img-scroll .simply-scroll-container {
	position:relative;
}

#img-scroll .simply-scroll-clip {
	position:relative;
	overflow:hidden;
}

#img-scroll .simply-scroll-list {
	overflow:hidden;
	margin:0;
	padding:0;
	list-style:none;
}

#img-scroll .simply-scroll-list li {
	padding:0;
	margin:0 10px;
	list-style:none;
}

#img-scroll .simply-scroll-list li img {
	border:none;
	display:block;
}

#img-scroll .simply-scroll-btn {
	position:absolute;
	background-image:url(buttons.png);
	width:42px;
	height:44px;
	z-index:3;
	cursor:pointer;
}

#img-scroll .simply-scroll-btn-left {
	left:6px;
	bottom:6px;
	background-position:0 -44px;
}

#img-scroll .simply-scroll-btn-left.disabled {
	background-position:0 0!important;
}

#img-scroll .simply-scroll-btn-left:hover,.simply-scroll-btn-left:focus {
	background-position:0 -88px;
}

#img-scroll .simply-scroll-btn-right {
	right:6px;
	bottom:6px;
	background-position:-84px -44px;
}

#img-scroll .simply-scroll-btn-right.disabled {
	background-position:-84px 0!important;
}

#img-scroll .simply-scroll-btn-right:hover,.simply-scroll-btn-right:focus {
	background-position:-84px -88px;
}

#img-scroll .simply-scroll-btn-up {
	right:6px;
	top:6px;
	background-position:-126px -44px;
}

#img-scroll .simply-scroll-btn-up.disabled {
	background-position:-126px 0!important;
}

#img-scroll .simply-scroll-btn-up:hover,.simply-scroll-btn-up:focus {
	background-position:-126px -88px;
}

#img-scroll .simply-scroll-btn-down {
	right:6px;
	bottom:6px;
	background-position:-42px -44px;
}

#img-scroll .simply-scroll-btn-down.disabled {
	background-position:-42px 0!important;
}

#img-scroll .simply-scroll-btn-down:hover,.simply-scroll-btn-down:focus {
	background-position:-42px -88px;
}

#img-scroll .simply-scroll-btn-pause {
	right:6px;
	bottom:6px;
	background-position:-168px -44px;
}

#img-scroll .simply-scroll-btn-pause:hover,.simply-scroll-btn-pause:focus {
	background-position:-168px -88px;
}

#img-scroll .simply-scroll-btn-pause.active {
	background-position:-84px -44px;
}

#img-scroll .simply-scroll-btn-pause.active:hover,.simply-scroll-btn-pause.active:focus {
	background-position:-84px -88px;
}

#img-scroll .simply-scroll {
	width:100%;
	height:410px;
}

#img-scroll .simply-scroll .simply-scroll-clip {
	width:100%;
	height:410px;
}

#img-scroll .simply-scroll .simply-scroll-list li {
	float:left;
	width:610px;
	height:410px;
}

#img-scroll .vert {
	width:340px;
	height:400px;
	margin-bottom:1.5em;
}

#img-scroll .vert .simply-scroll-clip {
	width:290px;
	height:400px;
}

#img-scroll .vert .simply-scroll-list li {
	width:290px;
	height:200px;
}

#img-scroll .vert .simply-scroll-btn-up {
	right:0;
	top:0;
}

#img-scroll .vert .simply-scroll-btn-down {
	right:0;
	top:52px;
}


/* .news-top
---------------------------------------------------------------------------*/
.news-top {
	border-bottom: 1px solid #EAEAEA;
	width: 100%;
	margin: 85px 0 120px;
	padding-bottom: 45px;
}

.news-top-inner {
	position: relative;
	box-sizing: border-box;
	width: 1120px;
	margin: 0 auto;
	padding: 0 480px 0 180px;
}

.news-top-inner .copy {
	position: absolute;
	top: -30px;
	right: 100px;
}

.news-top-inner h2 {
	position: absolute;
	top: -5px;
	left: 0;
	margin: 0 !important;
}

body.index .news-top-inner .page-title-item em {
	font-size: 21px !important;
}

.news-top-inner article {
	margin-bottom: 15px;
}

.news-top-inner article:last-of-type {
	margin-bottom: 0;
}

.news-top-inner article a {
	display: -webkit-box;
	display: flex;
	padding: 0 0 13px;
	color: #000;
}

.news-top-inner article time {
	width: 110px;
	min-width: 110px;
	padding-top: 1px;
	font-size: 13px;
	font-weight: 300;
	letter-spacing: 0.15em;
}

.news-top-inner article h3 {
	padding-top: 1px;
	font-size: 14px;
	letter-spacing: 0.12em;
	max-width: calc(100% - 110px);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}


/* recommend-container
---------------------------------------------------------------------------*/
.recommend-item-container .page-title-item {
	float:left;
	margin-bottom:0!important;
}

.recommend-item-container .btn {
	float:right;
	font-size:14px;
	letter-spacing:2px;
	margin: 4px 0 0 20px;
}

.recommend-item-container .btn a {
	display: inline-block;
	border: 1px solid #dedede;
	padding: 18px 30px;
	font-size: 13px
}

.recommend-item-container .btn:hover a {
	background:#444;
	color:#fff;
	transition:all .3s ease-in-out;
}

.recommend-item-container .grid-container {
	padding-top:5px;
}

.recommend-item-container .label {
/* 	display:none; */
}

.search-nav-wrap {
	margin-top: 45px;
	margin-bottom: 90px;
}

.search-nav-wrap .container {
	padding-top: 0;
}

.search-nav-wrap .mnav-wrap {
	margin-top: -85px;
}


/* recommend
---------------------------------------------------------------------------*/
.recommendseries-container {
	width:100%;
	clear:both;
}

.product-header {
	margin-top: 0;
	margin-bottom:30px;
}

.recommendseries-container .item-container article:nth-child(2) h2 {
	padding-top:6px;
	font-size:18px;
	letter-spacing:3px;
/* 	font-weight:700; */
}

.recommendseries-container .item-container article h3 {
	line-height: 1.7;
}


/* .calendar
---------------------------------------------------------------------------*/
.calendar {
	margin: 120px auto 160px;
}


/* .top-special
---------------------------------------------------------------------------*/
.top-special {
	position: relative;
	width: 100%;
	margin: 0 0 110px;
}

/* .special2106
------------------------------------*/
.special2106 .bg img {
	width: 100%;
	height: auto;
	-webkit-backface-visibility: hidden;
}

.special2106 .cat,
.special2106 .tablet,
.special2106 .people,
.special2106 .mug,
.special2106 .inner-s {
	opacity: 0;
}

.special2106 .cat img,
.special2106 .tablet img,
.special2106 .people img,
.special2106 .mug img {
	width: 100%;
	height: auto;
	-webkit-backface-visibility: hidden;
}

.special2106 .cat {
	position: absolute;
	top: 2.8%;
	left: 3.3%;
	width: 26%;
	z-index: 1;
}

.special2106 .tablet {
	position: absolute;
	top: 1.4%;
	right: 6.6%;
	width: 29%;
	z-index: 2;
}

.special2106 .people {
	position: absolute;
	top: 15.6%;
	left: 4.8%;
	width: 92.1%;
	z-index: 3;
}

.special2106 .mug {
	position: absolute;
	bottom: -1.7%;
	left: 2.5%;
	width: 28.5%;
	z-index: 4;
	transform-origin: right bottom;
}

.special2106 .inner {
	position: relative;
	margin: -70px 0 0 33.3%;
	white-space: nowrap;
	z-index: 5;
}

.special2106 .inner h2 {
	margin-bottom: 20px;
}

.special2106 .inner h2 em {
	display: block;
	margin-bottom: 10px;
}

.special2106 .inner h2 strong {
	display: block;
	margin-left: -4px;
}

.special2106 .inner .txt {
	position: absolute;
	top: -19px;
	right: calc((100% - 700px) / 2 - 92px);
}

.special2106 .inner .txt > span {
	display: block;
	float: right;
	margin-left: 14px;
	opacity: 0;
}

.special2106 .inner .txt2 {
	position: relative;
	margin-left: 15px;
	transform-origin: center center;
}

.special2106 .inner .txt2 .mask {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	background-color: #EA582F;
	width: 100%;
	height: 0;
	z-index: 2;
}

.special2106 .inner .txt2 .on {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	opacity: 0;
}

.special2106 .inner p {
	font-size: 16px;
	font-weight: bold;
	line-height: 2;
	letter-spacing: 0.12em;
}

/* media query
-----------------------------------*/
@media (max-width: 1420px) {
	.special2106 .inner {
		margin-top: -82px;
	}
	.special2106 .inner-wrap {
		transform-origin: left bottom;
		transform: scale(0.9);
	}
	.special2106 .inner .txt {
		right: calc((100% - 640px) / 2 - 82px);
		transform-origin: right bottom;
		transform: scale(0.9);
	}
}