/* CSS Document */

/* ----------------------------------
	/support/ichigan/lens/macro/index CSS
---------------------------------- */

#contents #contentsArea {
    /* width: 100%; */
}

#contents h1.s-title {
    border-left: #999 7px solid;
}

#contents .text_wrapper h1.s-title span {
    border-left: none;
}

#contents .topArea .text_wrapper {
    padding-left: 0;
    padding-right: 1em;
}

#contents .flex {
    display: flex;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    flex-direction: row;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    justify-content: space-around;
    -ms-flex-pack: distribute;
    margin: 2em auto;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

#contents .pct {
    margin: 1em 0;
    line-height: 0;
}


#contents .topArea {
    align-items: flex-start;
    margin-bottom: 3em;
}

#contents figcaption {
    font-size: 0.9em;
	float: left;
}

#contents .topArea button {
    float: right;
}

#contents figure img.zoom {
    margin-left: 0;
}

#contents section {
    margin-bottom: 2em;
    margin-top: 3em;
    overflow: hidden;
}

#contents h3 {
    font-size: 1.2em;
    margin-bottom: 0.5em;
}

#contents ul.imagelist {
    list-style: none;
}


#contents figure.modal img {
   margin: 1em 0 0.5em;
}

#contents figure.modal a.modalOpen {
    float: right;
	margin-right: 0.2em;
}

#contents figure.modal a.modalOpen img {
    vertical-align: middle;
    margin: 0;
}

#contents .grayArea-2 .pct_c {
    text-align: center;
    align-items: center;
    padding: 1em 1.5em;
}

a.link_fr {
    float: right;
    display: block;
    margin-bottom: 1em;
}

div.space0 {
    margin: 2em 0 3em;
}

/* lens_info */
#contents .lens_info .flex {
    justify-content: space-between;
}

#contents .lens_info .flex .info_wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
}

#contents .lens_info figure.modal a.modalOpen {
    float: left;
    margin-right: 0.2em;
    margin-left: 4.2em;
}

#contents .lens_info .flex .info_wrapper > a.textLink {
    display: block;
    background-position: 0;
    width: 100%;
}

#contents .lens_info .flex .info_wrapper > a.textLink > .name {
    font-weight: bold;
    font-size: 1.231rem;
    display: inline-block;
    text-align: left;
}

#contents .lens_info .flex .info_wrapper > a.textLink > span {
    padding-left: 8px;
}

#contents .lens_info .flex .info_wrapper .s_img {
    margin-bottom: 10px;
}

#contents .lens_info .flex .info_wrapper > a.mod-storeLink {
    background: url(/share2/images/mod-topProduct/bg_01.png) repeat scroll 0 48% transparent;
    border-bottom: 2px solid #DF6F2D;
    display: inline-block;
    line-height: 1;
    padding: 8px 24px 4px;
    color: #fff;
    margin-bottom: 15px;
}

#contents .lens_info .flex .info_wrapper .cafeLink a.textLink {
    font-size: calc(14px * 0.8);
    margin-top: 0;
    margin-left: 0;
}

#contents .lens_info figure.modal img.modalImg {
    width: 440px;
}

#contents .lens_info .flex {
    margin-top: 0;
}


@media (max-width: 640px) {
	#contents .flex {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		margin-top: 0;
	}

	#contents .topArea {
		align-items: center;
	}
	
	#contents figure.modal a.modalOpen {
		display: none;
	}
	
	div.img img {
		max-width: 100%;
	}
	
	#contents figure.modal img {
		width: 100%;
	}
	
	#contents .grayArea-2 .pct_c {
		padding: 0;
	}
	
	#contents figcaption {
		margin-bottom: 0.5em;
	}
	
	#contents .lens_info .flex figcaption {
		float: none;
		text-align: center;
	}
	
	#contents .lens_info .flex .info_wrapper {
		margin-top: 1em;
	}
	
	a.link_fr {
		float: left;
		width: 225px;
	}
	
	#contents .lens_info figure.modal img.modalImg {
		width: 100%;
	}
}

/* 2025/11/10 */
#contents figure.modal img {
    margin: 0;
}

#contents .zoomBtn.w_440 {
	max-width: 440px;
}

#contents .zoomBtn.center {
	text-align: center;
}

#contents .zoomBtn.w_440 .modal button {
	height: 293px;
}

#contents .zoomBtn.w_440 .zoom_ico2 {
	width: 22px;
	top: 271px;
}

#contents .zoomBtn.w_440 figcaption {
	float: none;
}

#contents .lensinfoArea .grayArea .photo.modal button.h322 {
	height: 322px;
}

#contents .lensinfoArea .grayArea .zoomBtn .zoom_ico2.t302 {
	top: 303px;
}

#contents .notice {
	color: #EE0000; 
	font-weight: bold;
	text-align: left;
	display: block;
}

#contents .letterS {
	letter-spacing: 0.06em;
}

@media (max-width: 640px) {	
	#contents .topArea .text_wrapper {
		margin-bottom: 1em;
	}
	
    #contents .zoomBtn.w_440 .photo.modal img {
        width: 100%;
        max-width: 440px;
        height: auto;
    }
	
	#contents .lensinfoArea .grayArea .photo.modal  {
        max-width: 380px;
    }
}