@import url('/css/base.css');
/*=====================================================================*/
/* BASE OVERWRITE STYLE */
/*=====================================================================*/
body {
color:#333;
}
a:link {
color:#000;
}
a:visited {
color:#555;
}
a:hover {
color:#555;
}
a img {
border:none;
}
/*=====================================================================*/
/* CHANNEL BASE STYLE */
/*=====================================================================*/
#masterMain {
width:675px;
float:left;
}
#masterMainLeft {
width:200px;
float:left;
}
#masterMainRight {
width:460px;
float:right;
}
#masterSub {
width:300px;
float:right;
}
#masterBody {
width:990px;
margin:0 auto;
background:#FFF;
}
/*---------------------------------------------------------------------*/
/* グローバルナビゲーション */
/*---------------------------------------------------------------------*/
#globalNavigationGroup0 #globalNavigation .gnavOut .gnavIn .gnavBtn0 a {background-position:0 0;}
#globalNavigationGroup0 #globalNavigation .gnavOut .gnavIn .gnavBtn5 a {
margin:3px 0 0 3px;
padding:5px 11px 4px;
border-radius:2px;
background:#FFF;
color:#000;
}
/*---------------------------------------------------------------------*/
/* ヘッダ */
/*---------------------------------------------------------------------*/
#globalHeader {
position:relative;
}
/*---------------------------------------------------------------------*/
/* 検索 */
/*---------------------------------------------------------------------*/
#globalSearch {
margin:0;
padding:0 0 14px;
}
#globalSearch #popInSearchField {
border:1px solid #CCCCCC;
height:22px !important;
width:230px !important;
margin:0;
padding:0;
}
#globalSearch .submit {
background:url(http://image.itmedia.co.jp/pcuser/images/globalHeader_socialBtn.gif) no-repeat scroll 0 -91px;
border:none;
height:24px;
margin:0;
text-indent:-9999px;
width:68px !important;
cursor:pointer;
}
#globalSearch input.query {
width:150px;
}
/*---------------------------------------------------------------------*/
/* タグライン */
/*---------------------------------------------------------------------*/
#globalTagline {
display:none;
}
/*---------------------------------------------------------------------*/
/* ヘッダーナビゲーション */
/*---------------------------------------------------------------------*/
#globalHeaderNavigation {
float:right;
display:table;
margin:0 30px 0 0;
padding:10px 0 2px;
}
/* globalSocialLinks */
#globalHeaderNavigation .globalSocialLinks {
display:table-cell;
vertical-align:middle;
border-right:1px #ddd solid;
}
#globalHeaderNavigation .globalSocialLinks ul {
margin:0 10px 0 0;
padding:0;
list-style-type:none;
}
#globalHeaderNavigation .globalSocialLinks ul li {
float:left;
width:24px;
height:24px;
margin:0 7px 0 0;
font-size:12px;
}
#globalHeaderNavigation .globalSocialLinks ul li a {
display:block;
text-indent:-9999px;
}
#globalHeaderNavigation .globalSocialLinks ul li.globalSocialLinks-Facebook {
background:url(http://image.itmedia.co.jp/pcuser/images/globalHeader_socialBtn.gif) no-repeat 0 0;
}
#globalHeaderNavigation .globalSocialLinks ul li.globalSocialLinks-Twitter {
background:url(http://image.itmedia.co.jp/pcuser/images/globalHeader_socialBtn.gif) no-repeat -32px 0;
}
#globalHeaderNavigation .globalSocialLinks ul li.globalSocialLinks-RSS {
background:url(http://image.itmedia.co.jp/pcuser/images/globalHeader_socialBtn.gif) no-repeat -63px 0;
}
#globalHeaderNavigation .globalSocialLinks ul li.globalSocialLinks-Hatena {
background:url(http://image.itmedia.co.jp/pcuser/images/globalHeader_socialBtn.gif) no-repeat -126px 0;
}
#globalHeaderNavigation .globalSocialLinks ul li.globalSocialLinks-Google {
background:url(http://image.itmedia.co.jp/pcuser/images/globalHeader_socialBtn.gif) no-repeat -189px 0;
}
#globalHeaderNavigation .globalSocialLinks ul li.globalSocialLinks-mailmagazine {
background:url(http://image.itmedia.co.jp/pcuser/images/globalHeader_socialBtn.gif) no-repeat -158px 0;
}
/* globalRelatedMediaList */
#globalHeaderNavigation .globalRelatedMediaList {
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 {
border-bottom:3px #ff6a3a solid;
}
#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;
}
#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 {
float:left;
width:200px;
margin:8px 0 0 0;
}
#globalLogo h1,
#globalLogo div {
margin:0 10px;
width:170px;
height:73px;
}
#globalLogo h1 a,
#globalLogo div a {
display:block;
width:170px;
height:73px;
background:url(http://image.itmedia.co.jp/images/logo/170_pcuser_bgw.gif) no-repeat 0 0;
text-indent:-9999px;
font-size:0;
line-height:0;
}
/*---------------------------------------------------------------------*/
/* スーパーバナー */
/*---------------------------------------------------------------------*/
#globalHeaderMiddle {
padding:0;
margin:0 0 15px;
}
/*---------------------------------------------------------------------*/
/* メインナビゲーション */
/*---------------------------------------------------------------------*/
#localNavigation {
float:left;
width:760px;
padding:10px 0 0;
}
#lnavMain {
display:none;
}
/*---------------------------------------------------------------------*/
/* サブナビゲーション */
/*---------------------------------------------------------------------*/
#lnavSub {
margin:0;
padding:0;
}
#lnavSub .lnavBtn a {
background:#e7e7e7;
border-radius:3px;
text-align:center;
display:block;
float:left;
color:#000;
margin:0 8px 5px 0;
padding:4px 8px 3px;
font-size:12px;
line-height:15px;
white-space:nowrap;
}
#lnavSub .lnavBtn.lnavBtnActive a {
background:#CCC;
}
#lnavSub .lnavBtn a:hover {
text-decoration:none;
background:#CCC;
}
#lnavSub .lnavBtn a .raquo {
display:none;
}
#lnavSub .lnavBtn.lnavBtnarrowssp a {
color:#2f3e8d;
}
/* lnavSubSp */
#lnavSub .lnavSubSp a,
#lnavSub .lnavBtnlnavSubSp a {
background:#ffd2c4;
}
#lnavSub .lnavSubSp a:hover,
#lnavSub .lnavBtnlnavSubSp a:hover {
background:#FF9789;
}
#lnavSub .lnavSubSp.lnavBtnActive a,
#lnavSub .lnavBtnlnavSubSp.lnavBtnActive a {
background:#FF9789;
}
/*---------------------------------------------------------------------*/
/* サブサブナビゲーション */
/*---------------------------------------------------------------------*/
#lnavSubSub {
clear:both;
margin:0;
padding:0;
}
#lnavSubSub::before {
content:"Sponsored";
float:left;
width:70px;
margin:0 10px 6px 0;
padding:0 5px;
font-size:13px;
line-height:16px;
color:#888;
border-right:1px #ccc solid;
}
#lnavSubSub .lnavBtn {
float:left;
}
#lnavSubSub .lnavBtn a {
color:#333;
font-size:12px;
line-height:16px;
margin:0;
padding:3px 7px 3px 10px;
white-space:nowrap;
}
#lnavSubSub .lnavBtn a:link,
#lnavSubSub .lnavBtn a:visited {
background:url(http://image.itmedia.co.jp/pcuser/images/bul.png) no-repeat left center;
}
#lnavSubSub .lnavBtn a:hover {
text-decoration:none;
background:url(http://image.itmedia.co.jp/pcuser/images/bul_on.png) no-repeat left center;
}
#lnavSubSub .lnavBtnPR a:link,
#lnavSubSub .lnavBtnPR a:visited {
background:url(http://image.itmedia.co.jp/images/cms_pr.gif) no-repeat 0 1px;
padding:0 0 0 22px;
}
#lnavSubSub .lnavBtnPR a .raquo {
display:none;
}
#lnavSubSub .lnavBtnNew a:link,
#lnavSubSub .lnavBtnNew a:visited {
background:url(http://image.itmedia.co.jp/images/ulli_new.gif) no-repeat 0 0;
padding:0 0 0 27px;
}
#lnavSubSub .lnavBtnNew a .raquo {
display:none;
}
#lnavSubSub .lnavBtn a .raquo {
display:none;
}
#lnavSubSub .lnavBtn a:hover .raquo {
display:none;
}
#lnavSubSub .lnavBtnspecial a {
color:#ff6a3a;
font-weight:bold;
}
/*---------------------------------------------------------------------*/
/* プルダウンナビゲーション */
/*---------------------------------------------------------------------*/
.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 {
font-size:12px;
line-height:14px;
padding:0 0 15px 5px;
}
/*---------------------------------------------------------------------*/
/* ソーシャルボタン */
/*---------------------------------------------------------------------*/
.globalSocialBtn {
float:left;
padding:0 0 0 0;
}
.globalSocialBtn ul {
margin:0;
padding:0;
float:left;
}
.globalSocialBtn li {
float:left;
display:block;
padding:0 5px 0 0;
}
.globalSocialBtn a {
display:block;
width:24px;
height:24px;
overflow:hidden;
text-indent:-9999px;
background:url(http://image.itmedia.co.jp/pcuser/images/globalHeader_socialBtn.gif) no-repeat;
}
.globalSocialBtn .globalSocialBtnFacebook a {
background-position:0 0;
}
.globalSocialBtn .globalSocialBtnTwitter a {
background-position:-32px 0;
}
.globalSocialBtn .globalSocialBtnRss a {
background-position:-63px 0;
}
.globalSocialBtn .globalSocialBtnHatebu a {
background-position:-126px 0;
}
.globalSocialBtn .globalSocialBtnGoogleplus a {
background-position:-189px 0;
}
/*---------------------------------------------------------------------*/
/* フッタ */
/*---------------------------------------------------------------------*/
#globalFooter {
padding:10px 0;
}
#globalFooterLink {
color:#999;
font-size:12px;
line-height:14px;
text-align:right;
margin:0;
padding:30px 15px 5px;
height:1%;
}
#globalFooterBottom #lnavSub {
display:none;
}
#globalFooterBottom #lnavSubSub {
display:none;
}
#glob#cboxNewArtopyright {
font-size:12px;
line-height:16px;
}
#globalInquiry {
font-size:10px;
line-height:16px;
}
#globalFooterMediaListIn {
border-top:1px solid #DDD;
padding:15px;
}
#globalFooterMediaList .mediaList ul {
border-top:1px solid #EEE;
}
#globalFooterCorp {
border-top:1px solid #DDD;
padding:11px 15px 8px;
}
/*---------------------------------------------------------------------*/
/* カラムボックスカスタム */
/*---------------------------------------------------------------------*/
.colBox a:hover {
color:#777;
}
.colBoxHead {
margin:0 0 5px;
padding:10px 10px 8px 2px;
border-bottom:3px solid #333;
color:#555;
}
.colBoxHead h2 {
font-size:14px;
line-height:19px;
}
#masterMain .colBoxHead h2 {
font-size:17px;
line-height:20px;
}
.colBoxSenna .colBoxHead {
display:none;
}
.colBoxHeadSubtxt {
top:10px;
right:10px;
}
.colBoxInner {
padding:10px 0;
}
.colBoxIndex {
margin:0 0 15px;
padding:0;
}
#masterMain .colBoxSubTitle div,
#masterMain .colBoxSubTitle h5 {
display:block;
color:#666;
font-size:14px;
line-height:18px;
font-weight:normal;
}
.colBoxTitle h3 {
font-size:22px;
line-height:32px;
font-weight:normal;
}
#masterMainLeft .colBoxTitle h3 {
font-size:17px;
line-height:22px;
}
#masterSub .colBoxTitle h3 {
font-size:14px;
line-height:20px;
}
.colBoxDescription {
margin:0 0 10px;
}
.colBoxDescription p {
font-size:13px;
line-height:18px;
}
.colBoxLeft .colBoxIcon a,
.colBoxIcon a {
margin:0 10px 10px 0;
}
#masterSub .colBoxIcon a {
margin:0 5px 5px 0;
}
.colBoxUlist ul,
.colBoxOlist ol {
font-size:14px;
line-height:18px;
}
.colBoxUlist ul li,
.colBox .backNumBoxIn ul li {
background:url(http://image.itmedia.co.jp/images/ulli_document1.gif) no-repeat 0 6px;
margin:0;
padding:6px 0 6px 20px;
}
.colBoxInfo .colBoxDate {
font-size:12px;
line-height:16px;
color:#999;
}
#masterSub .colBoxTable {
margin:0 0 10px;
}
#masterMain .colBoxPageLink {
padding:0 10px 10px;
}
#masterSub .colBoxPageLink {
padding:3px 10px;
}
.colBoxNewtxt {
font-size:78%;
padding-left:3px;
}
/* 右カラムツイートボタン */
.TwitterLink {
width:300px;
}
#masterSub .TwitterLink .colBoxOuter {
background:none;
border:none;
}
#masterSub .TwitterLink .colBoxInner {
padding:0;
font-size:12px;
line-height:32px;
font-weight:bold;
text-align:left;
border:1px solid #000;
background:#121212;
border-radius:3px;
-webkit-border-radius:3px;
-moz-border-radius:3px;
}
#masterSub .TwitterLink .colBoxIndex {
background:url(http://image.itmedia.co.jp/images0509/rc_twitter_icon.gif) no-repeat scroll 6px 7px;
margin:0;
padding:2px 0 0 45px;
border-bottom:none;
}
#masterSub .TwitterLink .colBoxIndex a {
color:#FFF;
text-decoration:none;
}
/* カレンダー */
.colBoxCalendar .colBoxInner {
margin:0;
padding:0;
}
.colBoxCalendar .colBoxIndex {
border-radius:0;
box-shadow:none;
border-bottom:none;
float:left;
height:100px;
margin:0;
padding:0 0 0 3px;
width:140px;
}
.colBoxCalendar .colBoxUlist ul li a {
display:block;
float:left;
width:25px;
margin:0 2px 2px;
padding:2px;
background:#fff;
border:1px solid #ddd;
text-align:center;
font-size:10px;
line-height:14px;
}
.colBoxCalendar .colBoxUlist ul li a:hover {
background:#ddd;
text-decoration:none;
}
#masterSub .colBoxCalendar .colBoxIndex {
display:none;
}
#masterSub .colBoxCalendar .colBoxIndex.colBoxCount1,
#masterSub .colBoxCalendar .colBoxIndex.colBoxCount2,
#masterSub .colBoxCalendar .colBoxIndex.colBoxCount3,
#masterSub .colBoxCalendar .colBoxIndex.colBoxCount4 {
display:block;
margin:0 10px 0 0;
padding:0;
}
#masterSub .colBoxCalendar .colBoxOuter {
background:none;
border:none;
}
#masterSub .colBoxCalendar .h10px,
#masterSub .colBoxITMID .h10px {
height:0;
}
/* アクセスランキング */
#masterSub .colBoxRanking .colBoxInner {
padding:5px 0;
}
#masterSub .colBoxRanking .colBoxIndex {
position:relative;
margin:0;
padding:0;
}
.colBoxRanking .colBoxSubhead {
background:none;
font-size:11px;
line-height:12px;
position:absolute;
right:2px;
top:-30px;
color:#656565;
}
.colBoxRanking .colBoxOlist ol li {
margin:0 0 6px;
padding:0 3px 4px 34px
}
.colBoxRanking .colBoxOlist ol li span {
display:block;
text-align:right;
font-size:11px;
line-height:14px;
color:#999;
}
/* 共通タブ */
.colBox.colBoxTab {
margin:0;
padding:0;
}
.colBoxTab .colBoxOuter {
background:none;
border:none;
}
/* 更新表示 */
.colBoxUpdating {
padding:5px 3px 1px;
margin-bottom:0;
float:right;
font-size:12px;
line-height:16px;
}
.colBoxUpdating .colBoxInfo .colBoxDate {
font-size:12px;
line-height:16px;
}
#masterMain .colBoxUpdating .colBoxInner {
padding:0;
}
.arrow {
color:#F60;
font-weight:bold;
font-size:12px;
line-height:16px;
}
.colBoxUpdating .colBoxOuter {
background:none;
border:none;
}
/*---------------------------------------------------------------------*/
/* 拡大画像 */
/*---------------------------------------------------------------------*/
.colBoxLargeImage .colBoxOuter {
background:none;
border:none;
}
/*---------------------------------------------------------------------*/
/* QuickPoll */
/*---------------------------------------------------------------------*/
#cmsBody .colBoxQuickPoll {
width:80%;
margin:0 auto 10px;
}
.colBoxQuickPoll form {
height:1%; /* for IE */
margin:0;
}
#masterSub .colBoxQuickPoll .colBoxTitle h3,
#cmsBody .colBoxQuickPoll .colBoxTitle h3 {
color:#444;
margin:0 0 15px;
padding:0 0 0 24px;
border-bottom:1px dotted #DDD;
border-left:none;
font-size:14px;
line-height:23px;
background:url(http://image.itmedia.co.jp/nl/images/heading_qp5.gif) no-repeat 0 3px;
}
.colBoxQuickPoll form label {
float:left;
margin:0 0 0 5px;
padding:0;
font-size:12px;
line-height:14px;
}
.colBoxQuickPoll .colBoxGraph {
clear:both;
display:block;
margin:0 0 10px 0;
padding:2px 3px;
border:1px solid #ceb70d;
background:url(http://image.itmedia.co.jp/ebook/images/qp_bar.gif) repeat-x center center #f7e881;
font-size:10px;
line-height:12px;
text-align:center;
color:#272302;
}
.colBoxQuickPoll .colBoxInfo {
margin:10px 0;
padding:0;
background:none;
font-size:10px;
line-height:12px;
color:#C00;
text-align:center;
}
.colBoxQuickPoll .colBoxInfo p {
text-align:left;
}
#cmsBody .colBoxQuickPoll .colBoxInfo p {
font-size:10px;
line-height:12px;
}
.colBoxQuickPoll .colBoxIndex input {
clear:both;
float:left;
height:16px;
margin:0;
padding:0;
vertical-align:middle;
}
.colBoxQuickPoll .colBoxIndex .colBoxInfoBtn input {
float:none;
}
/*---------------------------------------------------------------------*/
/* 汎用ソーシャルパーツ */
/*---------------------------------------------------------------------*/
#masterMain .colBoxCsbBtn .colBoxInner {
padding:5px;
}
.colBoxCsbBtn .csbBtn {
float:left;
margin:0 10px 0 0;
}
/* メルマガ告知バナー 20161101 */
.colBoxMailmagazineBanner .colBoxOuter {
background:transparent;
border:none;
}
#masterSub .colBoxMailmagazineBanner .colBoxInner {
padding:0;
}
#masterSub .colBoxMailmagazineBanner .colBoxIndex {
padding:0;
}
.colBoxMailmagazineBanner a {
display:block;
}