@import url('/css/base.css');
/*=====================================================================*/
/* BASE OVERWRITE STYLE */
/*=====================================================================*/
body {
color:#000;
}
a:link,
a:visited,
a:hover,
a:active {
color:#000;
}
a img {
border:none;
}
/*=====================================================================*/
/* CHANNEL BASE STYLE */
/*=====================================================================*/
/*---------------------------------------------------------------------*/
/* コンテンツ */
/*---------------------------------------------------------------------*/
#masterContents {
width:990px;
margin:0 auto;
padding:10px 0;
}
/*---------------------------------------------------------------------*/
/* レイアウト */
/*---------------------------------------------------------------------*/
#masterMain {
width:660px;
float:right;
}
#masterMainLeft {
width:200px;
float:left;
}
#masterMainRight {
width:450px;
float:right;
}
#masterSub {
width:300px;
float:left;
}
/*---------------------------------------------------------------------*/
/* ボディ */
/*---------------------------------------------------------------------*/
#masterBody {
background:#FFF;
margin:0 auto;
}
/*---------------------------------------------------------------------*/
/* グローバルナビゲーション */
/*---------------------------------------------------------------------*/
#globalNavigationGroup0 #globalNavigation .gnavOut .gnavIn .gnavBtn15 {
margin:3px 0 0 3px;
padding:5px 7px 4px 7px;
border-radius:2px;
background:#FFF;
}
#globalNavigationGroup0 #globalNavigation .gnavOut .gnavIn .gnavBtn15 a {
color:#000;
text-shadow:0 0 0 rgba(255,255,255,0);
}
/*---------------------------------------------------------------------*/
/* ヘッダ */
/*---------------------------------------------------------------------*/
#globalHeader {
position:relative;
}
#globalHeaderTop {
padding:20px 0;
text-align:center;
}
#globalHeaderMiddle { /* スーパーバナー */
display:none;
}
#globalHeaderBottom {
}
/*---------------------------------------------------------------------*/
/* タグライン */
/*---------------------------------------------------------------------*/
#globalTagline {
display:none;
}
/*---------------------------------------------------------------------*/
/* ヘッダーナビゲーション */
/*---------------------------------------------------------------------*/
#globalHeaderNavigation {
display:table;
width:990px;
margin:-10px auto 10px;
padding:0;
}
/* globalRelatedMediaList */
#globalHeaderNavigation .globalRelatedMediaList {
float:right;
display:table-cell;
}
#globalHeaderNavigation .globalRelatedMediaList ul {
margin:0;
padding:0;
list-style-type:none;
}
#globalHeaderNavigation .globalRelatedMediaList ul li {
float:left;
width:80px;
height:25px;
margin:0 0 0 6px;
padding:0 5px 6px;
font-size:12px;
border-bottom:3px #FFF solid;
}
#globalHeaderNavigation .globalRelatedMediaList ul li a {
display:block;
height:25px;
text-indent:-9999px;
}
#globalHeaderNavigation .globalRelatedMediaList ul li.globalRelatedMediaList-Gadget {
width:63px;
}
#globalHeaderNavigation .globalRelatedMediaList ul li.globalRelatedMediaList-Gadget a {
background:#fff url(http://image.itmedia.co.jp/lifestyle/images/gadget_logo_s.gif) no-repeat center center;
background-size:contain;
}
#globalHeaderNavigation .globalRelatedMediaList ul li.globalRelatedMediaList-Mobile {
width:65px;
}
#globalHeaderNavigation .globalRelatedMediaList ul li.globalRelatedMediaList-Mobile a {
background:#fff url(http://image.itmedia.co.jp/images/logo/80_mobile_bgw.gif) no-repeat center center;
background-size:contain;
}
#globalHeaderNavigation .globalRelatedMediaList ul li.globalRelatedMediaList-PCUSER a {
background:#fff url(http://image.itmedia.co.jp/images/logo/80_pcuser_bgw.gif) no-repeat center center;
}
#globalHeaderNavigation .globalRelatedMediaList ul li.globalRelatedMediaList-LifeStyle a {
background:#fff url(http://image.itmedia.co.jp/images/logo/80_lifestyle_bgw.gif) no-repeat center center;
}
#globalHeaderNavigation .globalRelatedMediaList ul li.globalRelatedMediaList-Healthcare {
width:95px;
border-bottom:3px #FF916E solid;
}
#globalHeaderNavigation .globalRelatedMediaList ul li.globalRelatedMediaList-Healthcare a {
background:#fff url(http://image.itmedia.co.jp/images/logo/100_hc_bgw.gif) no-repeat center center;
background-size:contain;
}
/*---------------------------------------------------------------------*/
/* ロゴ */
/*---------------------------------------------------------------------*/
#globalLogo {
width:250px;
height:60px;
margin:0 auto;
}
#globalLogo h1,
#globalLogo div {
margin:0;
width:250px;
height:60px;
}
#globalLogo h1 a,
#globalLogo div a {
display:block;
width:250px;
height:60px;
background:url(http://image.itmedia.co.jp/images/logo/250_hc.png) no-repeat 0 0;
text-indent:-9999px;
font-size:0;
line-height:0;
}
/*---------------------------------------------------------------------*/
/* メインナビゲーション */
/*---------------------------------------------------------------------*/
.lnavOut {
position:relative;
background:#EEE;
}
.lnavIn {
width:990px;
margin:0 auto;
}
#lnavMain {
position:relative;
height:27px;
padding:5px 0 5px 5px;
}
#lnavMain .lnavBtn {
display:inline;
}
#lnavMain .lnavBtn:before {
content:url(http://image.itmedia.co.jp/hc/images/icon_heart_black.png);
}
#lnavMain .lnavBtnspecial:before {
content:url(http://image.itmedia.co.jp/hc/images/icon_heart_green.png);
}
#lnavMain .lnavBtn a {
text-align:center;
font-size:12px;
font-weight:bold;
line-height:16px;
margin:0 5px 0 0;
padding:2px 9px 2px 5px;
}
/*---------------------------------------------------------------------*/
/* サブナビゲーション */
/*---------------------------------------------------------------------*/
#lnavSub {
position:relative;
font-size:11px;
line-height:14px;
padding:7px 0 7px 5px;
}
#lnavSub::before {
content:"Sponsored";
float:left;
width:70px;
margin:0 10px 0 0;
padding:0;
font-size:12px;
color:#777;
border-right:1px #aaa solid;
}
#lnavSub .lnavBtn {
display:inline;
margin:0 10px 0 0;
}
#lnavSub .lnavBtn a {
position:relative;
}
#lnavSub .lnavBtn a .raquo {
font-size:11px;
line-height:14px;
font-family:Arial, Helvetica, sans-serif;
}
#lnavSub .lnavBtn a:hover .raquo {
}
#lnavSub .lnavBtnspecial a .raquo {
content:url(http://image.itmedia.co.jp/hc/images/icon_heart_green.png);
}
/*---------------------------------------------------------------------*/
/* プルダウンナビゲーション */
/*---------------------------------------------------------------------*/
.lnavBtnGroup {
display:none;
width:200px;
z-index:50;
background:#FFF;
border:1px solid #CCC;
}
.lnavBtnGroupIn .lnavBtn {
margin:0 !important;
display:block !important;
font-size:12px !important;
line-height:16px !important;
}
.lnavBtnGroupIn .lnavBtn a {
width:auto !important;
margin:0 !important;
padding:3px !important;
color:#333 !important;
float:none !important;
border:none !important;
border-bottom:1px dotted #DDD !important;
background:none !important;
text-align:left !important;
display:block !important;
}
.lnavBtnGroupIn .lnavBtn a:hover {
background:#EEE !important;
text-decoration:none !important;
}
/*---------------------------------------------------------------------*/
/* ぱんくず */
/*---------------------------------------------------------------------*/
#localPankuzu {
width:990px;
margin:0 auto;
padding:3px 5px;
font-size:10px;
line-height:14px;
}
/*---------------------------------------------------------------------*/
/* ソーシャルボタン */
/*---------------------------------------------------------------------*/
#globalSocialButtons {
position:absolute;
top:0;
right:0;
padding:4px 0;
}
#globalSocialButtons .globalSocialButton {
float:left;
width:30px;
height:30px;
text-indent:-9999px;
}
#globalSocialButtons .globalSocialButton a {
display:block;
}
#globalSocialButtons .globalSocialButton-Facebook {
background:#cbcbcb url(http://image.itmedia.co.jp/hc/images/icon_snsbtn_facebook.png) no-repeat;
}
#globalSocialButtons .globalSocialButton-Twitter {
background:#cbcbcb url(http://image.itmedia.co.jp/hc/images/icon_snsbtn_twitter.png) no-repeat;
}
#globalSocialButtons .globalSocialButton-Google {
background:#cbcbcb url(http://image.itmedia.co.jp/hc/images/icon_snsbtn_google.png) no-repeat;
}
#globalSocialButtons .globalSocialButton-RSS {
background:#cbcbcb url(http://image.itmedia.co.jp/hc/images/icon_snsbtn_rss.png) no-repeat;
}
#globalSocialButtons .globalSocialButton-mailmagazine {
background:#cbcbcb url(http://image.itmedia.co.jp/hc/images/icon_mailmagazine.png) no-repeat;
}
/*---------------------------------------------------------------------*/
/* 検索窓 */
/*---------------------------------------------------------------------*/
#globalSearch {
position:absolute;
top:0;
right:0;
width:160px;
padding:4px 0;
}
/* for popIn */
#globalSearch form input.query {
width:130px!important;
height:28px;
border:none;
}
#globalSearch form input.submit {
width:30px;
height:30px;
border:none;
background:#cbcbcb url(http://image.itmedia.co.jp/hc/images/icon_searchbtn.png) no-repeat;
text-indent:-9999px;
cursor:pointer;
}
/* for Google Search */
#globalSearch form.gsc-search-box {
margin:0;
padding:0;
}
#globalSearch td.gsc-input {
padding:0;
}
#globalSearch input.gsc-input {
width:130px;
height:30px;
padding:0;
border:none;
}
#globalSearch input.gsc-search-button {
width:30px;
height:30px;
min-width:30px;
margin:0;
padding:0;
border:none;
background:#cbcbcb url(http://image.itmedia.co.jp/hc/images/icon_searchbtn.png) no-repeat;
text-indent:-9999px;
cursor:pointer;
border-radius:0;
-moz-border-radius:0;
-webkit-border-radius:0;
}
#globalSearch div.gsc-clear-button {
display:none;
}
#globalSearch table.gsc-branding {
display:none;
}

/*---------------------------------------------------------------------*/
/* フッタ */
/*---------------------------------------------------------------------*/
#masterFooter {
width:990px;
margin:0 auto;
}
#globalFooter {
padding:10px;
}
#globalFooterLink {
font-size:10px;
line-height:14px;
text-align:right;
margin:0 0 20px;
padding:0 0 10px;
height:1%;
border-bottom:3px solid #666;
}
#globalCopyright {
font-size:12px;
line-height:16px;
}
#globalInquiry {
font-size:10px;
line-height:16px;
}
/*---------------------------------------------------------------------*/
/* カラムボックスカスタム */
/*---------------------------------------------------------------------*/
#masterMainLeft .colBoxHeadSubtxt,
#masterSub .colBoxHeadSubtxt {
top:6px;
right:5px;
}
.colBoxHead {
padding:0;
border-top:5px #000 solid;
border-bottom:none;
color:#000;
}
.colBoxHead h2 {
padding:8px 3px;
font-size:15px;
line-height:20px;
}
#masterMainLeft .colBoxIndex,
#masterSub .colBoxIndex {
padding:10px 0;
}
#masterMainLeft .colBoxSubTitle h5,
#masterSub .colBoxSubTitle h5 {
font-size:10px;
line-height:14px;
}
#masterMainLeft .colBoxTitle h3,
#masterSub .colBoxTitle h3 {
font-size:14px;
line-height:18px;
}
.colBoxSenna .colBoxHead {
display:none;
}
.colBoxSubhead {
padding:5px;
}
.colBoxSubhead h4 {
font-size:14px;
line-height:20px;
}
.colBoxUlist ul {
line-height:20px;
}
.colBoxUlist ul li {
background:url(http://image.itmedia.co.jp/images/ulli_dot.gif) no-repeat scroll 0 4px;
}
.colBoxUlist ul li:nth-last-of-type(1) {
margin:0;
}

/*---------------------------------------------------------------------*/
/* colBoxHeadline - HEADLINE */
/*---------------------------------------------------------------------*/
.colBoxHeadline .colBoxIndex {
position:relative;
}
.colBoxHeadline .colBoxIcon {
display:block;
background:#000;
}
.colBoxHeadline .colBoxIcon a {
float:none;
border:none;
display:block;
width:590px;
height:200px;
overflow:hidden;
}
.colBoxHeadline .colBoxIcon a:hover {
opacity:0.9;
}
.colBoxHeadline .colBoxTitle h3 {
font-size:18px;
line-height:26px;
}
.colBoxHeadline .colBoxTitle h3 a:link,
.colBoxHeadline .colBoxTitle h3 a:visited,
.colBoxHeadline .colBoxTitle h3 a:hover,
.colBoxHeadline .colBoxTitle h3 a:active {
color:#000;
}
.colBoxHeadline .colBoxSocialButtons {
position:absolute;
right:13px;
top:13px;
}
.colBoxHeadline .colBoxSocialButtons .colBoxSocialButton {
display:block;
width:44px;
height:58px;
margin:0 0 3px;
background:#000;
overflow:hidden;
}
.colBoxHeadline .colBoxSocialButtons .colBoxSocialButton-Twitter a {
background:#000 url(http://image.itmedia.co.jp/hc/images/socialbutton_twitter.png) no-repeat;
}
.colBoxHeadline .colBoxSocialButtons .colBoxSocialButton-Facebook a {
background:#000 url(http://image.itmedia.co.jp/hc/images/socialbutton_facebook.png) no-repeat;
}
.colBoxHeadline .colBoxSocialButtons .colBoxSocialButton-Google a {
background:#000 url(http://image.itmedia.co.jp/hc/images/socialbutton_google.png) no-repeat;
}
.colBoxHeadline .colBoxSocialButtons .colBoxSocialButton a {
display:block;
height:44px;
text-indent:-9999px;
border-radius:3px;
}
.colBoxHeadline .colBoxSocialButtons .colBoxSocialButton span {
display:block;
height:14px;
font-size:10px;
line-height:14px;
color:#fff;
text-align:center;
}
.colBoxHeadline .colBoxUlist li {
font-size:16px;
font-weight:bold;;
line-height:28px;
background:url(http://image.itmedia.co.jp/images/ulli_dot.gif) no-repeat scroll 0 6px;
}

/*---------------------------------------------------------------------*/
/* colBoxFeatures - FEATURES */
/*---------------------------------------------------------------------*/
.colBoxFeatures {
margin:0 0 30px;
border:5px #000 solid;
}
.colBoxFeatures .colBoxHead {
border-top:none;
}
.colBoxFeatures .colBoxHead h2 {
padding:10px 20px 5px;
}
.colBoxFeatures .colBoxHead .colBoxHeadSubtxt {
top:10px;
right:15px;
font-size:11px;
}
.colBoxFeatures .colBoxIndex {
padding:0 20px 10px;
}
.colBoxFeatures .colBoxIcon a {
border:1px #000 solid;
margin:0 20px 5px 0;
}
.colBoxFeatures .colBoxTitle h3 {
font-size:24px;
line-height:32px;
}
.colBoxFeatures .colBoxDescription p {
font-size:14px;
line-height:22px;
}

/*---------------------------------------------------------------------*/
/* colBoxRanking - ランキング */
/*---------------------------------------------------------------------*/
#masterSub .colBoxRanking .colBoxIndex {
border-bottom:1px #ddd dotted;
}
#masterSub .colBoxRanking .colBoxIcon img {
width:80px;
height:60px;
}
#masterSub .colBoxRanking .colBoxIcon a {
position:relative;
margin:0 10px 5px 0;
}
/* ラベル */
#masterSub .colBoxRanking {
counter-reset:colBoxRankingCounter;
}
#masterSub .colBoxRanking .colBoxIcon a:after {
counter-increment:colBoxRankingCounter;
content:counter(colBoxRankingCounter);
position:absolute;
top:-6px;
right:-6px;
padding:5px 8px;
line-height:100%;
font-size:13px;
font-weight:bold;
color:#fff;
background:#EC8702;
border:2px #eee solid;
border-radius:4px;
}

/*---------------------------------------------------------------------*/
/* colBoxRecommend - オススメ記事 */
/*---------------------------------------------------------------------*/
#masterSub .colBoxRecommend .colBoxIndex {
border-bottom:1px #ddd dotted;
}