@charset "utf-8";

/* ======================================================================================================================================
カテゴリートップ
====================================================================================================================================== */
.index_category{
	position:relative;
	display: -webkit-inline-flex;
    display: -moz-inline-flex;
    display: -ms-inline-flex;
    display: -o-inline-flex;
    display: inline-flex;
	
	-webkit-flex-direction:column-reverse;
	flex-direction:column-reverse;
}
.index_category h4:first-child{
border-bottom: none;
padding:2%;
width:96%;
font-size:1.3em;
font-weight: bold;
color: #333;
}
.index_category h4 + p{
font-size:1em;
padding:0 5%;
width:90%;
}
.categoryBannerWrapper{
	margin-bottom:2em;
}
.categoryBannerWrapper img{width:100%;}
.halfBanner li{display:block;float:left;/*margin-bottom:10px;*/width:100%;}




/* ======================================================================================================================================
ビデオカメラ、プロジェクター、デジタルカメラのカテゴリートップ
====================================================================================================================================== */


.carousel {
overflow: hidden;
width: 100%;
height: 160px;
margin: auto;
background: #eee;
}
.carousel > ul {
width: 400vw;
height: 160px;
}
.carousel > ul > li {
position: relative;
float: left;
width: 100vw;
height: 160px;
/*padding: 10px;*/
box-sizing: border-box;
}
.carousel > ul#digicamindex > li:nth-child(1) {
background: url(../images/category/rental-kan.jpg);
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
.carousel > ul#digicamindex > li:nth-child(2) {
background: url(../images/category/point_digicam01.png);
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
.carousel > ul#digicamindex > li:nth-child(3) {
background: url(../images/category/point_digicam04.jpg);
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
.carousel > ul#digicamindex > li:nth-child(4) {
background: url(../images/category/point_digicam02.jpg);
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
.carousel > ul#videoindex > li:nth-child(1) {
background: url(../images/category/point_digicam01.png);
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
.carousel > ul#videoindex > li:nth-child(2) {
background: url(../images/category/point_digicam02.jpg);
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
.carousel > ul#videoindex > li:nth-child(3) {
background: url(../images/category/point_video03.jpg);
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
.carousel > ul#videoindex > li:nth-child(4) {
background: url(../images/category/point_video04.jpg);
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
.carousel > ul#projectorindex > li:nth-child(1) {
background: url(../images/category/point_projector02.jpg);
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
.carousel > ul#projectorindex > li:nth-child(2) {
background: url(../images/category/projector-rental.jpg);
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
.carousel > ul#projectorindex > li:nth-child(3) {
background: url(../images/category/point_digicam02.jpg);
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
.carousel > ul#projectorindex > li:nth-child(4) {
background: url(../images/category/point_projector03.jpg);
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
.carousel > ul {
transition: transform 0.3s;
}
.carousel > ul.pos1 {
transform: translateX(0);
}
.carousel > ul.pos2 {
transform: translateX(-100vw);
}
.carousel > ul.pos3 {
transform: translateX(-200vw);
}
.carousel > ul.pos4 {
transform: translateX(-300vw);
}

#wrap .nav {
width: 300px;
margin: auto;
text-align: center;
}
#wrap .nav > li {
display: inline-block;
width: 10px;
height: 10px;
margin: 0 5px;
border-radius: 50%;
background: #ddd;
}
#wrap .nav > li.active {
background: #999;
}
.carousel > ul > li h3 {
position: absolute;
top:30px;

width:100%;
color:#FFF;
font-size:1em;
text-align:center;
line-height:1.4;
text-shadow: #222 0px 0px 4px, #222 1px 1px 4px, #222 -1px -1px 4px;
display: block;
				animation-duration: 0.5s;
				animation-name: fade-in;
}
.carousel > ul > li em{
font-size:1.7em;
font-weight: 600;
line-height:1.4;
display:inline-block;
padding-top:0;
}
.carousel > ul > li p {
				font-size:1.2em;
				position: absolute;
				padding: 20px 10px;
				width: 100%;
				height: 100%;
				background: rgba(255,255,255,0.7);
				box-sizing: border-box;
display: none;
				animation-duration: 0.5s;
				animation-name: fade-in;
}
@keyframes fade-in {
0% {
display: none;
opacity: 0;
}

1% {
display: block;
opacity: 0;
}

100% {
display: block;
opacity: 1;
}
}







#deliFree img {
float: right;
width: 95px;
margin-left: 25px;
}

/* ======================================================================================================================================
機材包括
====================================================================================================================================== */
.goodsWrapper{
width:96%;
padding:0 2%;
margin:20px 0 0;
text-align:left;
}
.goods{
position:relative;
margin-bottom:15px;
padding-bottom:15px;
border-bottom:solid 1px #999;
}
.goods a{
	display:block;
	color:inherit;
	
	width:100%;
}
.itemContName {
    font-size: 1.3em;
    line-height: 1.2;
    padding:0 5%;
    width: 90%;
											font-weight:normal;
											background: url(../images/common/headingLeft3.png) no-repeat 1% center;
											min-height: 1.5em;
}

.itemContPic {
	height: 100%;
    max-height: 100%;
    width: 100%;
		text-align:center;
		padding:5px 0;
	position:relative;
}
.itemContPic a {
padding-bottom:45px;
}
span.shousai {
	position: absolute;
	right:22%;
	bottom: 10px;
	text-align: center;
	display: inline-block;
	width:50%;
	padding:5px 10px;
	font-size:1.2em;
	color:#FFF;
	font-weight:bold;
	border-radius:4px;
	background-color:#FF850B;
	border:none;
}
.newIcon{
	position:absolute;
	right:0;
	top:0;
}
.review {
    clear: both;
    line-height: 1.2;
	margin:0 auto;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
	width: 90%;
	
	display:none;
}
.price{
    width: 100%;
}
.price ul {
    width: 58%;
	float: left;
	margin: 0 0 0 2%;
	font-size:1.2em;
	background:#F4F3F4;
	border:solid 1px #CCC;
	box-shadow:rgb(255, 255, 255) 0px 0px 2px 0px inset;
	box-sizing: border-box;
}
.price li {
    color: #111;
    font-weight: normal;
    width: 100%;
	line-height:1.4;
	box-sizing: border-box;
	display:inline-block;
}
.price li:first-child {
	width: 100%;
	font-weight:normal;
	background:none;
	padding:0 0 0 2px;
	font-size:0.9em;
	border-left:solid 3px #666;
	margin-left:5px;
}
.pricePeriod{
	color: #111;
	font-weight:normal;
	padding:0 1em 0 0.5em;
}
.price em{
	font-size:0.9em;
}
.price li:nth-child(3) ~ li {
	color: #111;
}
.price li:nth-child(3) ~ li .pricePeriod {
	color: #ff1111;
}
.price ul .dottedLine {
    background: url(../images/common/dot.png) no-repeat scroll center bottom;
}
.mmIcon{
	width:40%;
	text-align:center;
	display: inline-block;
	float: left;
}
.mmIcon img{
	padding:0 2% 4px 0;
	width:27%;
	max-width:40px;
}


.mmIcon img[alt="pricedown"]{
	display:none;
}




/* ======================================================================================================================================

====================================================================================================================================== */
.goods input {
display:none;
}
.detail {
display:none;
}

div.inner{
overflow: hidden;
width: 100%;
}











/*デジカメインデックス*/



.left-triangle,
.left-triangle-other{
	font-size:1.8em;
	margin-top:0px;
	line-height:28px;
	box-sizing:border-box;
	position:relative;
	margin-left:30px;
}

.left-triangle::before{
	content:"";
	font-size:0;
	line-height:0;
	border-style: solid;
    border-width: 15px;
	border-color: transparent;
    border-left-color: #ec7d5e;
	
	position:absolute;
	top:0%;
	left:-20px;
}
.left-triangle-other::before{
	content:"";
	font-size:0;
	line-height:0;
	border-style: solid;
    border-width: 15px;
	border-color: transparent;
    border-left-color: #1faca7;
	
	position:absolute;
	top:0%;
	left:-20px;
}
#water-proof,
#denchi,
#battery{
	 margin-bottom:10px;
}













/* ======================================================================================================================================

====================================================================================================================================== */
#subCategoryLink li {
	position:relative;
	display: inline-block;
	float: left;
	
	font-size: 1em;
	font-weight: bold;
	
	width: 98%;
	margin:0 1% 5px;
	
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
#subCategoryLink a {
	border: 1px solid #C0C0C0;
	background-color: #F1F1F1;
	padding-left:30px;
	display: block;
	text-align: left;
	text-decoration: none;
	
	line-height: 44px;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
#subCategoryLink li:hover{
	
}
#subCategoryLink a:hover{
	text-decoration: underline;
}
#subCategoryLink li.min a{
	line-height: 22px;
	vertical-align:middle;
}
		#subCategoryLink li::before,
		#subCategoryLink li::after {
			position: absolute;
			top: 60%;
			right: 5%;
			display: block;
			content: '';
			width: 12px;
			height: 3px;
			background-color: #888;
			border-radius: 4px;
		}
		#subCategoryLink li::before {
			margin-top: -4px;
			-webkit-transform: rotate(-45deg);
			transform: rotate(-45deg);
		}
		#subCategoryLink li::after {
			margin-top: -4px;
			margin-right:7px;
			-webkit-transform: rotate(-135deg);
			transform: rotate(-135deg);
		}
#subCategoryLink~h4{
	width:100%;
	display:inline-block;
	margin-bottom:10px;
}


















@media print, screen and (min-width:480px){

}

@media print, screen and (min-width:640px){

	#wrap{
	background: #EEE;
	margin-top:0;
	margin-bottom:0;
	padding-top:0;
	padding-bottom:0;
	}
.carousel {
	text-align: center;
    margin: 0 auto;
    width: 950px;
    height: 340px;
    box-sizing: border-box;
}
.carousel > ul {
    display: inline-block;
    text-align: left;
    vertical-align: top;
    width: 100%;
    height: auto;
    box-sizing: border-box;
    overflow: visible;
}
.carousel > ul > li {
	position: relative;
	background: rgba(255,255,255,0.5);
  width: calc( 25% - 4px );
  height: 200px;
  padding: 0;
  margin-right: 5px;
  box-sizing: border-box;
}
.carousel > ul > li h3 {
	position: absolute;
	top:44px;

	width:100%;
	text-align: center;
  	color:#FFF;
	text-shadow: #222 0px 0px 4px,
	#222 1px 1px 4px,
	#222 -1px -1px 4px;
	font-size:1.2em;
	line-height:1.4;
	text-align:center;
}
.carousel > ul > li em{
	font-size:1.7em;
	line-height:1.4;
	display:inline-block;
	padding-top:0;
	}
.carousel > ul > li p {
	font-size: 1em;
	line-height: 1.7;
	display: block;
	padding: 10px;
	position: absolute;
	top:200px;
  }
.carousel > ul > li:nth-child(4) {
	margin-right: 0;
}
.carousel > ul.pos1,
.carousel > ul.pos2,
.carousel > ul.pos3,
.carousel > ul.pos4 {
	transform: none;
}
#wrap .nav{
	display: none;
}







.index_category{
	position:relative;
	display: block;
	-webkit-flex-direction:row;
	flex-direction:row;
}
#mainCategory {
float: left;
width: 510px;
}
.price ul {
    width: 48%;
}
.mmIcon{
	width:50%;
}
.mmIcon img{
	width:33%;
}

}


@media print, screen and (min-width: 728px) {


/* ======================================================================================================================================
カテゴリートップ
====================================================================================================================================== */

.index_category h4:first-child{
background: url(../images/common/hb.jpg) repeat-x left top;
line-height: 28px;
text-align: left;
padding: 4px 4px 2px 8px;
border-top:none;
border-bottom: 1px dashed #CCC;
margin-bottom: 10px;
font-family: "ＭＳ Ｐゴシック", "MS PGothic", arial, helvetica, clean, sans-serif;
width: 100%;

		font-weight:bold;
}
#primaryWrapper h4 + p{
font-size:1.2em;
width:96%;
padding:0 2%;
}
.halfBanner li{display:block;float:left;margin-bottom:10px;width:auto;}
.halfBanner li:nth-child(2n){margin-left:22px;}
.bannerText {
font-size:1.2em;
margin-bottom:5px;
width: 692px;
padding-left: 26px;
background: url(../images/common/list_black.png) no-repeat 12px 3px;
}
#categoryTopWrapper{
overflow:hidden;
width:722px;
position:relative;
height:155px;
clear:both;
}
#categoryTopImg{
height:150px;
position:absolute;
left:0px;
top:0px;
width:722px;
}
#categoryTopWrapper h3{
width:700px;
position:absolute;
left:12px;
top:88px;
line-height:1.4;
}
#categoryBannerWrapper{margin-bottom:2em;}
.categoryTopContent{
float:left;
width:722px;
margin-bottom:2em;
}


#primaryWrapper p{
padding:0;
width:100%;
}

.categoryContent{
float:left;
width:100%;
margin-top:3em;
}




/* ======================================================================================================================================
ビデオカメラ、プロジェクターのカテゴリートップ
====================================================================================================================================== */
#deliFree img {
float: right;
width: 95px;
margin-left: 25px;
}








/* ============================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================
======================================================================================================================================
機材包括
====================================================================================================================================== */
.goodsWrapper{
width:auto;
float:left;
margin:0 0 10px 0;
text-align:left;
padding:0;
}

.goods{
	position:static;
float:left;
width:221px !important;
display:block;
text-align:center;
margin:0 13px 10px 0;
background:#FFF;
border:5px solid #D6D6D6;

padding-bottom: 0;
}

.goods:nth-child(3n){
	margin-right:0px;
}

.goods input{display:block;}

.goods img{
font-size:0px;
line-height:0px;
vertical-align:bottom;
}
.goods p{
	margin-bottom:0px;
}
.goods table,
.goods tr,
.goods td{
	font-size:3em;
}
.goods .inner{
padding:10px 7px;
float:left;
width:207px;
}
.goods a{
	text-decoration:none;
	
	padding-bottom:0;
	position:static;
	
	display:inline;
}
.itemContName{
	/* div.goods h6 */
	font-size:1.05em;
	font-weight:bold;
	letter-spacing:0em;
	line-height:1.1;
	text-align:left;
	
	margin-right:-5px;
	padding: 0 0 0 11px;
	
	float:left;
	width:167px;
	min-height:2.1em;
	
	background:url(../images/common/headingLeft3.png) no-repeat left center;
	
	position:static;
	
	overflow: hidden;
	white-space: normal;
	text-overflow: visible;
	
margin-bottom:0;
}

.itemContName a{
	color:#000;
	text-decoration:none;
	
width:100%;
}
.itemContName span{
	font-size:0.8em;
	font-weight:normal;
	letter-spacing:0.05em;
}
.itemContPic{
position:static;
margin:0;
padding:0;
}
.itemIndexBg{
	vertical-align:middle;
	top:0;
}
.itemIndexBg{
padding:7px;
vertical-align:bottom;
}
.newIcon{
	position:static;
	top:0;
	right:0;
	
	width:24px;
	margin-left:-24px;
	float:right;
}

.detail{
overflow:hidden;
width:207px;
float:left;
margin-top:8px;
margin-bottom:4px;

display:block;
}
.detail li{
display:block;
float:left;
margin-right:10px;
}
.detail .liLast{margin-right:0px;}
.iconLogo{
margin-bottom:0px;
margin-top:0px;
margin-right:5px;
}

#cartIn input{ime-mode:disabled;}
#cartIn p{white-space:nowrap;}

.review{
	position: static;
	left: 0;
	top: 0;
text-align:left;
line-height:1.2;
width:207px;
clear:left;
	padding-bottom:0;
float:none;

display:block;
}
.review a{
	color:#FF0033;
}

.price{
	font-size:1em;
	text-align:left;
	overflow:hidden;
	width:207px;
	float:left;
	
	margin:0;
	display: inline-block;
}
.price:not(:target){
	font-size:1.1em; /* IE9 */
}
									.price_h{
									font-size:1em;
									text-align:left;
									overflow:hidden;
									width:202px;
									float:left;
									}
.price ul{
	background:url(../images/category/priceImg.png) no-repeat left top;
	float:left;
	width:112px;
	margin-top:4px;
	border-bottom:1px solid #CCC;
	padding-top:22px;
	position: static;
	padding-left:0;
	padding-bottom:0;
	font-size:1em;
	margin-left:0;
	border-top:none;
	border-left:none;
	border-right:none;
	box-shadow:none;

max-height:220px;
}
									.price_h ul{
									background:url(../images/category/price_hImg.png) no-repeat right top;
									float:left;
									width:112px;
									margin-top:4px;
									border-bottom:1px solid #CCC;
									padding-top:22px;
									}
.price dt,
.price_h dt{
	height:20px;
}
.price li,
.price_h li{
	font-weight:normal;
	color:#000;
	
text-align:left;
line-height:1.2em;
padding:0.4em 2px;
}

.price li {
    width: 112px;
}
.price li:first-child {
    width: 112px;
	padding:0.4em 2px;
	font-size:1em;
	border-left:none;
	margin-left:0;
}

.price li:nth-child(3) ~ li {
    background: none;
    color: #444;
	padding:0.4em 2px;
}

.price ul .dottedLine {
    background: url(../images/common/dot.png) no-repeat scroll center bottom;
}
.price ul .dottedLine:last-child{
	background:none;
}
.priceLong{
color:#FF0033;
font-size:0.9em;
}
.mmIcon{
	position:static;
	left:0;
	bottom:0;
	margin-bottom:0;
	text-align:left;
width:84px;
float:right;
overflow:hidden;
margin-top:4px;
}
.mmIcon li{
	display:block;
}
.mmIcon img{
	display:block;
	float:left;
	width:40px;
	max-width:40px;
	margin:0 2px 2px 0;
	
	padding: 0;
}
.mmIcon img[alt="pricedown"]{
	display:none;
}






/*機材カテゴリートップページ一覧と、詳細ページのおすすめオプションで使用する機材の包括装飾系CSS
→ソース内部に移して整理
itemContainer.css*/







/*デジカメインデックス*/



.left-triangle,
.left-triangle-other,
.left-triangle-digicam{
	font-size:2.8em;
	margin-top:20px;
	box-sizing:border-box;
	position:relative;
	margin-left:30px;
	margin-bottom:20px;
}
.left-triangle::before{
content:"";
font-size:0;
line-height:0;
border-style: solid;
border-width: 18px;
border-color: transparent;
	border-left-color: #ec7d5e;
position:absolute;
left:-20px;
}
.left-triangle-other::before{
content:"";
font-size:0;
line-height:0;
border-style: solid;
border-width: 18px;
border-color: transparent;
	border-left-color: #1faca7;
position:absolute;
/*top:-50%;*/
left:-20px;
}
.left-triangle-digicam::before{
content:"";
font-size:0;
line-height:0;
border-style: solid;
border-width: 18px;
border-color: transparent;
	border-left-color: #f07a58;
position:absolute;
/*top:-50%;*/
left:-20px;
}
#water-proof,
#denchi,
#battery{
	 margin-bottom:20px;
}








#bookmark{
position:absolute;
top:12px;
left:75px;
}
.externalLink {
background: url(../images/common/iconExternal.gif) no-repeat scroll left top rgba(0, 0, 0, 0) !important;
margin-left: 0px !important;
padding: 0.1em 17px 0.1em 16px !important;
width: auto;
}

#subCategoryLink li {
	font-size:1em;
	width: 230px;
	margin:0 5px 10px 3px;
	height:40px;
}
#subCategoryLink li:nth-child(3n){
	margin-right: 0px;
}

#subCategoryLink a {
	border: 1px solid #C0C0C0;
	background: #FFF url(../images/common/listMark3.gif) no-repeat 15px center;
}

#subCategoryLink a:hover{
	background: #ECECEC url(../images/common/listMark3.gif) no-repeat 17px center;
}
#subCategoryLink li.min a{
	line-height: 20px;
	height:45px;
}
#subCategoryLink li::before,
#subCategoryLink li::after {
	display: none;
}



}