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


/*--------------------------------------------------------------
 サックスバークリスマス
----------------------------------------------------------------*/
.hero {
	letter-spacing:0.3em;
}
.hero header {
	position:absolute;
	z-index:99999;
	width:100%;
}
.header-xmas-top {
	width:95%;
	margin:49px 2.5%;
	display:flex;
}
.header-xmas-top h1 {
	margin:0 auto 0 0;
}
.header-xmas-top h1 a {
	display:block;
	background:url(images/logo_sbm_header.png) no-repeat;
	background-size:contain;
	width:215px;
	height:95px;
	text-indent:-9999em;
}
.header-xmas-top p a {
	font-family: 'Oswald', sans-serif;
	font-weight:bold;
	color:#fff;
}
ul.sbm-header-sub-gnav {
	display:flex;
}
ul.sbm-header-sub-gnav li:first-child {
	padding:0 20px 0 0;
}
ul.sbm-header-sub-gnav li:last-child {
	padding:0 0 0 20px;
}
ul.sbm-header-sub-gnav li a {
	display:block;
	text-indent:-9999em;	
}
.top-sbm-brand-list {
	position:absolute;
	z-index:99999;
	bottom:10%;
	right:2.5%;
	text-align:right;
}
.top-xmas-brand-list li {
	line-height:2;
}
.top-xmas-brand-list li a {
	font-family: 'Oswald', sans-serif;
	font-weight:bold;
	color:#fff;
}
.sbm-information {
	padding:40px 0;
	background:#000;
}
/*.sbm-information .top-information-title {
	color:#fff;
}
.sbm-information ul.top-information li,
.sbm-information ul.top-information li a {
	color:#fff;
}*/
.sbm-information .information-contents h3,
.sbm-information .information-contents .top-informations ul li,
.sbm-information .information-contents .top-informations ul li a {
	color:#fff;
}
.sbm-information .information-contents h3.title span {
	border-top:solid 1px #fff;
}
.top-sbm-caption {
	position:absolute;
	z-index:99999;
	bottom:10%;
	left:2.5%;
	font-family: 'Oswald', sans-serif;
	font-size:40px;
	font-weight:bold;
	color:#fff;
}
.top-sbm-caption span {
	display:block;
}

@media screen and (max-width: 56.875em) {/*910px*/
.header-sbm-top h1 a {
	display:none;
} 
}

ul.xmas-collection-block01,
ul.xmas-collection-block02,
ul.xmas-collection-block03 {
	width:33.333333%;
	float:left;
}
ul.xmas-collection-block01 li.block01 {
	background:url(images/img_lookbook_top_block01.jpg) 0 20% no-repeat;
	background-size:cover;
	height:400px;
	position:relative;
	z-index:1;
}
ul.xmas-collection-block01 li.block02 {
	background:url(images/img_lookbook_top_block02.jpg) center center no-repeat;
	background-size:cover;
	height:400px;
	position:relative;
	z-index:1;
}
ul.xmas-collection-block01 li.block03 {
	background:#000;
	height:300px;
	position:relative;
	z-index:1;
}
ul.xmas-collection-block01 li.block03 .table,
ul.xmas-collection-block03 li.block03 .table {
	height:300px;
	display:table;
}

ul.xmas-collection-block02 li.block01 {
	background:url(images/img_lookbook_top_block03.jpg) 0 0 no-repeat;
	background-size:cover;
	height:800px;
	position:relative;
	z-index:1;
}
ul.xmas-collection-block02 li.block02 {
	background:url(images/img_lookbook_top_block07.jpg) center 30% no-repeat;
	background-size:cover;
	height:300px;
	position:relative;
	z-index:1;
}


ul.xmas-collection-block03 li.block01 {
	background:url(images/img_lookbook_top_block04.jpg) center 50% no-repeat;
	background-size:cover;
	height:400px;
	position:relative;
	z-index:1;
}
ul.xmas-collection-block03 li.block02 {
	background:url(images/img_lookbook_top_block05.jpg) center 0 no-repeat;
	background-size:cover;
	height:400px;
	position:relative;
	z-index:1;
}
ul.xmas-collection-block03 li.block03 {
	background:#000;
	height:300px;
	position:relative;
	z-index:1;
}
ul.xmas-collection-block01 h3,
ul.xmas-collection-block02 h3,
ul.xmas-collection-block03 h3 {
	position:absolute;
}
ul.xmas-collection-block01 li.block01 h3 {
	right:8%;
	top:8%;
}
ul.xmas-collection-block01 li.block02 h3 {
	left:8%;
	top:8%;
}
ul.xmas-collection-block01 li.block03 .table h3,
ul.xmas-collection-block03 li.block03 .table h3 {
	position:relative;
	display:table-cell;
	vertical-align:middle;
	text-align:center;
}
ul.xmas-collection-block02 li.block01 h3 {
	right:5%;
	top:5%;
}
ul.xmas-collection-block03 li.block01 h3 {
	right:5%;
	bottom:5%;
}
ul.xmas-collection-block03 li.block02 h3 {
	left:8%;
	bottom:8%;
}
ul.xmas-collection-block01 h3 img,
ul.xmas-collection-block02 h3 img,
ul.xmas-collection-block03 h3 img {
	max-width:171px;
	width:100%;
}
ul.xmas-collection-block03 h3 img {
	max-width:275px;
	width:100%;
}
ul.xmas-collection-block01 li.block03 .table h3 img {
	max-width:200px;
	margin-left:10%;
}
ul.xmas-collection-block03 li.block03 .table {
	position:absolute;
	right:5%;
}
ul.xmas-collection-block03 a h3 {
	font-family: 'Oswald', sans-serif;
	color:#fff;
	font-size:18px;
}
ul.xmas-collection-block01 .banner-block figcaption,
ul.xmas-collection-block02 .banner-block figcaption,
ul.xmas-collection-block03 .banner-block figcaption {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,.5);
	-webkit-transition: .3s;
	transition: .3s;
	opacity: 0;
}
a.banner-block {
	z-index:4;
	position:relative;
}
ul.xmas-collection-block01 .banner-block:hover figcaption,
ul.xmas-collection-block02 .banner-block:hover figcaption,
ul.xmas-collection-block03 .banner-block:hover figcaption {
	filter:alpha(opacity=100);
	-moz-opacity: 1;
	opacity: 1;
}
.xmas-movie-area dl {
	width:33.33333%;
	float:left;
	padding:0 1%;	
}
.xmas-movie-area dl dt {
	margin:0 0 20px;	
}
.xmas-movie-area dl dt img {
	width:100%;
}
.xmas-movie-area dl dd {
	word-break:break-all;
	width:95%;
	margin:0 auto;	
}
.xmas-movie-area dl dd span {
	display:block;	
}
.xmas-movie-area dl dd.movie-title {
	font-weight:bold;
	font-size:15px;
	margin:10px auto 0;
}
.xmas-movie-area dl dd.movie-comment {
	font-weight:normal;
	font-size:12px;
	color:#999;
	margin:10px auto 0;
}


.border1500 {
	border: 0; 
	height: 1px; 
	background-image: -webkit-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
	background-image: -moz-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
	background-image: -ms-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
	background-image: -o-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0); 
	clear:both;
	width:100%;
	max-width:1500px;
	margin:0 auto;
}
ul.xmas-footer-brand-logo-block {
	width:100%;
	max-width:1500px;
	margin:5% auto 0;
}
ul.xmas-footer-brand-logo-block li {
	width:14.2857143%;
	float:left;
	text-align:center;
}
ul.xmas-footer-brand-logo-block li a {
	display:block;
}
ul.xmas-footer-brand-logo-block li:nth-child(8) {
	clear:both;
	float:left;
}
ul.xmas-footer-brand-logo-block li img {
	width:100%;
	max-width:180px;
}
/*サックスバークリスマスブランド別ページ*/
.xmas-brand-top-bg {
	min-height:950px;
	background-size:cover;
}
.xmas-brand-explanation {
	width:95%;
	margin:0 auto;
}
.xmas-brand-explanation p {
	text-align:center;
	line-height:2;
}
.xmas-brand-explanation p span {
	display:block;
}
.xmas-item-lineup {
	width:100%;
	max-width:900px;
	margin:0 auto;
}
.xmas-item-lineup dl {
	width:33.3333333%;
	float:left;
	margin-bottom:10px;
}
.xmas-item-lineup dl dt img {
	line-height:0;
	width:100%;
}
.xmas-item-lineup dl:nth-child(4),
.xmas-item-lineup dl:nth-child(7),
.xmas-item-lineup dl:nth-child(10),
.xmas-item-lineup dl:nth-child(13) {
	clear:both;
	float:left;
}
.xmas-item-lineup dl dd {
	font-family: 'Oswald', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
	text-align:center;
	letter-spacing:0.2em;
}
.xmas-item-lineup dl dd p {
	margin-bottom:10px;
}

.sbm4-bnr-area {
	width:95%;
	max-width:1200px;
	margin:5% auto 0;
}
.sbm4-bnr-area.brand {
	width:95%;
	max-width:1200px;
	margin:5% auto;
}
@media screen and (max-width: 840px) {
.sbm4-bnr-area a {
	display:block;
	margin:10% auto 0;
	background:url(images/sbm4c/sbm4-campaign-840n.jpg) no-repeat;
	background-size:contain;
	height:0;
	padding-top:100%;
}
.sbm4-bnr-area img {
	display:none;
}
}
.bnr-hash {
	width:95%;
	max-width:980px;
	margin:5% auto 0;
}
.sbm4c-contents-area {
	background:#f5f5f5;
	margin:5% 0 0;
	padding:5% 0;
}
.sbm4c-contents-area .contents-lady {
	width:95%;
	max-width:1244px;
	margin:0 auto 5%;
	position:relative;
	min-height:754px;
	left:22px;
}
.sbm4c-contents-area .contents-lady .left-area {
	background:url(images/sbm4c/sbm4-img_riouchida.png) no-repeat;
	width:583px;
	height:754px;
	position:absolute;
	top:0;
	left:0;
	z-index:10;
}
.sbm4c-contents-area .contents-lady .right-area {
	background:url(images/sbm4c/sbm4-ladies_bg.gif);
	width:653px;
	margin-top:40px;
	padding:5% 30px 5% 70px;
	position:relative;
	left:-45px;
	float:right;
	z-index:0;
}
.sbm4c-contents-area .contents-lady .right-area h4 {
	background:url(images/sbm4c/sbm4-campaign-caption_ladies.png);
	width:531px;
	height:225px;
	text-indent:-9999em;
	margin-bottom:30px;
}
.sbm4c-contents-area .contents-lady .right-area ul li {
	float:left;
	width:31.33333333%;
	margin:0 1%;
}
.sbm4c-contents-area .contents-lady .right-area ul li img {
	width:100%;
}
.sbm4c-contents-area .contents-man {
	clear:both;
	width:95%;
	max-width:1244px;
	margin:0 auto;
	position:relative;
	min-height:814px;
}
.sbm4c-contents-area .contents-man .left-area {
	background:url(images/sbm4c/sbm4-mens_bg.gif);
	width:653px;
	padding:5% 80px 3% 30px;
	position:relative;
	right:-20px;
	float:left;
	z-index:0;
}
.sbm4c-contents-area .contents-man .right-area {
	background:url(images/sbm4c/sbm4-img_daisuke.png) no-repeat;
	width:583px;
	height:754px;
	position:absolute;
	top:60px;
	right:40px;
	z-index:10;
}
.sbm4c-contents-area .contents-man .right-area-sp {
	display:none;
}
.sbm4c-contents-area .contents-man .left-area h4 {
	background:url(images/sbm4c/sbm4-campaign-caption_mens.png);
	width:441px;
	height:329px;
	text-indent:-9999em;
	margin-bottom:30px;
}
.sbm4c-contents-area .contents-man .left-area ul li {
	margin-bottom:20px;
}
.sbm4c-contents-area .contents-man .left-area ul li img {
	width:100%;
}
.sbm4c-contents-area .contents-man .left-area ul li:first-child img {
	max-width:562px;
}
.sbm4c-contents-area .contents-man .left-area ul li:last-child {
	max-width:456px;
	margin:0 auto;
}
.sbm4c-contents-area .contents-man .left-area ul li:last-child img {
	max-width:456px;
}
.sbm4c-contents-area .contents-man:after {
	clear:both;
}


ul.sbm4c-brand-linup {
	width:95%;
	max-width:1276.9px;
	margin:0 auto;
}
ul.sbm4c-brand-linup li {
	float:left;
	width:31.3333333%;
	margin:0.7% 1%;
}
ul.sbm4c-brand-linup li:first-child,
ul.sbm4c-brand-linup li:nth-child(2),
ul.sbm4c-brand-linup li:nth-child(3) {
	margin:0 1% 0.7%;
}
ul.sbm4c-brand-linup li img {
	width:100%;
}
.br {
    display:inline;
}
.title .line {
    clear: both;
    display: block;
    height: 1px;
    width: 40px;
    border-top: solid 1px #000;
    margin: 20px auto 0;
    padding: 0;
}
.sbm4-movie-lineup-pc {
	margin-bottom:30px;
}
.sbm4-movie-lineup-pc dl dd span {
    display:inline;
}
.sbm4c-howto-entry {
	width:95%;
	max-width:1080px;
	margin:5% auto 0;
}
.sbm4c-howto-entry ul li {
	width:1080px;
	height:300px;
	text-indent:-9999em;
	margin-bottom:3%;
}
.sbm4c-howto-entry ul li:first-child {background:url(images/sbm4c/sbm4-howto-entry01.gif) no-repeat;}
.sbm4c-howto-entry ul li:nth-child(2) {background:url(images/sbm4c/sbm4-howto-entry02.gif) no-repeat;}
.sbm4c-howto-entry ul li:nth-child(3) {background:url(images/sbm4c/sbm4-howto-entry03.gif) no-repeat; height:354px;}
.sbm4c-howto-entry ul li:nth-child(4) {background:url(images/sbm4c/sbm4-howto-entry04.gif) no-repeat;}

.instagram-area {
	width:95%;
	max-width:1080px;
	margin:5% auto;
}
.sbm4-btn-area,
.sbm4-entry-btn-area {
	margin:5% 0;
}
.sbm4-btn-area a {
	background:url(images/brn_more.gif) no-repeat;
	width:95%;
	max-width:380px;
	height:104px;
	text-indent:-9999em;
	margin:0 auto;
	display:block;
	position:relative;
	z-index:30;
}
.sbm4-entry-btn-area a {
	background:url(images/sbm4c/oubo-btn.jpg) no-repeat;
	width:95%;
	max-width:380px;
	height:105px;
	text-indent:-9999em;
	margin:0 auto;
	display:block;
	position:relative;
	z-index:30;
} 
@media screen and (max-width: 789px) {
.sbm4-btn-area a {
	background:url(images/brn_more.gif) no-repeat;
	background-size:contain;
	width:60%;
	height:0;
	padding-top:27.3684211%;
}
.sbm4-entry-btn-area a {
	background:url(images/sbm4c/oubo-btn.jpg) no-repeat;
	background-size:contain;
	width:60%;
	height:0;
	padding-top:27.6315789%;
}
}
@media screen and (max-width: 639px) {
.br {
    display:block;
}
}



/*--------------------------------------------------------------
 アプリバナーエリア
----------------------------------------------------------------*/
.xmas-bnr-appli-araea {
	background:#f1f1f1;
}
.xmas-bnr-appli {
	background:#f1f1f1 url(images/sbm2-topbnr-app.jpg) no-repeat;
	width:100%;
	max-width:1500px;
	height:500px;
	margin:0 auto;
	position:relative;
}
.xmas-bnr-appli ul {
	position:absolute;
	bottom:30px;
	left:63px;
}
.xmas-bnr-appli ul li {
	display:inline-block;
}


/*--------------------------------------------------------------
 サックスバークリスマスデバイス対応
----------------------------------------------------------------*/
.sp-sbm-slide {
	display:none;
}
@media screen and (max-width:999px) {
.sbm-slide {
	display:none;
}
.sp-sbm-slide {
	display:block;
}
}
@media screen and (max-width: 779px) {
ul.xmas-collection-block01,
ul.xmas-collection-block02,
ul.xmas-collection-block03 {
	width:100%;
	float:none;
}
.xmas-movie-area dl {
	width:100%;
	float:none;
	padding:0 1% 30px;
}
}
/*スマホ時埋め込み動画のアスペクト比設定*/
@media screen and (max-width: 639px) {
/*.movie-pc dl dt {
	position: relative;
	height: 0;
	padding: 30px 0 56.25%;
	overflow: hidden;
}

.movie-pc dl dt iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;

	height: 100%;
}*/
.movie-pc dl dt video {
	width:100%;
	margin:0;
	padding:0;
}
}

@media screen and (max-width: 779px) {
ul.xmas-footer-brand-logo-block li {
	width:20%;
}
ul.xmas-footer-brand-logo-block li:nth-child(8) {
    clear:none;
}
}
@media screen and (max-width: 639px) {
ul.xmas-footer-brand-logo-block li {
	width:50%;
}
}
/*インフォメーションブロックのスライド出し分け*/
.xmas-information-sp {
	display:none;
}
@media screen and (max-width: 639px) {
.xmas-information-sp {
	display:block;
	padding:7% 0;
	background:#000;
}
.xmas-information {
	display:none;
}
.xmas-information-sp .information-contents h3,
.xmas-information-sp .information-contents .top-informations ul li,
.xmas-information-sp .information-contents .top-informations ul li a {
	color:#fff;
}
.xmas-information-sp .information-contents h3.title span {
	border-top:solid 1px #fff;
}
}
/*サックスバーマガジンブランド別ページ*/
@media screen and (max-width: 999px) {
.xmas-brand-explanation p span {
	display:inline;
}
}
@media screen and (max-width: 639px) {
.xmas-brand-explanation h3 {
	width:80%;
	margin:0 auto 10%;
}
}
@media screen and (max-width: 779px) {
.xmas-item-lineup dl {
	width:100%;
	float:none;
}
}
/*アプリバナーエリア*/
@media screen and (max-width: 639px) {
.xmas-bnr-appli {
	background:#e9e9e9 url(images/sbm2-topbnr-app-sp.jpg) no-repeat;
	background-size:contain;
	height:0;
	margin:0 auto;
	position:relative;
	padding-top:164.0625%;
}
.xmas-bnr-appli ul {
	width:95%;
	margin:-15% auto 10%;
	position:static;
	line-height:4;
}
.xmas-bnr-appli ul li:first-child {
	float:left;
	width:49%;
}
.xmas-bnr-appli ul li:last-child {
	float:right;
	width:49%;
}
.xmas-bnr-appli ul li img {
	width:100%;
}
}