@charset "utf-8";

.bankInftop{
	position:relative;
}


.bankHdinf{
	width: auto;
	height:auto;
	
	font-size:16px;
	line-height:200%;
	min-height:160px;
	letter-spacing:1px;

	color:#333333;
	padding:10px 10px 10px 0px;

	
}

.bankHdinf img{
	margin:0 14px 0px 0;
}


.bankHdinf h2{
	font-size:26px;
	font-weight:bold;
	margin-bottom:10px;
}


.bankHdinf h3{
	font-size:20px;
	font-weight:bold;
	margin-bottom:10px;
}


.bankHdinf .bInf{
	overflow: hidden;
	font-size:18px;
	line-height:200%;
	color:#000000;
	padding:10px;
	background:#fcfcfc;
	
	border:1px solid #cccccc;
	 border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	-ms-border-radius:5px;
	-o-border-radius:5px;	
		
	
}

.bankHdinf ul{
	list-style: decimal ;
	margin:20px 0 0 28px;
	line-height:180%;
	font-size:18px;
}

.bankHdinf ul li{
	font-weight:bold;
	margin-bottom:20px;
}


.bankHdinf ul ul{
	list-style: decimal ;
	margin:20px 0 0 28px;
}

.bankHdinf ul ul li{
	font-weight:bold;
	margin-bottom:16px;
	font-size:16px;
	line-height:150%;
}



.bankHdinf h4{
	display:block;
	font-size:24px;
	font-weight:bold;
	padding:8px 6px 4px 32px;
	background:url(../images/iconPen.webp) left center no-repeat;
}


.stepBank{
	margin-top:10px;
	overflow:hidden;
	margin-bottom:20px;
	border-bottom:1px solid #cccccc;
}


.stepBank ul{
	list-style:none;
	margin:0 0 0 24px;

}

.stepBank li{
	float:left;
	margin-right:10px;


}

.stepBank a.menu{
	padding:6px 6px;
	text-align:center;

	display:table;
	height:50px;
	
	text-decoration:none;
	color: #fff;
	font-weight:bold;
	font-size:16px;
	margin-left:-24px;
	line-height:120%;


	
	border:1px solid #cccccc;
	 border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	-ms-border-radius:5px;
	-o-border-radius:5px;	
	behavior: url(http://artcci.com.tw/css/PIE.htc);
	position:relative

}

.stepBank a.menu p{
display:table-cell;
    text-align:center;
    vertical-align:middle;
}

.scG{
	background: #6C9;
}

.scY{
	background: #F93;
}

.scP{
	background: #f08080;
}
.scSB{
	background: #2f95bc;
}
.scPR{
	background: #d60051;
}

.scOR{
	background: #ff6600;
}



/*Allow*/

.sr{
	display:block;
}

.sd{
	display:none;
	margin-left:-24px;

}

.down{
	width:36px;
	height:22px;
	background:url(../images/stepBot.webp) center no-repeat;
	margin:auto;

}


.right{
  position: relative;
  width: 0;
  height: 0;
  border: 16px solid transparent;
  border-left-color: #999;
  margin:15px 0px 6px 10px;

 
}

.right:after{
  position: absolute;
  content: '';
  top: -8px;
  left: -32px;
  width: 16px;
  height: 16px;
  background: #999;
}


#stepChar ul{
	margin-left:14px;
	list-style:none;
	
}


#stepChar li{
	font-weight:normal;

}

#stepChar li h5{
	display:block;
	font-weight:bold;

	
}


#stepChar li span{
	display:block;
	margin-left:26px;
}

#stepChar a{
	float:left;
	display: block;
	height:20px;
	width:20px;
	margin:5px 6px 0 0;
	text-decoration:none;
	
	border:1px solid #cccccc;
	 border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	-ms-border-radius:5px;
	-o-border-radius:5px;	
	behavior: url(http://artcci.com.tw/css/PIE.htc);


}

#stepChar a.lnk{
	float: none;
	display: inline;
	border: none;
	width: auto;
	height:auto;
	text-decoration: underline;
	color:#006699;
	margin:0;
	
}

#stepChar a:hover.lnk{
	text-decoration:none;
	color:#333333;
}


#stepChar ul ul{
	margin-left:50px;
	list-style:decimal;
	margin-top:0;
}

#stepChar ul ul span{
	display:block;
	margin-left:0px;
	line-height:160%;
	

}


.brLnkttl ul{
	border:1px  dotted #eeeeee;
}


.brLnkttl li p{
	float:left;
	width:20px;
	height:20px;


}




#bankMnBox{
	position:relative;
	text-align:left;
}



.mnBar{
	right:0;

	width:220px;
	margin-bottom:0px;
	margin-top:-26px;
	position:absolute;
	z-index:10000;
	
	
}




.brttl {
background:#ffffff url(../images/sideTtl.webp) left;
cursor:pointer;
}

.brttl h3{
	clear:both;
	overflow:hidden;
	padding:6px 0 8px 36px;
	font-size:16px;
	font-weight:bold;
	color:#333333;
	height:16px;
	margin:20px 0 0 0px;
	
}

.bankMnselected{
	background:#ffffff url(../images/sideTtlB.webp) left;
	color:#ff0000;
}





#bkto{
	display:block;

}

.brLnkttl{
display:none;
width:100%;
background:#ffffff;
z-index:999;


}

#paMn{
	position:absolute;
}



.brLnkttl ul{
	margin:0;
	padding:0;
	list-style:none;
	overflow:hidden;
	
}

.brLnkttl li{
	padding:6px 10px 6px 30px;
	margin:0 0 0 0;
	border-bottom:1px dotted #999;
	background:#ffffff url(../images/sidelm.webp) left top no-repeat;
	background-position:6px 8px;
	line-height:150%;

	
}

.brLnkttl li a{
	text-align:left;
	
	display:block;

	color:#333;
	font-size:16px;
	font-weight:bold;
	line-height:150%;
	font-weight:bold;
	text-decoration:none;
	

}

.brLnkttl li:hover{
	background-color:#f9f9f9;

	
}


.brLnkttl .actv a{
	font-weight:bold;
	color: #cc0000;
}

.brLnkttl li b{
	font-weight:bold;
}


#bfdl{
	width:100%;
	overflow:hidden;

}

#bfdl b{
	float:left;
	
}


#bfdl a{
	display:block;
	float:left;
	margin-left:5px;
}

#bfdl a img{
	max-height:24px;
}



.gallery{
	clear:both;
	padding-top:20px;
}

.galleryTtlbar{
	padding:0px 20px 8px 0;
	height:20px;
	color:#333333;
	text-align:right;
	margin-bottom:20px;
	margin-top:10px;
	border-bottom:1px solid #cccccc;
}

.galleryTtl{
	margin:10px 0;
	padding:40px 20px 8px 0;
	background:#ffffff url(../images/galleryTtlBar.webp) left center no-repeat;
	height:30px;
	color:#333333;
	text-align:right;
	position:relative;
	
}

.galleryTtl .tplnk{
	float:left; margin-left:180px; margin-top:8px;
}

.galleryTtl .tplnk a{
	display:block;
	color:#069;
	text-decoration:none;
}


.gtmt{
	margin-top:-12px;
}




.galleryTtl a{
	display:none;
	text-align:right;
	font-weight:bold;
	color: #39C;
	font-size:16px;
	text-decoration:underline;
}

.galleryTtl a:hover{
	text-decoration:none;
	color:#cc0000;
}

#mainGly{
	margin-right:-2%;
	overflow:hidden;
}



/*商品エレメント*/
.prdBox{
	float:left;
	margin-right:2%;
	margin-bottom:8px;
	overflow:hidden;


}

/*商品内容*/
.prdCont{
	color:#333333; 
	line-height:120%; 
	font-size:13px;
	padding:0 0px;
}

/*商品ネーム等*/
.prdL{
	margin-top:8px;
	line-height:150%;
	overflow:hidden;
	width:auto;

}

.prdL .prdTtl{
	overflow:hidden;
	width:auto;
	height:22px;
	font-weight:bold;
}

/*商品価格*/
.prdR{
	color:#ff0000;
	font-size:13px;
	height:28px;
}






/*商品画像エレメント*/
.prdImgBox{
    position: relative;
	border:1px solid #cccccc;
	display:block;
	overflow: hidden;
	text-align:center;
}

/*商品画像エレメント正方形*/
.prdImgBox:before{
    padding-top: 100%;
    display: block;
    content: "";

	
}

/*商品画像 padding-top: 100%; 調整*/
.prdImgBox > .prdImgIn{
    position: absolute;
    top: 2%;
    left: 2%;
    bottom: 2%;
    right: 2%;
	overflow: hidden;

}

/*商品画像中央 jQuery*/
.prdImg{
	overflow:hidden;
}


/*ホバー時画像 BORDER分縮小*/
.prdImgBox:hover{
	display:block;
	background-color:#000000;
	

}

.prdImgBox .prdImg:hover{
	border:2px solid #ffffff;
}


.prdBox:hover{
	display:block;
	

}



/*アクティブ*/
.prdImgBoxAct{
	display:block;
	background-color:#cccccc;
	

}

.prdImgBox .prdImgAct{
	border:2px solid #ffffff;
}




/*BO横並びBOX数*/
.box2{
	width:46.8%;
}

.box3{
	width:30.6%;
}

.box4{
	width:22.9%;
}


.box6{
	width:16.7%;
}

.box8{
	width:11.0%;
}



/* ### 次、前ページの番号スタイル ###*/
#NBnum{
	clear:both;
	padding-top:20px;
	text-align:center;
	margin:0 0 30px 0;
	
}

#NBnum .num ul{
	list-style:none;
	text-align:center;

}


#NBnum .num ul li{
display:inline
	

}

#NBnum .num ul li a{
	display:inline-block;
	padding:3px 5px 3px 5px;
	border:1px solid #cccccc;
	margin:0 3px 0 0;
	font-size:16px;
	font-weight:700;
	color:#333333;
	text-decoration:none;
}

#NBnum .num ul li a:hover{
	background:#cccccc;
}



#NBnum .arrow ul{
	margin-top:10px;
	list-style:none;
	text-align:center;
}


#NBnum .arrow ul li{
display:inline
}

#NBnum .arrow ul li a{
	display:inline-block;
	margin:0 8px 0 0;

}

#NBnum .arrow ul li a:hover{
filter:alpha(opacity=80);
-moz-opacity:0.8;
opacity:0.8;
}





/*#### ART IMAGE */

#artFile{
	overflow:hidden;
	margin-top:16px;
	position:relative;
	width: auto;

}


#artFile .artImgBox{
	float:left;
	position:relative;
	max-width:500px;
	
}

#artFile .artImgBox a:hover{
cursor: -webkit-zoom-in;
cursor: -moz-zoom-in;
}

#artFile .artImgBox a:hover{
	
cursor: url(http://artcci.com.tw/bank/css/zoom.cur), pointer;	
}


#artFile .artInfoBox{

	width: auto;
	margin-left:530px;
	text-align:left;
	height:auto;
	
	
	
}

.artInfoBox .fileTtl{
	overflow:hidden;
	width:100%;
	border-bottom:5px solid #eeeeee;
	padding:0 0 10px; 0;
}

.fileTtl h2{
	font-size:32px;
	font-weight:bold;
	color:#666666;
}

.artInfoBox ul{
	list-style:none;
}

.artInfoBox ul li{
	font-size:19px;
	color:#666666;
	border-bottom:2px dotted #cccccc;
	padding:16px 0;
}

.artInfoBox ul li span{
	color:#333333;
}


.artInfoBox .artInfNote h3{
	font-size:19px;
	font-weight:bold;
	color:#333333;
	padding:6px 0;
}

.artInfoBox .artInfNote{
	/*position: absolute;*/
    bottom: 0;
	font-size:13px;
	color:#333333;
	line-height:170%;
	letter-spacing:1px;
	padding:1px;
}

.artInfoBox .rented{

	font-weight:bold;
	color:#c52d2f;
	padding:16px 0 0 0;
}






/*### モーダルウィンドウ #*/
#rCov {
	top:0;
	left:0;
	position: fixed;
	width: 100%;
	height: 100%;
	background-color: #000000;
	opacity: 0.75;
	filter: alpha(opacity=75);
	-ms-filter: "alpha(opacity=75)";
	z-index:919000;
	display:none;
	overflow:hidden;
}


#rOpen{
	position:absolute;
	overflow:hidden;
	width: auto;
	z-index:919100;
	display:none;
	max-width:90%;
	background:none;
	
	
	border:none


	
}



#rOpen .modalsi{
	width:400px;
}

#rOpen .op_close{
	float:right;
	width:32px;
	height:32px;
	margin-bottom:-18px !important;
	margin-right:10px;
	z-index:920000;
	position:relative;
	cursor:pointer;
	
	
}

#rOpen .op_cont{
	clear:both;
	 padding-right:10px !important;
	
	
}

#rOpen .op_box{
	width:100%;

	padding:0 0 20px 0;
	margin-right:10px;

	background:#fafafa;
	
	border:1px solid #999999;
	 border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	-ms-border-radius:5px;
	-o-border-radius:5px;	
	behavior: url(http://artcci.com.tw/css/PIE.htc);
	position:relative
}

.imgWind{
	width:100%;
	margin:0px;
	position:relative;

}


.imgWind .op_close2{
	position:absolute;
	width:32px;
	height:32px;
	top:-16px;
	right:16px;
	z-index:920000;

	cursor:pointer;
	
	
}


.imgWind .op_close2:hover{
		opacity: 0.75;
	filter: alpha(opacity=75);
	-ms-filter: "alpha(opacity=75)";
}


.imgWind .artimg{
	border:1px solid #ffffff; 
	 border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	-ms-border-radius:5px;
	-o-border-radius:5px;		
}




a.lnk{
	border:none;
	
}


/*SEARCH*/

.searchBox{
	margin-top:16px;
	overflow:hidden;

}

.keyBox{
	float:left;
	overflow:hidden;
	width:300px
	
}

.searchBox select{
	float: left;
	font-size:18px;
	width:280px;
	padding:3px;
	height:32px;
	line-height:160%;
	background:#fafafa;

	
	border:1px solid #999999;
	 border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	-ms-border-radius:5px;
	-o-border-radius:5px;	
	behavior: url(http://artcci.com.tw/css/PIE.htc);
	position:relative	
}





/*//*/
@media screen and (max-width: 980px) {
	
#cl{
	clear:both;
}

#cr{
	clear:both
}


.busiCont{
	display:none;
}

.bankHdinf{
	margin-right:10px;
}

	
	
#bankMnBox{

	text-align: center;
}
	
	
.brLnkttl li a{
	text-align: center;
}
	
	
.brttl h3{
	padding:6px 0 8px 0px;

}
	
.brLnkttl li{
	padding:6px 0px 6px 0px;
}
	#bfdl b{
	float: none;
	
}


#bfdl a{
	display: inline;
	float: none;

}
	
}

@media screen and (max-width: 900px) {
#artFile .artImgBox{
	max-width:400px;
}

#artFile .artInfoBox{
	margin-left:430px;

}

.artInfoBox .artInfNote{

position: inherit;

}






}

@media screen and (max-width: 700px) {
	
.gallery{
	margin:0 0 0 10px;
}


#artFile {
	margin:0;
	width: auto;
}


#artFile .artImgBox{
	clear:both;
	float:none;
	max-width: none;

}

#artFile .artInfoBox{
	clear:both;
	width:100%;
	margin:0;
	padding:16px 0 0 0px;
	
	
}



.box4{
	width:22.6%;
}





/*STEP*/
.stepBank ul{
	clear:both;
	list-style:none;
	margin:0 0 0 0px;

}

.stepBank li{
	float: none;
	margin-right:0;
	padding-left:30px;
		

}

.stepBank a.menu{
	width:100%;
	font-size:18px;
}

.stepBank a.menu br{
    display: none;
}


.sr{
	display:none;
}

.sd{
	display:block;
	
}






.keyBox{
	float:none;
	margin: auto;
	
}

.galleryTtlbar{
	margin-top:0px;
	text-align:center;
}
	

}




@media screen and (max-width: 540px) {


.numInfo{
	text-align:center;

}

.mnBar{
	margin-top:30px;
	float: none;
	width:100%;
}

#artFile{
	margin-top:50px;
}


	
	/*BO横並びBOX数*/
.box2{
	width:98%;
}

.box3{
	width:30.6%;
}

.box4{
	width:48.0%;
}
	
.searchBoxSpe{
	margin-top:40px;
}


#bfdl b{
	display: block;

}
	
	
}