/*---------------------------------------------------------------------*/
/* レイアウト */
/*---------------------------------------------------------------------*/
.tmplArticle{
padding:10px;
}
.tmplArticleIn{
padding:0 0 16px;
}
/*---------------------------------------------------------------------*/
/* 記事要素 */
/*---------------------------------------------------------------------*/
#cmsTitle {
margin:0 0 10px;
padding:0 2px;
}
#cmsTitle h1 small {
color:#930;
margin-bottom:8px;
}
#cmsAbstract h2,
#cmsAbstract p {
color:#555;
line-height:22px;
font-weight:bold;
}
#cmsByline {
color:#555;
}
#tmplMark {
float:right;
margin:0 0 0 5px;
}
#tmplCopyright {
clear:both;
text-align:right;
}
#tmplCopyright p {
margin:0 0 20px;
}
#tmplCopyright p span {
font-size:10px !important;
line-height:14px !important;
font-family:Meiryo, 'メイリオ', 'ＭＳ Ｐゴシック', Osaka, 'ヒラギノ角ゴ Pro W3' !important;
color:#666 !important;
}
/*---------------------------------------------------------------------*/
/* 記事本文 */
/*---------------------------------------------------------------------*/
#cmsBody table#tbl50l,
#cmsBody table#tbl50r {
width:49%;
}
#cmsBody table#tbl75l,
#cmsBody table#tbl75r {
width:74%;
}
#cmsBody table#tbl25l,
#cmsBody table#tbl25r {
width:24%;
}
#cmsBody table#tbl100l{
float:none;
}
#cmsBody table#tbl th#txr,
#cmsBody table#tbl td#txr {
text-align:right;
}
#cmsBody h3:not(.format--subheading),
#cmsBody h2.format--crosshead {
border-bottom:2px solid #A01013;
clear:none;
}
#cmsBody h4,
#cmsBody h3.format--subheading {
border-bottom:1px solid #A01013;
clear:none;
}
#cmsBody p a {
color:#1E598E;
}
#cmsBody .box {
clear:both;
padding:1px;
}
#cmsBody .box p {
padding:5px;
}
#cmsMark,
#cmsBody #cmsMark {
margin:0 0 5px 10px;
}
#cmsMark img,
#cmsBody #cmsMark img {
border:none;
}
#cmsBody .box h4,
#cmsBody .box h3.format--subheading {
border-bottom:none;
}
#cmsBody .endlink h4,
#cmsBody .endlink h3.format--subheading {
color:#333;
font-size:14px;
line-height:18px;
margin:0 0 3px;
padding:0 0 3px;
border-bottom:2px solid #ccc;
}
#cmsBody .endlink ul {
border-top:none;
display:table;
width:100%;
}
#cmsBody .endlink li {
background:none;
padding-left:0;
}
#cmsBody .endlink li a {
font-size:16px;
line-height:24px;
}
#cmsBody .endlink li a img {
width:80px;
height:60px;
}
#cmsBody .endkwd {
padding:3px;
border:1px solid #ddd;
}
#cmsBody .endkwd .box {
border:none;
}
#cmsBody .endkwd .box h3:not(.format--subheading),
#cmsBody .endkwd .box h2.format--crosshead {
margin:0 0 5px;
padding:3px 5px;
background:#FFF;
color:#555;
box-shadow:none;
border-bottom:1px solid #ddd;
}
#cmsBody .endkwd .box h4,
#cmsBody .endkwd .box h3.format--subheading {
line-height:22px;
}
/* nextpage */
#cmsBody #notice.nextpage {
background:#e3bbbd;
font-size:15px;
margin:0 0 25px;
padding:0;
text-align:center;
}
#cmsBody #notice.nextpage a {
color:#333;
display:block;
padding:9px 0;
text-decoration:none;
}
#cmsBody #notice.nextpage a span {
margin:0 15px;
font-weight:normal;
color:#4D4D4D;
}
#cmsBody #notice.nextpage a span span.nextpage-arrow {
margin:0 6px 0 0;
padding:1px 3px;
background:#4D4D4D;
font-size:12px;
color:#fff;
border-radius:2px;
}
/*---------------------------------------------------------------------*/
/* マスク記事用 */
/*---------------------------------------------------------------------*/
#masterMain .colBoxMembersControl .colBoxHead {
border-bottom:1px solid #FFF;
}
/*---------------------------------------------------------------------*/
/* ソーシャルボタン */
/*---------------------------------------------------------------------*/
#masterSocialbuttonBtm {
display:none;
}
/*---------------------------------------------------------------------*/
/* BCP Text */
/*---------------------------------------------------------------------*/
.colBoxBcpSympathy{
margin:0;
}
.colBoxBcpSympathy .colBoxOuter {
float:left;
width:280px;
margin-top:15px;
}
.colBoxBcpSympathy .colBoxInner {
clear:both;
border:3px solid #666;
margin-bottom:20px;
padding:5px;
}
#cmsBody .colBoxBcpSympathy .colBoxInner h3:not(.format--subheading),
#cmsBody .colBoxBcpSympathy .colBoxInner h2.format--crosshead{
background-color:#666;
color:#FFF;
font-size:12px;
line-height:18px;
margin:0 0 5px;
padding:3px;
border:none;
clear:none;
}
#cmsBody .colBoxBcpSympathy .colBoxInner p{
font-size:12px;
line-height:18px;
margin:0 0 5px;
word-wrap:break-word;
}
#cmsBody .colBoxBcpSympathy .colBoxInner .colBoxDescription{
font-weight: bold;
}
#cmsBody .colBoxBcpSympathy .colBoxInner .colBoxByline{
margin-top: 15px;
}
/*---------------------------------------------------------------------*/
/* colBox カスタム */
/*---------------------------------------------------------------------*/
.colBoxIndexlink {
margin-bottom:20px;
}
.colBoxIndexlink .colBoxUlist ul {
text-align:right;
}
.colBoxIndexlink .colBoxUlist li {
display:inline;
margin:0 10px 0 0;
padding:5px 15px;
border:2px solid #CCC;
background:#EEE;
background:-webkit-gradient(linear, left top, left bottom, from(#FFF), to(#EEE));
background:-moz-linear-gradient(top, #FFF, #EEE);
-webkit-box-shadow:2px 2px 3px #EEE;
-moz-box-shadow:2px 2px 3px #EEE;
box-shadow:2px 2px 3px #EEE;
font-weight:bold;
}
.colBoxIndexlink .colBoxUlist li::after {
display:none;
}
/*---------------------------------------------------------------------*/
/* TechFactory ホワイトペーパー新着情報 */
/*---------------------------------------------------------------------*/
.colBoxMonoLibrary {
margin:24px 0;
}
.colBoxMonoLibrary .colBoxHead a:link,
.colBoxMonoLibrary .colBoxHead a:visited {
color:#000;
}
.colBoxMonoLibrary .colBoxHead a:hover,
.colBoxMonoLibrary .colBoxHead a:active {
color:#C00417;
}
.colBoxMonoLibrary .prmark{
position:absolute;
border:#CCC 1px solid;
background-color:#FFF;
padding:2px;
font-weight:400;
font-size:11px;
line-height:13px;
top:0;
right:4px;
font-family:Arial;
color:#666;
}
/*---------------------------------------------------------------------*/
/* 新着記事 */
/*---------------------------------------------------------------------*/
.colBoxNewArticles .colBoxInner {
display:table;
table-layout:fixed;
width:100%;
font-size:13px;
line-height:20px;
}
.colBoxNewArticles .colBoxIndex {
display:table-cell;
}
.colBoxNewArticles .colBoxTitle {
clear:both;
}
.colBoxNewArticles .colBoxTitle h3 {
position:relative;
width:120px;
height:60px;
padding-right:10px;
font-size:12px;
line-height:20px;
font-weight:normal;
overflow:hidden;
}
.colBoxNewArticles .colBoxTitle h3::before {
position:absolute;
content:"…";
top:45px;
right:0;
font-size:10px;
}
.colBoxNewArticles .colBoxTitle h3::after {
background:#FFF;
position:absolute;
content:"";
height:100%;
width:100%;
}
.colBoxNewArticles .colBoxIcon img {
margin:0;
}
/*---------------------------------------------------------------------*/
/* TechFactory 新着記事 */
/*---------------------------------------------------------------------*/
.colBoxTFArticles {
margin-bottom:20px;
}
.colBoxTFArticles .colBoxHead a:link,
.colBoxTFArticles .colBoxHead a:visited {
color:#000;
}
.colBoxTFArticles .colBoxHead a:hover,
.colBoxTFArticles .colBoxHead a:active {
color:#C00417;
}
.colBoxTFArticles .colBoxUlist ul {
padding:2px 0 0 0;
}
.colBoxTFArticles .colBoxUlist li {
display:table;
width:100%;
padding:4px 0 8px 0;
}
.colBoxTFArticles .colBoxUlist li::after {
display:none;
}
.colBoxTFArticles .colBoxUlist a span {
display:block;
float:left;
width:40px;
height:30px;
margin:0 5px 0 0;
border:1px solid #EEE;
vertical-align:middle;
background-repeat:no-repeat;
background-position:center center;
background-size:cover;
}

/*---------------------------------------------------------------------*/
/* 記事下「連載記事アラート」ボタン */
/*---------------------------------------------------------------------*/

#cmsBody .cmsBodyItmidSeriesButtonRegist {
text-align:center;
padding:0 30px 0 30px;
}
#cmsBody .cmsBodyItmidSeriesButtonRegist a {
display:block;
padding:16px;
background: url(https://image.itmedia.co.jp/mn/images/mail.png) no-repeat 0 0;
background-color:rgba(196, 77, 82, 1);
background-position:100px;
background-size:30px;
color:#FFF;
font-weight: bold;
text-indent: 30px;
border-radius:6px;
-moz-border-radius:6px;
-webkit-border-radius:6px;
-o-border-radius:6px;
-ms-border-radius:6px;
border-bottom:3px solid #BBB;
}
#cmsBody .cmsBodyItmidSeriesButtonRegist a:hover {
border-bottom:0;
border-top:3px solid #FFF;
text-decoration:none;
}

#cmsBody .cmsBodyItmidSeriesButtonRegist .colBoxNewtxt {
display:none;
}

/* 会員限定 */
#MembersOnlyCaution {
text-align:center;
border:1px solid #e7c400;
padding:5px;
margin-bottom:20px;
}
#MembersOnlyCaution p {
font-size:14px;
line-height:21px;
background:url(https://image.itmedia.co.jp/images/member_only_icon.png) no-repeat 0 0;
padding:0 0 0 24px;
display:inline;
}
#MembersOnlyCaution span {
font-weight:bold;
}

/*---------------------------------------------------------------------*/
/* 記事面サイド「印刷」「クリップ」「連載通知」ボタン */
/*---------------------------------------------------------------------*/
#colBoxSideButtons {
position:fixed;
bottom:15px;
margin-left:-96px;
visibility:hidden;
opacity:0;
transition-property: opacity, visibility;
transition-duration: 0.7s;
transition-timing-function: ease-out;
}
#colBoxSideButtonsInner {
position:relative;
width:70px;
}
#colBoxSideButtons #colBoxSideButtonsAlert,
#colBoxSideButtons #colBoxSideButtonsPrint {
width:70px;
height:70px;
margin:0 0 10px;
border-radius:8px;
border:3px #cbcbcb solid;
}
#colBoxSideButtons #colBoxSideButtonsAlert:before {
border-left: 12px solid #FFF;
content: "";
position: absolute;
top: 211px;
right: -12px;
margin-top: -7px;
border-left: 13px solid #FFF;
border-top: 8px solid #43202000;
border-bottom: 8px solid #43202000;
z-index: 2;
}
#colBoxSideButtons #colBoxSideButtonsPrint:before {
border-left: 12px solid #FFF;
content: "";
position: absolute;
top: 37px;
right: -12px;
margin-top: -7px;
border-left: 13px solid #FFF;
border-top: 8px solid #43202000;
border-bottom: 8px solid #43202000;
z-index: 2;
}
#colBoxSideButtons #colBoxSideButtonsAlert:after {
content: "";
position: absolute;
top:211px;
right: -17px;
margin-top: -8px;
border-left: 14px solid #cbcbcb;
border-top: 9px solid #43202000;
border-bottom: 9px solid #43202000;
z-index: 1;
}
#colBoxSideButtons #colBoxSideButtonsPrint:after {
content: "";
position: absolute;
top: 37px;
right: -17px;
margin-top: -8px;
border-left: 14px solid #cbcbcb;
border-top: 9px solid #43202000;
border-bottom: 9px solid #43202000;
z-index: 1;
}
#colBoxSideButtonsPrintBtn {
display:block;
width:70px;
height:70px;
background:#FFF url(https://image.itmedia.co.jp/images/socialbutton/SideBtnprinter.png) no-repeat 22px 13px;
background-size:30px;
border-radius:8px;
}
#colBoxSideButtonsInner #colBoxSideButtonsAlertSeriesBtn {
display:block;
width:70px;
height:70px;
background:#FFF url(https://image.itmedia.co.jp/images/socialbutton/SideBtnmail.png) no-repeat 24px 12px;
background-size:29px;
border-radius:8px;
}
#colBoxSideButtonsInner #colBoxSideButtonsAlertSeriesBtn span  {
top:44px;
left:12px;
font-size:12px;
position:relative;
color:#5b5b5b;
}
#colBoxSideButtonsInner #colBoxSideButtonsPrint a:hover,
#colBoxSideButtonsInner #colBoxSideButtonsAlertSeriesBtn a:hover {
text-decoration:none;
}
#colBoxSideButtonsInner #colBoxSideButtonsPrintBtn span  {
top:45px;
left:6px;
font-size:12px;
position:relative;
color:#5b5b5b;
}
#colBoxSideButtonsAlertSeriesBtn {
top:5px;
background:#FFF url(https://image.itmedia.co.jp/images/socialbutton/msbBtnAlertseries.gif) no-repeat 7px 7px;
}
#colBoxSideButtonsAlertBtn {
top:38px;
background:#FFF url(https://image.itmedia.co.jp/images/socialbutton/msbBtnAlert.gif) no-repeat 7px 7px;
}
#colBoxSideButtonsAlert a:hover {
text-decoration:none;
}
#colBoxSideButtonsAlert:hover {
overflow:inherit;
}
#colBoxSideButtonsAlert:hover a {
visibility:visible;
opacity:1;
}

/* 記事下TFWPレコメンド */
#colBoxTfwpRecomend{
background:#f4f3f3;
border-radius:6px;
margin:8px 0 30px 0;
position:relative;
clear:both;
}
.colBoxTfwpRecomendInner{
padding:8px;
background:#FFF;
border:12px solid #f4f3f3;
border-radius:16px;
}
#masterMain .colBoxTfwpRecomendInner p{
font-size:14px;
background:url(https://image.itmedia.co.jp/tf/images/tf_logo_1l.png) no-repeat 0 0 #FFF;
background-position:right 5px bottom 5px;
border-bottom:1px solid #c1c1c1;
padding:4px 4px 4px 8px;
margin:0 0 8px 0;
line-height:24px;
}
#masterMain .colBoxTfwpRecomendUlist ul{
list-style-type:none;
padding:0 8px 0 24px;
margin:0;
}
#masterMain .colBoxTfwpRecomendUlist li{
position:relative;
padding:4px 0 0 0;
line-height:24px;
margin:0;
left:0;
}
.colBoxTfwpRecomendUlist li::after {
display:block;
content:'';
position:absolute;
top:13.5px;
left:-1em;
width:4px;
height:4px;
background-color:#666;
border-radius:100%;
}
#masterMain .colBoxTfwpRecomendUlist a{
font-size:15px;
color:#1E598E;
font-weight:600;
}

#masterMain .colBoxTfwpRecomendUlist span:after {
content:'';
display:inline-block;
margin-left:8px;
vertical-align:middle;
background:url(https://image.itmedia.co.jp/tf/images/tf_tab.png) no-repeat 0 3px;
width:18px;
height:26px;
}
#colBoxSubChannelLogo{
margin:0 0 16px;
}

/* GAM */
#LogoAD{
clear:both;
display:none;
flex-wrap:wrap;
justify-content:space-between;
}
#LogoAD.delivery{
display:flex;
}
#LogoAD .laStyle{
margin-bottom:4px;
width:200px;
height:auto;
}
#BelowArtLink{
display:flex;
flex-wrap:wrap;
justify-content:space-between;
margin:0 0 16px 0;
}
#BelowArtLink.noad{
display:none;
}
#LogoAD .LogoADHead,
#BelowArtLink .gam_headline{
width:100%;
position:relative;
border-bottom:4px solid #A01013;
margin:0 0 10px;
padding:6px 2px;
clear:both;
font-size:14px;
line-height:18px;
font-weight:600;
}
#BelowArtLink .balStyle{
margin-bottom:4px;
}
#BelowArtLink .gam_prmark,
#LogoAD .LogoADHead .gam_prmark{
top:6px;
right:4px;
}
#InRead{
margin:8px auto 24px;
text-align:center;
width:640px;
}
#InRead .adnotation{
font-family:"Gill Sans";
font-size:12px;
line-height:12px;
color:#666;
text-align:center;
margin:8px 0px 4px;
}