@charset "utf-8";
/**
 * トップページのみの要素
 * img path: /common/images/
 */

#fullContent,
.section,
#items,
#item3row {
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
align-content: stretch;
width:950px;
}

#fullContent p {flex-basis:100%;}

/* リニュ
----------------------------------------------------------------------------------------------------*/

.categoryImage img {padding:0 9px 7px 9px;}

.categoryImage {
    margin: 0 0 14px 0;
    background-color: #f2ede1;
    width:468px;
}

#item3row .categoryImage {
    margin: 0 0 14px 0;
    background-color: #f2ede1;
    width:308px;
}

/* コンテンツのレイアウト調整
----------------------------------------------------------------------------------------------------*/

#wrapMainContent,
#wrapFooter {
	margin:0 auto;
}

#wGM ul {
    width: 990px;
}

#wUtil {
    float: left;
    width:530px;
}

h2 {
	border:none;
	margin:0;
	padding:0;
}

.priceArea {
 position:absolute;
 right:10px;
 bottom:35px;
 color:#505050;
 font-size:1rem;
}

.priceArea span {
 font-size:1.2rem;
 font-weight:bold;
 letter-spacing:0;
}

/* ボタン周り
----------------------------------------------------------------------------------------------------*/

.button {
 width:54px;
 margin-top:5px;
}

.button a {
 color:#808080;
}

/* 商品 共通
----------------------------------------------------------------------------------------------------*/

#items {
 min-height: 100px;
margin: 15px 0 0 0;
}

.item2row,.item3row, .item4row {
 border:1px solid #ccc;
}

.btnArea img {
    float: right;
    margin: 0 0 9px 5px;
}

h3 {
 font-size:1.6rem;
}

.itemImage {
 float:left;
 margin-right:7px;
}

.bnr {
	float: left;
	margin: 0 9px 9px 0;
	padding: 0;
	position: relative;
}


/* 商品 2階層(使用していない)
----------------------------------------------------------------------------------------------------*/

.item2row {
 width:467px;
 height:140px;
 float:left;
 padding:0;
 margin:0 9px 9px 0;
    position:relative;
}

.item2row .btnArea {
    width: 220px;
    position:absolute;
    right:7px;
    bottom:0;
}

.item2row p {
    float: right;
    margin:0 7px 0 0;
    line-height: 1.4;
    width: 213px;
}

.item2row h3 {
    float: right;
    margin-top:7px;
    width: 220px;
}

.item2row .btnArea img {
    width:100px;
    float:right;
    margin: 0 0 9px 5px;
}

/* 商品 3列
----------------------------------------------------------------------------------------------------*/

.item3row {
    width:30.5%;
    position:relative;
    display: inline-block;
    padding: 8px;
    margin:4px 0 4px 8px;
    display:flex;
    flex-wrap:wrap;
}

.item3row img {float:left;width: 105px;height: 105px;}

#fullContent .item3row  p {flex-basis: 60%!important;}

.item3row .priceArea {width:auto;}
.item3row .btnArea {width:100%;}

.item3row .priceArea {
    position: absolute;
    left: 160px;
    bottom: 55px;
    color: #505050;
    font-size: 1rem;
}


/* 商品 4階層
----------------------------------------------------------------------------------------------------*/

.item4row {
    width: 22.5%;
    position: relative;
    display: inline-block;
    margin: 0 5px 9px 0;
    padding: 7px;
    height: 122px;
}

.item4row .btnArea {
    position:absolute;
    right:7px;
    bottom:0;
}

.item4row .btnArea img {
    float:right;
    margin: 0 0 9px 5px;
}

.item4row .itemImage {
 width:70px;
 height:70px;
}

.item4row p {
    float: right;
    line-height: 1.4;
    width: 130px;
}

/* 商品 マスク
----------------------------------------------------------------------------------------------------*/
.itemMask {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #fff;
}



/* 商品 もっと見る
----------------------------------------------------------------------------------------------------*/


.btnArea1 { 
	width: 185px;
    position:absolute;
    right:7px;
    bottom:0;
}
.itemImage1 { float:left;
 margin-right:7px;
}

/*今すぐ写真プリントを注文する*/

.btnApp {
	position: relative;
	width:100%;
	height:70px;
	color:  #fff;
	background: #ccc;
	border-radius: 3px;
	margin-bottom: 5px;
	padding: 8px 10px;
	text-align:center;
	box-sizing: border-box;
	box-shadow: 0 2px 1px #D9D9D9;
	background-image: linear-gradient( rgba(255,255,255,.10) 49%, rgba(255,255,255,0) 50% );
	border-bottom: 1px solid #ddd;
	
}

.btnApp span {
	font-size:1rem;
}

.typeApp.typePC,
.typeApp.typeSP {
	margin-bottom: 0;
}



.btnApp.typeWeb {
	border: 1px solid #34be06;
	background-color: #34be06;
}

.btnApp.typeApp {
	padding: 4px 10px;
	border: 1px solid #326de4;
	background-color: #326de4;
}

.btnApp:link,
.btnApp:hover,
.btnApp:visited,
.btnApp:active {
	text-decoration: none;
	color: #fff;
	font-size: 1.6rem;
	font-weight: 800;
}

.btnApp.typeWeb:hover {
	background-color: #58D331;
}

.btnApp.typeApp:hover {
	background-color: #5284e7;
}

/* 重要なお知らせ
----------------------------------------------------------------------------------------------------*/

#important {
	clear:both;
	margin:15px 0;
	padding:5px;
	width:100%;
	border: 1px solid #FF2E2E;
	box-sizing:border-box;
}

/* Flashバナーエリア
----------------------------------------------------------------------------------------------------*/

#topBnrArea {
	width:712px;
	height:188px;
	float:left;
	margin:0 0 10px 0;
	position:relative;
}

.sliderbutton {
	float:left; 
	display:none;
}

#slideleft {background:url(/common/images/icon/icons.gif) -50px -265px no-repeat}
#slideleft:hover {background-position:-0 -265px}
#slideright {background:url(/common/images/icon/icons.gif) 0 90px no-repeat}
#slideright:hover {background-position:-50px 90px}

#slider {
	float:left; 
	position:absolute; 
	overflow:hidden; 
	width:530px; 
	height:188px;
}

#slider ul {
	position:absolute; 
	list-style:none; 
	top:0; 
	left:0;
}

#slider li {
	float:left; 
	width:530px; 
	height:188px;
}

.pagination {
	position:relative;  
	list-style:none; 
	height:188px
	width:180px;
	float:right;
}

.pagination li { 
	cursor:pointer; 
	height:50px; 
	width:165px; 
	margin:0 0 1px 0;
	padding:6px 4px 6px 11px;
	background:url(/common/images/bg/bg_bnr.gif) left center no-repeat;
}
.pagination li:hover, li.current {
	background:url(/common/images/bg/bg_bnr_current.gif) left center no-repeat;
}

.pagination li span { 
	width:107px;
	margin:10px 0 0 5px;
	float:right;
	line-height:1.2;
	letter-spacing: 0px;
}

.pagination li a { 
	color:#333;
}

#orderPrint {
	width:212px;
	height:172px;
	float:left;
	margin:0 0 10px 10px;
	padding:8px;
	background-color:#EDE9E6;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-ms-border-radius: 5px;
	-o-border-radius: 5px;
}


#flash_side {
	width:200px;
	height:170px;
	background-color:#efefef;
	float:left;
	padding:10px;
	margin:0 0 0 20px;
}

#flash_main {
	float:left;
}

/* 見出し
----------------------------------------------------------------------------------------------------*/

#information h2,#specialArea h2 {
	padding:0 0 3px 0;
	margin:0 0 10px 0;
	border-bottom:1px dotted #666;
	font-weight:bold;
	color:#666666;
	width:100%;
}

/* コンテンツレイアウト
----------------------------------------------------------------------------------------------------*/

#content {
	width:950px;
	margin:0 auto 5px;
}

/* 見出し共通要素 */

p.allList {
	float:right;
	margin:0;
	padding:0;
	_margin-top:2px;
	text-align:right;
	vertical-align:middle;
	z-index:10;
}


/* おすすめアイコンなど */

div.item img.alphafilter {
	position:absolute;
	left:5px;
	bottom:5px;
	z-index:10;
}

/* キャンペーン・お得情報 */

.campaignContainer {
	margin-bottom:10px;
	height:100px;
	border-bottom: 1px dotted #CCCCCC;
}

.campaignContainer img.bnr {
	border:1px solid #ccc;
	float:left;
}

.campaignContainer div.text {
		width:368px;
		float:left;
		margin-left:10px;
	}

.campaignIcon {
	float:right;
	margin:5px 5px 0 0;
}

/* おしらせ */

#information,#recommend {
	width:400px;
	float:left;
}

#information dd {
	margin-bottom:10px;
	margin-top:2px;
}

/* おすすめ特集 */

#specialArea {
    margin: 0 20px 0 0;
    width: 530px;
    float:left;
}

#specialArea .bnrArea {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

/* 商品
----------------------------------------------------------------------------------------------------*/

div.item {
	width:295px;
	height:135px;
	float:left;
	padding:7px 0;
	margin:0 0 10px 30px;
}

#print {
	clear:both;
	margin:15px 0;
}

#keep,#present,#goods {
	clear:both;
	margin:20px 0 0 0;
}

p.catch {
	margin:0 0 5px 9px;
	float:left;
	width:180px;
	line-height:1.4;
}

.newIcon {
	position:absolute;
	left:0;
	top:80px;
	z-index:10;
}


.pickupItem .textLink {
	position:absolute;
	right:5px;
	bottom:5px;
}

*> p {line-height:1.2;}

*> .priceArea {bottom:35px;}

h2,.categoryImage {clear:none;}

h2 {
    margin:10px 0 7px 10px;!important
    color:#3d3333;
}

.categoryImage p {
    padding: 0 10px 15px;
    font-size: .8em;
}

.categoryImage a {
    text-decoration-line: none;
}

/* アフィリエイトページ
----------------------------------------------------------------------------------------------------*/

body#affiliate #wrapMainContent {align-items:stretch;justify-content:space-between;}

body#affiliate .section {width: 930px;}

body#affiliate h4 {
  display:block;
  clear:both;
  font-size:1.4rem;
  font-weight:bold;
  margin:10px 0;}

body#affiliate a.btnOrder {
  border: 1px solid #34be06;
  background-color: #34be06;
  color: #fff;
  border-radius: 3px;
  margin-bottom: 5px;
  margin-top: auto;
  font-size:1.8rem;
  font-weight: bold;
  padding: 12px;
  display: block;
  text-align:center;
  box-sizing: border-box;
  box-shadow: 0 2px 1px #D9D9D9;
  background-image: linear-gradient( rgba(255,255,255,.10) 49%, rgba(255,255,255,0) 50% );
}

body#affiliate a.btnOrder:link {
    text-decoration: none;
}

body#affiliate .wrap2row {
    width: 48%;
    margin-top: 30px;
    display: flex;
  flex-direction: column;
}

@media screen and (max-width: 767px) {
#fullContent,
#items,
.section,
.item3row {width:100%;}

.item3row {margin: 4px 0 4px 0;}

#list h2 {border-bottom: none!important;margin: 20px 0 8px 8px!important;}
}