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

/* Reset
----------------------------------------------------*/
html {overflow-y: scroll;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {margin: 0;padding: 0;}
address,caption,cite,code,dfn,em,strong,th,var {font-style: normal;}
table,th,td {font-size: 100%;line-height: 1.6;}
caption,th {text-align: left;font-weight: normal;}
object,embed {vertical-align: top;}
hr,legend {display: none;}
h1,h2,h3,h4,h5,h6 {font-size: 100%;font-weight: normal;}
img,abbr,acronym,fieldset {border: 0;}
ul,li {list-style-type: none;}
img,a img{border:none;background:transparent;vertical-align:bottom;}

/* font
----------------------------------------------------*/
body {
	font: 62.5%  "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color: #333;
}
html>/**/body { font-size: 10px; } /* Except IE */
body #structure {
	width: auto;
	padding: 0;
	line-height: 1.83;
	font-size: 100%;
}

/*--- default */
body {
	background: url(../img/contents_bg.jpg) repeat left top;
	text-align: center;
}

img {
	font-size: 0;
	line-height: 1;
	/zoom: 1;
}

/* Link
----------------------------------------------------*/
a {
	color: #774411;
}
a:hover {
	text-decoration: none;
}

p.photo a:hover img,
p.samplePhoto a:hover img,
ul.galleryList a:hover img,
p.lensPhoto a:hover img {
	filter: alpha(opacity=70);
	opacity: 0.7;
}




/* header
----------------------------------------------------*/
#header {
	position: relative;
	padding: 20px 0 22px;
	height: 68px;
	text-align: left;
	/zoom: 1;
}
#header #headInner {
	position: relative;
	margin: 0 auto;
	padding-right: 20px;
	padding-left: 20px;
	width: 960px;
}
#header p {
	display: inline;
	vertical-align: bottom;
}
#header p#logo {
	margin-right: 11px;
}


/* content
---------------------------------------- */
#contentsWrap {
	font-size: 120%;
}
#contents {
	margin: 0 auto;
	padding-top: 20px;
	padding-right: 20px;
	padding-left: 20px;
	width: 960px;
	text-align: left;
	line-height: 1.83;
}

/* footer
---------------------------------------- */
#footer {
	margin: 0 auto;
	padding-top: 100px;
	width: 960px;
}
#footer .copyright {
	float: left;
	line-height: 41px;
}
#footer .pagetop {
	float: right;
}


/* titleArea
----------------------------------------------------*/
#contents #titleArea {
	position: relative;
	width: 960px;
	/zoom: 1;
}
#contents #titleArea .titleContent {
	float: left;
	width: 535px;
}
#contents #titleArea .titleContent h1 {
	margin-bottom: 25px;
}
#contents #titleArea .textArea {
	position: relative;
	padding-bottom: 40px;
	width: 700px;
}

#contents #titleArea .photoArea {
	_position: absolute;
	float: right;
	_float: none;
	_right: 0;
	width: 386px;
}
#contents #titleArea .photoArea ul li.photo01 {
	float: left;
}
#contents #titleArea .photoArea ul li.photo02 {
	float: right;
}
#contents #titleArea .photoArea ul li.photolens {
	clear: both;
	text-align: right;
}


/*  ========================= caseList */
#contents #caseList {
	position: relative;
	width: 978px;
	margin-right: -18px;
	/zoom: 1;
}
#contents #caseList .anchorCase {
	float: left;
	margin-right: 10px;
	margin-bottom: 10px;
	padding-bottom: 10px;
	width: 479px;
	background: url(../img/bg_caselist_btm.png) no-repeat left bottom;
}
#contents #caseList .anchorCaseInner {
	padding: 20px 15px;
	background: url(../img/bg_caselist_mid.png) repeat-y left top;
}
#contents #caseList .anchorCase h2 {
	margin-bottom: 15px;
}
#contents #caseList #anchorCase04 h2 {
	margin-top: -3px;
}
#contents #caseList .anchorContainer .detailArea {
	float: right;
	width: 190px;
	text-align: center;
}
#contents #caseList .anchorContainer .detailArea h3 {
	margin: 0 auto 5px;
	text-align: center;
}
#contents #caseList .anchorContainer .detailArea .detailBtn {
	margin-top: 10px;
}
#contents #caseList .anchorContainer .photo {
	float: left;
}

/*  ========================= caseArea */
#contents .caseArea {
	margin-top: 100px;
}
#contents .caseArea h2 {
	margin-bottom: 25px;
}
#contents .caseArea .mainItemArea {
	margin-top: 25px;
	padding-bottom: 50px;
}
#contents .caseArea .mainItemArea .samplePhoto {
	float: left;
	padding: 11px 17px 17px 11px;
	background: url(../img/bg_case_main.png) no-repeat left top;
}
#contents .caseArea .mainItemArea .lensInfo {
	float: right;
	width: 300px;
}
#contents .caseArea .mainItemArea .lensInfo h3,
#contents .caseArea .mainItemArea .lensInfo .lensPhoto {
	text-align: center;
}
#contents .caseArea .mainItemArea .lensInfo h3 {
	margin-bottom: 25px;
}
#contents .caseArea .mainItemArea .lensInfo h4 {
	margin-top: 15px;
	margin-bottom: 10px;
	font-weight: bold;
	font-size: 133.3%;
	line-height: 1.5;
}
#contents .caseArea .mainItemArea .lensInfo h4 span {
	display: block;
	margin-bottom: 10px;
	font-weight: normal;
}
#contents .caseArea .mainItemArea .lensInfo .btnItem {
	margin-top: 10px;
}

#contents .caseArea h3.stitleOtherlens {
	margin-bottom: 25px;
}
#contents .caseArea .attention {
	margin-top: 10px;
	font-size: 83.3%;
	text-align: right;
}

/* 掲載レンズが3つの場合 */
#contents .caseArea .item3 {
	position: relative;
}
#contents .caseArea .item3 .lensItem {
	float: left;
	margin-right: 20px;
	padding-bottom: 35px;
	width: 300px;
}
#contents .caseArea .item3 .lensItem:last-child {
	margin-right: 0;
}
#contents .caseArea .item3 .lensItem .lensPhoto {
	margin-bottom: 15px;
	text-align: center;
}
#contents .caseArea .item3 .lensItem h4 {
	margin-top: 15px;
	margin-bottom: 10px;
	font-size: 116.7%;
	font-weight: bold;
	line-height: 1.5;
}
#contents .caseArea .item3 .lensItem h4 span {
	display: block;
	margin-bottom: 10px;
	font-weight: normal;
}
#contents .caseArea .item3 .lensItem .btnItem {
	position: absolute;
	bottom: 0;
}
#contents .caseArea .item3 .lensPhoto {
	height: 120px;
}

/* 掲載レンズが1つの場合 */
#contents .caseArea .item1 .lensItem .lensPhoto {
	float: left;
	width: 325px;
	text-align: center;
}
#contents .caseArea .item1 .lensItem .detailArea {
	overflow: hidden;
}
#contents .caseArea .item1 .lensItem .detailArea .typeIcon {
	margin-top: 0;
}
#contents .caseArea .item1 .lensItem h4 {
	margin-top: 15px;
	margin-bottom: 10px;
	font-size: 116.7%;
	font-weight: bold;
}
#contents .caseArea .item1 .lensItem h4 span {
	display: block;
	font-weight: normal;
}
#contents .caseArea .item1 .lensItem .btnItem {
	margin-top: 10px;
}


/*  ========================= gallery */
.galleryWrap {
	position: relative;
	margin-top: 65px;
	padding: 20px 23px 13px 27px;
	background: url(../img/bg_gallery.png) repeat left top;
	border: 1px solid #cdc8ba;
	border-right: 1px solid #f3f2ed;
	border-bottom: 1px solid #f3f2ed;
	/zoom: 1;
}
.galleryWrap h3.stitlePhotoSample {
	margin-bottom: 15px;
	text-align: center;
}
.galleryWrap .caroufredsel_wrapper {
	width: 912px !important;
}
.galleryWrap ul.galleryList li {
	float: left;
	margin-right: 8px;
	padding: 5px 11px 12px 6px;
	background: url(../img/bg_case_gallery.png) no-repeat left top;
}
.galleryWrap ul.galleryNav li {
	position: absolute;
	top: 65px;
	padding-top: 85px;
	height: 120px;
	cursor: pointer;
	z-index: 30;
	/zoom: 1;
}
.galleryWrap ul.galleryNav li img {
	position: relative;
	z-index: 30;
	/zoom: 1;
}
.galleryWrap ul.galleryNav li.prev {
	left: 0;
	margin-left: -19px;
}
.galleryWrap ul.galleryNav li.next {
	right: 0;
	margin-right: -19px;
}


/*  ========================= icon */
#contents ul.typeIcon {
	margin-top: 20px;
	/zoom: 1;
}
#contents ul.typeIcon:after {
	content: '';
	display: block;
	clear: both;
}
#contents ul.typeIcon li {
	float: left;
	margin-right: 5px;
}


/*  ========================= fancybox */
#fancybox-title-inside {
	text-align: left;
}


/*  ========================= clearfix */
#contents #titleArea,
#contents #caseList,
#contents .anchorContainer,
#contents .caseArea .mainItemArea,
#contents .caseArea .otherLensArea,
#contents .caseArea .item1 .lensItem,
.galleryWrap ul,
#footer {
	/zoom: 1;
}
#contents #titleArea:after,
#contents #caseList:after,
#contents .anchorContainer:after,
#contents .caseArea .mainItemArea:after,
#contents .caseArea .otherLensArea:after,
#contents .caseArea .item1 .lensItem:after,
.galleryWrap ul:after,
#footer:after {
	content: '';
	display: block;
	clear: both;
}