@charset "utf-8";
/*------基本CSS（PC用記述記載）------*/
/* CSS Document */
/* 共通CSS */
#al4 {
    font-size: 16px;
    color: #000000;
}
#al4 a{
    text-decoration: none;
	color: #000000;
}
#al4 img{
    width: 100%;
    height: auto;
}

#al4 h1{
display: block;
color: #000000;
line-height: normal;
}

/* FV */
#al4 .fvBnr .spBnr {
    display: none;
}
#al4 .fvBnr img {
    margin-bottom: 110px;
}
#al4 .fvBnr .fvText {
    font-size: 14.5px;
    text-align: center;
    line-height: 2.4;
	font-family: 'Noto Serif JP', serif;
	letter-spacing: 1.6px;
}

#al4 .fvBnr .fvText .spBr {
    display: none;
}
#al4 .itemList .corner{ 
	margin-top: 20%;
	font-family: 'Noto Serif JP', serif;
}

#al4 .itemList .corner:last-child{
margin-bottom: 10%;
}


/*　商品陳列 パターン6（画像コーディネート）*/	
#al4 .itemList .itemList6 {
    width: 90%;
	margin: 0 auto;
	display: grid;
    grid-template-columns: 53% 1fr;
	grid-template-rows: 100%;
	align-items: center;
}
#al4 .itemList .itemList6 .codeImg{ 
	grid-row: 1 / 2;
	grid-column: 1 / 2;
}

#al4 .itemList .itemList6 .codeSpec6 {
	text-align: center;
	padding: 4% 8%;
	grid-row: 1 / 2;
	grid-column: 2 / 3;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: baseline;
}
#al4 .itemList .itemList6 li {
	width: 80%;
	margin: 0 auto;
	position: relative;
}

#al4 .itemList .itemList6Wrap img:hover,#al4 .itemList4 img:hover{
	opacity: 0.75;
}
#al4 .itemList .itemList6 .itemSpec6 {
    margin-top: 10px;
}

#al4 .itemList .itemList6 .vari{
width: 55%;
margin: 3% auto 0;
}

/* 商品陳列　共通CSS */  
#al4 .itemList .brandname { 
	font-size: 10px;
    color: #8f929b; 
}

#al4 .itemList .itemname { 
	overflow: hidden;
	white-space: nowrap; 
	text-overflow: ellipsis; 
	font-size: 12px;
	margin: 3px auto 0;
	width: 80%;
}

#al4 .itemList .price{
	font-size: 12px;
}

#al4 .itemList .saleprice{
    margin-top: 3px;
    display: block;
    color: #fb0000;
}

#al4 .itemList .price_down{
color: #fb0000;
    padding: 3px 5px;
    display: block;
    font-size: 12px;
}

/*　商像陳列 パターン2（2列）*/	
#al4 .imgContainer2 {
    width: 70%;
	margin: 8% auto;
}

/*　商品陳列　パターン4（商品4つ） */
#al4 .coordinate .Text{
text-align: center;
font-size: 18px;
margin-bottom: 3%;
}

#al4 .itemList .itemList4 {
    display: flex;
    justify-content: center;
	width: 80%;
	margin: 0 auto;
	text-align: center;
}
#al4 .itemList .itemList4 li {
    width: 18%;
	margin-right: 3%;
}

#al4 .itemList .itemList4 li:last-of-type{
    margin-right: 0;
}

#al4 .itemList .itemList4 .itemImg4{
position: relative;
}

#al4 .itemList .itemList4 .itemSpec4{
margin-top: 10px;
}


/*　SOLDOUT対応　*/	

#al4 .itemList .boxlink_sold .itemSpec6, #al4 .itemList .boxlink_sold .itemSpec4{
display: none;
}

#al4 .itemList .boxlink_sold img{
opacity: 0.3;
}

#al4 .allWrap .boxlink_sold.mask::after, .allWrap .boxlink_sold .mask::after{
font-size: 20px;
}

#al4 .boxlink_sold .vari::after{
display: none;
}

/*アニメーション要素のスタイル*/
#al4 .animation{
	opacity : 0;
	visibility: hidden;
	transition: 1s;
	transform: translateY(100px);
}
/*アニメーション要素までスクロールした時のスタイル*/
#al4 .active{
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}


/*------横幅が520px以下CSS（SP用記述記載）------*/
@media screen and (max-width: 520px) {

/* 共通CSS */
#al4{
    width: 100%;
    margin: 0 auto;
    max-width: 750px;
	color: #000;
}
#al4 img{
	width: 100%;
	height: auto;
}
#al4 a{
    text-decoration: none;
	color: #000;
}


/* FV */

#al4 .fvBnr .fvText {
    padding: 10% 12% 0;
    font-size: 12px;
    line-height: 2.2;
	font-family: 'Noto Serif JP', serif;
	letter-spacing: 1.6px;
	text-align: center;
}

/*　商品陳列 パターン6（画像コーディネート）*/
#al4 .itemList .corner{
    margin-top: 30%;
    font-family: 'Noto Serif JP', serif;
}

#al4 .itemList .corner:last-child{
margin-bottom: 20%;
}

#al4 .itemList .itemList6{
display: unset;
}

#al4 .itemList .itemList6 .codeSpec6 {
    margin: 10% 0 15%;
    display: flex;
    justify-content: center;
    text-align: center;
}
#al4 .itemList .itemList6 li {
    width: 70%;
	position: relative;
}

#al4 .itemList .itemList6 .vari{
width: 55%;
margin: 3% auto 0;
}


/*　画像陳列 パターン2（2列）*/		
#al4 .imgContainer2 {
    width: 90%;
    margin: 0 auto 15%;
}

/*　商品陳列　パターン4（商品4つ） */
#al4 .coordinate .Text{
text-align: center;
font-size: 15px;
margin-bottom: 3%;
}

#al4 .coordinate .itemList4 {
    display: flex;
    justify-content: center;
    margin: 0 auto;
	text-align: center;
	width: 100%;
}
#al4 .coordinate .itemList4 li {
    width: 32%;
    margin-right: 3%;
}
#al4 .coordinate .itemList4 li:nth-of-type(even){
    margin-right: 0;
}

#al4 .coordinate .itemList4 .itemImg4{
    position: relative;
}


#al4 .coordinate .itemSpec4 {
    padding: 10px 7px 0px;
	margin-top: 0!important;
}

 /* 商品陳列　共通CSS */	
#al4 .itemList .brandname {
    font-size: 10px;
	color: #8f929b;
}
#al4 .itemList .itemname {
    font-size: 12px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    line-height: 15px;
	margin: 4px auto 0;
}

#al4 .itemList .itemSpec6 .itemname{
	width: 80%;
}

#al4 .itemList .price_info {
    margin-top:4px;
}
#al4 .itemList .salepricebox {
    margin-top: 3px;
    display: block;
	color: #fb0000;
}
#al4 .itemList .price_down {
    color: #fb0000;
    padding: 3px 5px;
    display: block;
    font-size: 12px;
}
#al4 .itemList .price {
    font-size: 14px;
}


/*　SOLDOUT対応　*/

#al4 .itemList .boxlink_sold .itemSpec6, #al4 .itemList .boxlink_sold .itemSpec4{
display: none;
}


#al4 .itemList .boxlink_sold img{
opacity: 0.3;
}

#al4 .itemList4 .boxlink_sold.mask::after, .itemList4 .boxlink_sold .mask::after{
font-size: 14px;
}


/*アニメーション要素のスタイル*/
#al4 .animation{
	opacity : 0;
	visibility: hidden;
	transition: 1s;
	transform: translateY(100px);
}
/*アニメーション要素までスクロールした時のスタイル*/
#al4 .active{
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}




}