@charset "UTF-8";

/* update : 2011 03 01  */

/*****************
format
******************/
html{overflow-y: scroll;}
html,body {width:100%;height:100%}
body{font:13px arial,helvetica,clean,sans-serif; *font-size:small; *font:x-small;color:#111;}
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}
h1,h2,h3,h4,h5,h6,input,textarea{font-size:100%;font-weight:normal}
fieldset,img {border:0}
ol,ul{list-style:none}
table{border-collapse:collapse;border-spacing:0}
caption,th{text-align:left}
address,caption,cite,code,dfn,em,th,var{font-style: normal;font-weight: normal}
br{letter-spacing:0}

/*support class*/
.clear{clear:both}
.clearfix:after {content: " ";display:block;clear:both;height:0;visibility:hidden}
.clearfix {display:inline-block}
.disp{ text-indent:-9999px ; font-size:0; line-height:0}
.fL{float:left}
.fR{float:right}
.imgfL{float:left; margin-right: 5px;}
.imgfR{float:right; margin-left: 5px;}
.tAC{text-align:center}
.tAL{text-align:left;}
.tAR{text-align:right}
.hList{ overflow:hidden;}
.hList li{ display:block; float: left; padding-right: 4px; margin-right: 4px}
.last{border:none !important;padding:0 !important; background:none!important}
.lsp{letter-spacing:0.2em;}
.att{line-height: 1.5; color: #cc0000; }
.m0A{ margin: 0 auto;}
.mT10{ margin-top: 10px;}
.mB10{ margin-bottom: 10px;}
.mB20{ margin-bottom: 20px}
.mB30{ margin-bottom: 30px !important;}

/*default link style*/
a,a:active{ text-decoration: none;}
a:hover{ text-decoration:none}
a:visited{}


/*****************
share class
******************/
.exp,.time,.cap{font-size: 85%;}
.exp{line-height: 1.8; text-align: right}
.cap{line-height: 1.5; color: #333}
.time{text-decoration:none; color: #555; font-weight:normal; line-height: 2}
.source{ text-decoration:none; color:#555; font-size:12px; font-weight:normal}
.source a{ color:#555;}
.sourceName{color:#454545;font-size:12px; margin-left:10px;}


/*****************
rayout
******************/
#wrapper{ width: 100%; background:#fff; text-align: center;}
#wrapperInner{ width: 990px; margin: 0 auto; clear: both}
#container{text-align: left; overflow: hidden; margin-bottom: 10px;}
#contents{ width: 670px;  float: left}
#sidebar{ width: 300px; float: right;}


/*****************
header
******************/
#header{border-top: solid 4px #cc0000; margin: 0 0 5px; overflow: hidden}
#header .inner{width:990px; margin: 0 auto; background:#fff; padding:5px 0 0 0; overflow: hidden }
#siteID {float: left; width: 282px;}
#siteLogo{ float:left; width:282px; margin: 0 10px 0 0}
#siteLogo li{ display: block; float: left;}
#logoExcite{width: 88px;}
#logoIsm{width: 47px;}
#siteDescription{ margin:17px 0 0 ; color: #333; font-size: 93%; text-align: left}
#control{width: 555px; float: right;  text-align: right;}
#headerLink { float: right ; padding: 0 0 5px;}
#headerLink li{ font-size:85%; border-right:solid 1px #cc0000;}
#headerLink a{ text-decoration:none; color:#cc0000;}
#headerLink a:hover{ text-decoration:underline}
#addMyLink{padding:5px 0 0; clear: both}


/*****************
navigation
******************/
#nav{ margin: 0 0 10px}
#nav .tab_container{ display:none; }
#nav .active{height: 31px; display:block;}
#nav li,#nav a{display:block; float:left;}
#nav a:hover,#nav .cr a{ text-decoration:underline; }
#genreNav{ border: 1px solid #CCCCCC; background:#D9D9D9 url(http://image.excite.co.jp/jp/expub/ism/navigationBg_01.gif) top repeat-x; overflow:hidden; margin-bottom: 1px; height: 39px;}
#genreNav li{border-left:1px solid #FFFFFF;border-right:1px solid #CCCCCC; line-height: 37px;}
#genreNav li a{padding:0 10px; color:#000; text-decoration:none; border-bottom: solid 2px #f7f7f7}
#genreNav a:hover,
#genreNav .cr a{ background:#91968F url(http://image.excite.co.jp/jp/expub/ism/navigationBg_02.gif) top repeat-x; color: #fff;border-bottom: solid 2px #dd0000}

.subGenreNav{background:url(http://image.excite.co.jp/jp/share/images/bg_subGenreNavUl.gif); height: 31px; padding:0 10px; overflow:hidden; clear:both;}
.subGenreNav li,.subGenreNav a{line-height:31px;}
.subGenreNav a{ padding:0 10px; text-decoration:none; color:#222; font-size: 93%;}


/*****************
sidebar
******************/
#sidebar h3{font-weight: bold; line-height: 30px; margin: 6px 0 8px; text-indent: 12px; background: url("http://image.excite.co.jp/jp/woman/grazia/images/H2midashi.gif") no-repeat;}

.sideRanking{ border-bottom: dotted 1px #ccc; padding: 0 0 10px;}
.sideRanking .inner{ padding: 0 ;}

.sideRanking .num{ width: 19px; font-weight: bold; color: #fff; text-align: center; padding: 0 1px 0 0;
background: url(http://image.excite.co.jp/jp/ism/top/ranking_bg.gif) repeat-y;}
.sideRanking .itemTitle{ background: #F6F6F6; line-height: 1.5; padding: 10px; }

#sidebar .blogParts{ width: 300px !important; }
    #sidebar .blogParts h3.bgttl{ background: url(http://image.excite.co.jp/jp/woman/grazia/images/sideOffclBg.jpg) no-repeat top !important; margin: 0; text-indent: -9999px;}
    #sidebar .blogParts ul.bgframe{background: url(http://image.excite.co.jp/jp/woman/grazia/images/sideOffclBg.jpg) no-repeat left bottom !important;}

#sidebar .presentParts,
#sidebar .tie_up{ border-bottom: dotted 1px #ccc; padding: 0 0 10px; margin: 0 0 10px;}
#sidebar .presentParts li{ margin: 0 12px; line-height: 1.5}

#sidebar .tie_up{ width: 300px;}
    #sidebar .tie_up .thumb{ float: left; margin: 0 5px 0 0;}
    #sidebar .tie_up .thumb img{ width: 120px; height: 60px;}
    #sidebar .tie_up .ttl{ margin: 0 0 0 65px; line-height: 1.5}


/*****************
footer
******************/
#footer{background: url(http://image.excite.co.jp/jp/share/images/bg_footer_top.gif) repeat-x top;padding:2px 0 30px 0; clear: both;}
#footer .inner{background:#f7f7f7 url(http://image.excite.co.jp/jp/share/images/bg_footer_bottom.gif) repeat-x bottom;padding:20px 10px; text-align: center}
#footerContents{width: 960px; margin: 0 auto; text-align: left; overflow: hidden}
#footerContents h4{ line-height: 2}
#footerContents .home{ background: url(http://image.excite.co.jp/jp/share/images/icon_home.gif) no-repeat left; padding-left: 20px;}

.footerLink{ float: left; width: 230px;}
.footerLink ul{background:url(http://image.excite.co.jp/jp/share/images/bg_footerlink.gif) no-repeat 0 bottom;}
.footerLink li{background:url(http://image.excite.co.jp/jp/share/images/bg_footerlink.gif) no-repeat 0 3px; padding-left: 23px!important; line-height:1.7}

.footerTopics{ overflow: hidden}
.footerTopics ul{ float: left; width: 240px; margin-right: 10px;}
.footerTopics li{background: url(http://image.excite.co.jp/jp/share/images/icon_arrow02.gif) no-repeat left 6px; padding-left: 15px; line-height:1.7}

#copyright{ margin:10px 0}
address{ text-align:center; color:#666; line-height:1.5; font-size:85%;}

#footerSearch{ width:630px; height:30px; margin: 0 auto; background:url(http://image.excite.co.jp/jp/share/images/bg_footerSearch.gif) no-repeat; position:relative}
#footerSearch .inputSearchWord{ width:490px; height: 20px; font-size: 108%; line-height: 1.5; border:0; background:none; color:#ccc; position:absolute; top:5px; left:30px; outline:none}
#footerSearch #searchSubmit{ width:100px; height:30px; text-indent:-9999px; background:none; border:0; cursor:pointer; position: absolute; right: 0}

#mediaLink{ clear:both; text-align: center; padding:15px 0;}
#mediaLink li{ display: inline; float: none; border-right:solid 1px #666; padding-right:5px; margin:0 6px 5px 0; font-size: 93%; line-height: 1.8}


/*****************
ad
******************/
.ad728{ width:728px; height: 90px; margin:20px auto;}
.ad300{ width:300px; margin-bottom:10px;}


/*****************
share parts
******************/

/***breadcrumbs***/
.breadcrumbs{ font-size: 85%; margin: 10px 0 15px; overflow: hidden;display:inline-block}
.breadcrumbs:after {content: " ";display:block;clear:both;height:0;visibility:hidden}
.breadcrumbs li{ margin: 0 }
.breadcrumbs a{ margin: 0 5px 0 0; text-decoration: none;}
.breadcrumbs a:hover{ text-decoration: underline}

/***title***/
.hgroup {height: 30px;line-height: 30px;text-indent: 14px; font-size: 123.1%; margin: 0 0 10px; background: url(http://image.excite.co.jp/jp/woman/grazia/images/H2midashi.gif) no-repeat left; }
.hgroup h2{ float: left; font-weight: bold;}
.hgroup .hSide{ float: right;}

/*pager*/
.pager{ margin:0 0 10px; overflow: hidden; text-align: center;}
.pager li { display: inline; float: none; margin: 0 3px; padding: 0}
.pager a,
.pager .current{ padding:5px 8px; border: solid 1px #ccc; background: #f7f7f7; line-height: 28px; font-size: 14px; text-decoration: none}
.pager a:hover,
.pager .current{background: #666; border:solid 1px #666; color: #fff;}
.pager .linkBtn a{ border: none; background: none;}
.pager .linkBtn a:hover{ text-decoration: underline; color: #999; border: none; background: #fff}


/*socialModule*/
.socialModule{}
.socialModule .trackBack{ display:inline; margin-right:30px;}
.socialModule .tublog{display:inline; margin-right: 20px;}
.socialModule .rank{display:inline}
.socialModule .selLine{ padding:10px; background: #f7f7f7; border-bottom: dotted 1px #ccc; border-top: dotted 1px #ccc; clear: both; overflow: hidden; margin-bottom:-1px; height: 15px;}
.socialModule .hList{ display:inline}
.socialModule .add{ font-size:85%;}
.socialModule li{ margin-right:5px;}
#trackback_msg,
#tsubulog_msg,
#vote_msg{ font-size:123.1%; font-weight:bold }
#SBM span {float: left; margin-right: 5px;}
/*forIE6*/
*html #SBM:after {content: " ";display:block;clear:both;height:0;visibility:hidden}
*html #SBM { overflow: hidden;display:inline-block;}

/*backnumber*/
#backnumberList .hgroup{ font-size: 100%; margin: 0 0 5px 0; height: 25px;line-height: 25px;}
#backnumberList h3{ font-weight: bold}
#backnumber .inner{ margin-bottom: 10px; border:solid 1px #cc0000;}
#backnumber .tab_container{ display:none; }
#backnumber .active{height: 31px; overflow:  hidden; display:block;}

#bnYearNav{ height:25px; background:#f2c9cb; border-bottom:solid 1px #cc0000; }
#bnYearNav a, 
#bnYearNav li{display:block; height:25px; float: left;} 
#bnYearNav a{ padding:0 12px;line-height:25px; cursor: pointer; text-decoration: none; color:#333; border-right:solid 1px #cc0000;}
#bnYearNav a:hover,
#bnYearNav .cr a{background:#fff; text-decoration:underline; border-bottom:none; color:#cc0000;}

.bnMonthNav{overflow:hidden; clear:both;}
.bnMonthNav { height: 31px;}
.bnMonthNav li{ display:block; height:31px; float:left; overflow:hidden}
.bnMonthNav li a{ display:block; height:31px; float: left; padding:0 10px; line-height:32px; text-decoration:none; color:#333;}
.bnMonthNav a:hover,
.bnMonthNav .cr a{ text-decoration:underline}




/*****************
id="container" class="pages"
******************/
#container a{ color: #cc0000;}

/***top***/
.profile{ width: 400px; height: 120px; float: left; position: absolute; 
background: url(http://image.excite.co.jp/jp/woman/grazia/images/bg_top_iiona.gif) no-repeat;}
    .profile .bgttl{ text-indent: -9999px; font-size: 0; line-height: 0}
    .profile .bgframe{ width: 200px; height:75px; padding:25px 10px 0; position: absolute; top:10px; right: 10px; overflow: hidden}
    .profile .bgframe li{ text-align: center; color: #fff; font-weight: bold; font-size: 123.1%; line-height: 1.5; font-family:"細明朝体", "ヒラギノ明朝 Pro W6",serif}
    #container .profile .bgframe li a{ color: #fff}

.cat_calendar{ width: 252px; height: 110px; padding: 5px; float: right; position:relative; overflow: hidden;
background: url(http://image.excite.co.jp/jp/woman/grazia/images/bg_top_neko_01.gif) no-repeat; }
    .cat_calendar h3.bgttl{ width: 38px; height: 63px; position: absolute; top:0; left: 0;
    background: url(http://image.excite.co.jp/jp/woman/grazia/images/bg_top_neko_02.gif) no-repeat}
    .cat_calendar .thumb{ height: 110px; width: 150px; overflow: hidden; }
    .cat_calendar .thumb img{ width: 150px;}
    .cat_calendar .ttl{ position: absolute; top:10px; right: 5px; line-height: 1.5; width: 90px }
    #container .cat_calendar a{ color: #fff; }

#topFlash{ margin: 0 0 10px;}

#newArticle{ margin: 0 0 15px 0}
#newArticle .more{ text-align: right; margin: 10px; line-height: 2}

/***list***/
.articleList{ margin: 0 0 10px 0}
.article{ padding: 10px; border-bottom: 1px solid #E6E6E6; overflow:hidden; display:inline-block; width: 650px;}
.article:after {content: " ";display:block;clear:both;height:0;visibility:hidden}
.article .thumb{ width: 160px; float: right; margin: 0 0 0 10px; border: solid 1px #ccc; padding: 1px; text-align: center}
.article .thumb img{ max-width: 160px; margin: 0 auto;}
* html .article .thumb img { width : expression((document.documentElement.clientWidth > 160)? "160px" : "auto"); height : 1%;}
.article .fR{ width: 475px; float: none; float: left}
.article h3{ font-size: 108%; line-height: 1.5; font-weight: bold; margin: 0 0 5px;}
.article h3 a{ text-decoration: none}
.article h3 a:hover{ text-decoration: underline}
.article .summay{ line-height: 1.5}
.article .time{ line-height: 2}
.article .keywords{ line-height: 2;font-size: 93%; color: #666;}
.article .keywords a{ color: #666;}

/***detail***/
.articleMain .hgroup{ height: 68px; margin: 0 0 15px; background: url(http://image.excite.co.jp/jp/woman/grazia/images/detailTitle.gif) no-repeat left;}
.articleMain h1{ font-size: 123.1%; font-weight: bold;}
.articleMain .story{ line-height: 1.6; margin: 0 0 15px 0; padding: 0 15px;}
.articleMain .story img{ margin: 10px 0}

.relContents .hgroup{ font-size: 100%; margin: 0 0 5px 0; height: 25px;line-height: 25px;}
.relContents .inner{ padding: 0 15px;}
.relLink,
.relNews,
.relPhoto,
.addressCard,
.pageNav,
.socialModule,
.pickup,
.relKeyword{ margin: 0 0 10px 0;}
.relContents li,
.relContents dl{ line-height: 1.8}
.relContents dt{ clear: both; float: left; width: 50px; text-align: right; margin: 0 10px 0 0}


/***gallery***/
.gallery #contents{ width: 100%;}
#photoGallery{ text-align: center; overflow: hidden}
.mainPhotoArea{ margin: 0 auto 10px; text-align: center;}
.mainPhoto{ display: inline}
.prevPhoto,
.nextPhoto,
.prevPhoto a,
.nextPhoto a{ display: block; width: 50px; height: 100%; text-indent: -9999px; outline: none}
.prevPhoto{ float: left;  background: url(http://image.excite.co.jp/jp/expub/ism/prevPhoto_bg.jpg) no-repeat left center}
.nextPhoto{ float: right; background: url(http://image.excite.co.jp/jp/expub/ism/nextPhoto_bg.jpg) no-repeat right center}
/*css3 over*/
.prevPhoto a,
.nextPhoto a{ background: #fff; opacity:0.6; filter: alpha(opacity=60); -webkit-transition: background 0.3s;}
.prevPhoto a:hover,
.nextPhoto a:hover{ background: none; filter: alpha(opacity=0); cursor: pointer}
.photoCaption{ margin: 0 0 5px;}
.photoCopyright{ margin: 0 0 5px;}
.photoNavi { margin:10px 0; overflow: hidden; text-align: center}
.photoNavi li { display: inline; float: none; margin: 0; padding: 0}
.photoNavi li a{ text-decoration: none}
.photoNavi li img{ padding: 2px; border: solid 1px #ccc;}
.backLink{ margin: 10px 100px; text-align: right;}


/***blogList***/
ul.blogList .thumb{ float:left; width:100px; margin:0 10px 0 0}
ul.blogList h4{ margin: 0 0 5px 110px; padding:0 0 0 15px; background:url(http://image.excite.co.jp/jp/woman/grazia/images/H2midashi.gif) no-repeat left;}
ul.blogList .bgList{ width:610px; border-bottom:dotted 1px #cc0000; margin:0 30px 15px; padding:0 0 15px;}
ul.blogList .postTitle{ margin:0 0 0 125px; font-size:116%; font-weight:bold; line-height:1.8}
ul.blogList .date{ padding:0 0 0 10px; font-size:85%; color:#666;}







