@charset "utf-8";

/*-----------------------------------
The Asahi Shimbun(En)
en-asahi-header2016.css
※画像はルートパスで書いてください。

------
2020/10　上部ナビの幅
.Nav > li > a {
.MainNav .Nav > li:first-child{
2021/2　z-indexの値をリストの動画より上に
.SubNav {
------


last modified --2015-12-03 (新規作成)
-----------------------------------*/


#Header{
width:100%;
margin:0 auto;
padding:0;
border-bottom:1px solid #E1E1DA;
background:#FFF;
font-family:Arial, Helvetica, sans-serif;
}
#Header #HeaderInner{
position:relative;
width:980px;
_width:1000px;
margin:0 auto;
padding:10px 10px 8px;
text-align:left;
z-index:300;
}

/* Logo
==================== */
#Header #HeaderInner .SiteLogoTop,
#Header #HeaderInner .SiteLogo{
display:block;
width:342px;
height:34px;
float:left;
margin:0 50px 0 8px;
padding:0;
}
#Header #HeaderInner .SiteLogoTop a,
#Header #HeaderInner .SiteLogo a{
display:inline-block;
margin:0;
padding:0;
*display:inline;
*zoom:1;
}


/* UtilityNav
==================== */

#Header #HeaderInner .UtilityNav{
display:block;
float:left;
margin:3px 0 0;
padding:0;
}
#Header #HeaderInner .UtilityNav ul{
margin:0;
padding:0;
}
#Header #HeaderInner .UtilityNav ul li{
display:block;
margin:0 18px 0 0;
padding:0;
float:left;
line-height:1.1;
position:relative;
}
#Header #HeaderInner .UtilityNav ul li a{
display:block;
width:28px;
height:28px;
margin:0;
padding:0;
text-indent:-9999px;
}
#Header #HeaderInner .UtilityNav ul li.Search form{
margin:0;
padding:0;
outline:none;
}
#Header #HeaderInner .UtilityNav ul li.Search fieldset{
border:none;
}
#Header #HeaderInner .UtilityNav ul li.Search{
margin-top:2px;
margin-right:14px;
width:214px;
}
#Header #HeaderInner .UtilityNav ul li.Search input.SearchKeywords{
margin:0;
padding:1px 0 1px 6px;
/padding:2px 0 1px 6px;
float:left;
width:145px;
_width:149px;
height:20px;
/height:19px;
_height:23px;
color:#1E1E17;
font-size:75%;
line-height:15px;
text-align:left;
background:rgb(240,240,233);
background:-moz-linear-gradient(top,rgb(240,240,233) 0%,rgb(255,255,255) 99%);
background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,rgb(240,240,233)),color-stop(99%,rgb(255,255,255)));
background:-webkit-linear-gradient(top,rgb(240,240,233) 0%,rgb(255,255,255) 99%);
background:-o-linear-gradient(top,rgb(240,240,233) 0%,rgb(255,255,255) 99%);
background:-ms-linear-gradient(top,rgb(240,240,233) 0%,rgb(255,255,255) 99%);
background:linear-gradient(to bottom,rgb(240,240,233) 0%,rgb(255,255,255) 99%);
filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#f0f0e9',endColorstr='#ffffff',GradientType=0 );
border-top:1px solid #D2D2CB;
border-right:none;
border-bottom:1px solid #D2D2CB;
border-left:1px solid #D2D2CB;
-moz-border-radius:4px 0 0 4px;
-webkit-border-radius:4px 0 0 4px;
border-radius:4px 0 0 4px;
}
#Header #HeaderInner .UtilityNav ul li.Search input.SearchSubmit{
width:60px;
height:24px;
margin:0;
padding:0 3px;
float:left;
background:#5A5A53;
border:none;
color:#FFF;
font-size:75%;
font-weight:bold;
text-align:center;
/*letter-spacing:3px;
*/-moz-border-radius:0 4px 4px 0;
-webkit-border-radius:0 4px 4px 0;
border-radius:0 4px 4px 0;
cursor:pointer;
}
#Header #HeaderInner .UtilityNav ul li.Search input.SearchSubmit:hover{
background:#B90000;
}


/* SocialNav */
#Header #HeaderInner .SocialNav{
display:inline-block;
float:right;
margin:6px 0 0 0;
padding:0;
}
#Header #HeaderInner .SocialNav ul{
margin:0;
padding:0;
}
#Header #HeaderInner .SocialNav ul li{
display:block;
margin:0 0 0 5px;
*margin:0 0 0 5px;
padding:0;
float:left;
line-height:1.1;
}
#Header #HeaderInner .SocialNav ul li:first-child{
margin:0;
}
#Header #HeaderInner .SocialNav ul li a{
display:block;
width:20px;
_width:20px;
height:20px;
_height:22px;
margin:0;
padding:0;
text-indent:-9999px;
border:1px solid #D2D2CB;
-moz-border-radius:4px;
-webkit-border-radius:4px;
border-radius:4px;
}
#Header #HeaderInner .SocialNav ul li a:hover{
border:1px solid #B90000;
}
#Header #HeaderInner .SocialNav ul li.Twitter a{
background:url(../images/icon_socialnav_twitter.gif) no-repeat 5px 6px;
}
#Header #HeaderInner .SocialNav ul li.Twitter a:hover{
background-position-y:-24px;
}
#Header #HeaderInner .SocialNav ul li.Facebook a{
background:url(../images/icon_socialnav_facebook.gif) no-repeat 7px 5px;
}
#Header #HeaderInner .SocialNav ul li.Facebook a:hover{
background-position-y:-25px;
}


/* LanglNav
==================== */

#HeaderInner #LangNav {
display: block;
float: right;
margin: 12px 10px 0 5px;
padding: 0;
font-size: 75%;
font-weight: bold;
line-height: 1.1;
letter-spacing: 0;
text-align: left;
white-space: nowrap;
position:relative;
}

#HeaderInner #LangNav #LangDD {
position: absolute;
top: 20px;
left:-30px;
z-index:15;
}

#HeaderInner #LangNav .Arrow {
width: 0;
height:0;
border-color:transparent;
border-style:dashed dashed solid;
border-width:0 4px 4px;
position:absolute;
top:1px;
z-index:1;
border-bottom-color:#FFF;
left:55px;
}

#HeaderInner #LangNav .Arrow_bg {
width: 0;
height:0;
border-color:transparent;
border-style:dashed dashed solid;
border-width:0 4px 4px;
position:absolute;
top:0;
border-bottom-color:#B4B4AD;
left:55px;
}

#HeaderInner #LangNav .Frame {
box-sizing: border-box;
margin:0;
padding:8px 8px 0;
position:absolute;
top:4px;
border-radius:2px;
background:#FFF;
border:1px solid #D2D2CB;
width:118px;
}


#HeaderInner #LangNav #LangChange .ChangeBtn {
display: block;
margin:0;
padding:0 0 8px;
float:none;
line-height:1.1;
text-align:center;
white-space:nowrap;
position:static;
}

#HeaderInner #LangNav .ChangeBtn a {
display: inline;
margin:0;
padding:0;
width:auto;
height:auto;
color:#787871;
text-indent:0;
background:none;
}

#HeaderInner #LangNav .ChangeBtn a:hover,#LangNav .ChangeBtn a:active {}

#HeaderInner #LangNav .ChangeBtn a:hover,#LangNav .ChangeBtn a:active {
color: #B90000;
text-decoration:none;
}

.ChangeBtnActive a {
color: #0A0A03;
}

/* GlobalNav
==================== */

#GlobalNav{
margin:0 auto -1px;
padding:0;
clear:both;
width:100%;
border-top:1px solid #DCDCD5;
background:#EBEBE4;
}
#GlobalNavInner{
}
.MainNav{
display:inline-block;
margin:0 auto;
padding:0;
width:980px;
}
.MainNav .Nav{
margin:0;
padding:0;
}
.MainNav .Nav > li {
position:relative;
float:left;
font-size:75%;
font-weight:bold;
line-height:2.2;
text-align:center;
border:1px solid #EBEBE4;
}
.Nav > li > a {
display:block;
padding:0 11px;
color: #1E1E17;
text-decoration: none;
font-weight:bold;
}
/* Nav 現在地 */
.Nav > li.Active {
background-color: #B90000 !important;
border-top:1px solid #B90000 !important;
border-bottom:1px solid #B90000 !important;
}
.Nav > li.Active a {
color: #fff;
}
/* Nav ホバー時 */
.Nav > li:hover {
background: #7D7D76;
border-top:1px solid #7D7D76;
border-bottom:1px solid #7D7D76;
}
.Nav > li:hover a {
color: #fff;
}
/*Nav 現在地 + ホバー時*/
.Nav > li.Active:hover,
.Nav > li.Active:active{
background: #B90000;
border-top:1px solid #B90000;
border-bottom:1px solid #B90000;
}
.Nav > li.Active:hover a:hover,
.Nav > li.Active:hover a:active{
color: #fff;
}

/*What's Newだけ特別*/
.Nav > li.WhatsNew a {
position:relative;
border-bottom:0px solid #b90000;
}
.Nav > li.WhatsNew a:before{
content:"";
width:calc(100% - 20px);
margin-left:11px;
position:absolute;
bottom:3px;
left:0;
border-bottom:1px solid #b90000;
}/*
.Nav > li.WhatsNew a:after{
content:"\25CF";
position:absolute;
top:-7px;
right:3px;
color:#b90000;
}*/


/*li_第2階層有り */
.Nav > li.HasSubNav:hover{
border-bottom: px solid #7D7D76;
top:-1px;
}
.Nav > li.HasSubNav > a:after{
background: url(images/arrow_gnav_close.png) no-repeat 0 0;
content: "";
display: inline-block;
height: 6px;
width: 6px;
margin-left:5px;
}
.Nav > li.HasSubNav:hover > a:after,
.Nav > li.HasSubNav.Active > a:after{
background: url(images/arrow_gnav_close.png) no-repeat 0 -40px;
content: "";
display: inline-block;
height: 6px;
width: 6px;
margin-left:5px;
}

/*li_第2階層 */
.SubNav {
visibility: hidden;
opacity: 0;/*透明度*/
z-index: 100;
position: absolute;
top: 20px;
background: #fafaf3;
padding-left:0;
text-align:left;
display:block;
padding:0 24px;
}
.Nav li:hover .SubNav {
width:150px;
top: 25px;
visibility: visible;
opacity: 1;/*透明度*/
border: 1px solid #e1e1da;
border-top: none;
padding: 10px 0;
display:block;
padding-left:25px;
}
.Nav li:hover .SubNav li a {
color:#1E1E17;
line-height:2.1;
}
.Nav li:hover .SubNav li a:hover {
color:#B90000;
text-decoration:none;
}
/*Nav_TOPアイコン、幅*/
.MainNav .Nav > li:first-child{
padding:0 4px;
}
.MainNav .Nav > li:first-child a span{
padding-left:18px;
background:#EBEBE4 url(images/icon_gnav_home.gif) no-repeat 0 0;
}
.MainNav .Nav > li:first-child.Active a span{
padding-left:18px;
background:#B90000 url(images/icon_gnav_home.gif) no-repeat 0 -60px !important;
}
.MainNav .Nav > li:first-child:hover a span{
padding-left:18px;
background:#7D7D76 url(images/icon_gnav_home.gif) no-repeat 0 -30px;
color:#fff;
border-top:1px solid #7D7D76;
border-bottom:1px solid #7D7D76;
}
.MainNav .Nav > li:first-child.Active:hover a span{
padding-left:18px;
background:#B90000 url(images/icon_gnav_home.gif) no-repeat 0 -30px;
color:#fff;
border-top:1px solid #B90000;
border-bottom:1px solid #B90000;
}

/* clear */
.MainNav .Nav:before,
.MainNav .Nav:after {
content: " ";
display: table;
}
.MainNav .Nav:after {
clear: both;
}
.MainNav .Nav {
*zoom: 1;
}

/* clear fix
==================== */
#Header #HeaderInner:after,
#Header #HeaderInner .Option:after,
#Header #HeaderInner .Option .Search:after,
#Header #HeaderInner .Option .Utility:after,
#Header #HeaderInner .TopWords:after,
#Header #HeaderInner .Function .Status:after,
#Header #HeaderInner .Function .Service:after,
#Header #HeaderInner .Function #ServiceDD .Frame ul:after,
#Header #HeaderInner .UtilityNav ul:after,
#Header #HeaderInner .UtilityNav ul li.Search:after,
#Header #HeaderInner .UserNav ul:after,
#Header #HeaderInner .SocialNav ul:after,
#Header #GlobalNav #GlobalNavInner .MainNav .Nav:after,
#Header #GlobalNav #GlobalNavInner .SubNav .Sub:after,
#Header #GlobalNav #GlobalNavInner .SubNav .SubDropdown:after,
#Header #GlobalNav #GlobalNavInner .SubNav .SubDropdown .Nav:after,
#Header #GlobalNav #GlobalNavInner #CustomizeDD .FavoritesBlock:after,
#Header #GlobalNav #GlobalNavInner #CustomizeDD .FavoritesBlock li dl dt:after,
#Header #GlobalNav #GlobalNavInner #CustomizeDD .FavoritesBlock li dl dd:after,
#TopicsBar #TopicsBarInner dl:after,
#TopicsBar #TopicsBarInner dl dd ul:after{
visibility:hidden;
display:block;
font-size:0;
content:" ";
clear:both;
height:0;
}
* html #Header #HeaderInner,
* html #Header #HeaderInner .Option,
* html #Header #HeaderInner .Option .Search,
* html #Header #HeaderInner .Option .Utility,
* html #Header #HeaderInner .TopWords,
* html #Header #HeaderInner .Function .Status,
* html #Header #HeaderInner .Function .Service,
* html #Header #HeaderInner .Function #ServiceDD .Frame ul,
* html #Header #HeaderInner .UtilityNav ul,
* html #Header #HeaderInner .UtilityNav ul li.Search,
* html #Header #HeaderInner .UserNav ul,
* html #Header #HeaderInner .SocialNav ul,
* html #Header #GlobalNav #GlobalNavInner .MainNav .Nav,
* html #Header #GlobalNav #GlobalNavInner .SubNav,
* html #Header #GlobalNav #GlobalNavInner .SubNav .SubDropdown,
* html #Header #GlobalNav #GlobalNavInner .SubNav .SubDropdown .Nav,
* html #Header #GlobalNav #GlobalNavInner #CustomizeDD .FavoritesBlock,
* html #Header #GlobalNav #GlobalNavInner #CustomizeDD .FavoritesBlock li dl dt,
* html #Header #GlobalNav #GlobalNavInner #CustomizeDD .FavoritesBlock li dl dd,
* html #TopicsBar #TopicsBarInner dl,
* html #TopicsBar #TopicsBarInner dl dd ul{
zoom:1;
}/* IE6 */
*:first-child+html #Header #HeaderInner,
*:first-child+html #Header #HeaderInner .Option,
*:first-child+html #Header #HeaderInner .Option .Search,
*:first-child+html #Header #HeaderInner .Option .Utility,
*:first-child+html #Header #HeaderInner .TopWords,
*:first-child+html #Header #HeaderInner .Function .Status,
*:first-child+html #Header #HeaderInner .Function .Service,
*:first-child+html #Header #HeaderInner .Function #ServiceDD .Frame ul,
*:first-child+html #Header #HeaderInner .UtilityNav ul,
*:first-child+html #Header #HeaderInner .UtilityNav ul li.Search,
*:first-child+html #Header #HeaderInner .UserNav ul,
*:first-child+html #Header #HeaderInner .SocialNav ul,
*:first-child+html #Header #GlobalNav #GlobalNavInner .MainNav .Nav,
*:first-child+html #Header #GlobalNav #GlobalNavInner .SubNav,
*:first-child+html #Header #GlobalNav #GlobalNavInner .SubNav .SubDropdown,
*:first-child+html #Header #GlobalNav #GlobalNavInner .SubNav .SubDropdown .Nav,
*:first-child+html #Header #GlobalNav #GlobalNavInner #CustomizeDD .FavoritesBlock,
*:first-child+html #Header #GlobalNav #GlobalNavInner #CustomizeDD .FavoritesBlock li dl dt,
*:first-child+html #Header #GlobalNav #GlobalNavInner #CustomizeDD .FavoritesBlock li dl dd,
*:first-child+html #TopicsBar #TopicsBarInner dl,
*:first-child+html #TopicsBar #TopicsBarInner dl dd ul{
zoom:1;
}/* IE7 */