@charset "utf-8";

#body > nav {min-height:80px; position:relative; margin:0 -1000px 60px; padding:0 1000px; border-bottom:1px solid #e5e5e5;}
#body > nav > h1 {
	position:absolute; left:50%; bottom:0; margin:0 0 0 -465px; padding:30px 0 10px 5px; background:#fff no-repeat; font-size:14px; font-weight:bold; line-height:1.2; 
	font-family:SIGMA_Bold, Verdana, Roboto, "Droid Sans", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;}
#container.art          > #body > nav > h1 {background-image:url(../images/nav_line_art.png);}
#container.contemporary > #body > nav > h1 {background-image:url(../images/nav_line_contemporary.png);}
#container.sports       > #body > nav > h1 {background-image:url(../images/nav_line_sports.png);}
#body > nav > ul {display:table; position:absolute; right:50%; bottom:-1px; margin:0 -460px 0 0; border-top:1px solid #e5e5e5; border-right:1px solid #e5e5e5;}
#body > nav > ul > li {
	display:table-cell; background:#fff; border-left:1px solid #e5e5e5; border-bottom:1px solid #e5e5e5; font-size:12px; line-height:1.3; vertical-align:middle;}
#body > nav > ul > li > a, 
#body > nav > ul > li > span {display:table-cell; min-width:4em; height:36px; padding:7px 18px 4px; text-align:center; vertical-align:middle; text-decoration:none;}
#body > nav > ul > li > span {color: #ddd;cursor:default;}
#body > nav > ul > li > a small, 
#body > nav > ul > li > span small {display: block; font-size: smaller;}

#body > nav > ul > li.share {display:block; position:absolute; right:0; bottom:-60px; padding:21px 0; border:none;}
#body > nav > ul > li.share > b {display:none;}
#body > nav > ul > li.share > ul {}
#body > nav > ul > li.share > ul:after {display:block; clear:both; height:0; content:"";}
#body > nav > ul > li.share > ul > li {float:left; margin:0 0 0 8px;}
#body > nav > ul > li.share > ul > li > a {display:block; width:18px; height:18px; background:no-repeat; text-indent:110%; white-space:nowrap; overflow:hidden;}
#body > nav > ul > li.share > ul > li > a:hover {opacity:0.5;}
#body > nav > ul > li.share > ul > li.facebook > a {background-image:url(../../../../images/icon_facebook.gif);}
#body > nav > ul > li.share > ul > li.twitter  > a {background-image:url(../../../../images/icon_twitter.gif);}

#body a.link {display:block; margin:2em 0 0; font-size:12px; text-align:left; text-decoration:none; line-height:1.2;}
#body a.link.eos-m {margin:0.5em 0 0;}
#body a.link:before {display:inline-block; content:"\e909"; margin:-2px 5px 0 0; font:16px/1 icons; vertical-align:middle; text-indent:0;}
#body a.more {
	display:inline-block; margin:2em auto 0; padding:15px 50px; border:2px solid #e5e5e5; background:#fff; font-size:14px; text-align:center; text-decoration:none;}
#body a.more:before {display:inline-block; content:"\e909"; margin:-2px 5px 0 0; font:16px/1 icons; vertical-align:middle; text-indent:0;}
#body a.more[href^="#"]:before {content:"\e90a";}

#body figure > figcaption > ul {margin:1em 0 0 0em;}
#body figure > figcaption > ul > li {
	display:inline-block; position:relative; margin-left:0.5em; padding:0 0 0 14px;}
#body figure > figcaption > ul > li:after {
	display:block; content:""; width:8px; height:8px; position:absolute; left:0; top:50%; margin:-5px 0 0; border:1px solid #999999;}
#body figure > figcaption > ul > li.fld-glass:after       {background:#eec640;}
#body figure > figcaption > ul > li.sld-glass:after       {background:#a2bddc;}
#body figure > figcaption > ul > li.eld-glass:after       {background:#a0c487;}
#body figure > figcaption > ul > li.aspherical-lens:after {background:#d2a4bf;}
#body figure > figcaption > ul > li.magnesium:after       {background:#012595;}

/** by language **/
html:lang(fr) #body > nav > ul > li > * {padding:7px 16px 4px;}
html:lang(fr) #body > nav > ul > li.share > * {padding:0;}


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

#body {overflow:visible;}

#body > nav {width:100%; min-width:320px; min-height:0; margin:0; padding:0; border-bottom:none; overflow:hidden;}
#body > nav > h1 {
	max-height:50px; position:relative; left:0; z-index:1; margin:0; padding:28px 50px 5px 20px; border-bottom:1px solid #e5e5e5; box-sizing:border-box; 
	background:#fff 15px 5px no-repeat; background-size:auto 23px; font-size:15px; overflow:hidden;}
#container.art          > #body > nav > h1 {background-image:url(../images/header_line_art.png);}
#container.contemporary > #body > nav > h1 {background-image:url(../images/header_line_contemporary.png);}
#container.sports       > #body > nav > h1 {background-image:url(../images/header_line_sports.png);}
#body > nav > ul {display:block; position:static; margin:-1px 0 0; padding:0 20px; background:#fff; border-top:none; border-right:none; border-bottom:1px solid #e5e5e5;}
#body > nav > ul > li {display:block; border-left:none; border-bottom:none; border-top:1px solid #e5e5e5;}
#body > nav > ul > li:first-child {border-top:none;}
#body > nav > ul > li br {display:none;}
#body > nav > ul > li > a, 
#body > nav > ul > li > span {
	display:block; min-width:0; height:auto; position:relative; margin:0 -20px; padding:15px 45px 15px 20px; 
	text-align:left; vertical-align:middle; text-decoration:none;}
#body > nav > ul > li > a:after	{display:block; content:"\e601"; position:absolute; right:20px; top:50%; margin:-0.5em 0 0; color:inherit; font:16px/1 "icons";}
#body > nav > ul > li > span {}
#body > nav > ul > li > a small, 
#body > nav > ul > li > span small {display: inline-block; font-size: 10px; margin-left: 0.5em;}

#body > nav > ul > li.share {position:static; margin:-1px -20px 0; padding:20px; border-top:1px solid #e5e5e5;}
#body > nav > ul > li.share:after {display:block; clear:both; height:0; content:"";}
#body > nav > ul > li.share > b {display:block; float:left; font-size:12px; font-weight:bold;}
#body > nav > ul > li.share > ul {float:right; margin:-5px -5px -5px 0;}
#body > nav > ul > li.share > ul:after {}
#body > nav > ul > li.share > ul > li {margin:0;}
#body > nav > ul > li.share > ul > li > a {width:30px; height:30px; background-size:30px;}
#body > nav > ul > li.share > ul > li > a:hover {}
#body > nav > ul > li.share > ul > li.facebook > a {background-image:url(../../../../images/sp/icon_facebook.png);}
#body > nav > ul > li.share > ul > li.twitter  > a {background-image:url(../../../../images/sp/icon_twitter.png);}

#body a.link {margin-top:1em}
#body a.link:before {}

#body a.more {display:block; margin:1em auto 0; padding:9px; background:#fff; font-size:12px;}
#body a.more:before {}

#body figure > figcaption > ul {}
#body figure > figcaption > ul > li {}
#body figure > figcaption > ul > li:after {}
#body figure > figcaption > ul > li.fld-glass:after       {}
#body figure > figcaption > ul > li.sld-glass:after       {}
#body figure > figcaption > ul > li.eld-glass:after       {}
#body figure > figcaption > ul > li.aspherical-lens:after {}

/** by language **/
html:lang(fr) #body > nav > ul > li > * {padding:15px 45px 15px 20px;}
html:lang(fr) #body > nav > ul > li.share > * {}

}