/*---------------------------------------------------------------------*/
/* レイアウト */
/*---------------------------------------------------------------------*/
.tmplArticle {
padding:10px;
}
.tmplArticleIn {
padding:0 0 10px;
}
/*---------------------------------------------------------------------*/
/* 記事要素 */
/*---------------------------------------------------------------------*/
#cmsTitle {
margin:0 0 10px;
padding:5px 0 0;
border-bottom:4px solid #418FC1;
}
#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;
color:#666 !important;
}
/* タイトルレイアウト変更 */
.title {
color: #333;
}
/* タイトルレイアウト変更 */
/*---------------------------------------------------------------------*/
/* 記事本文 */
/*---------------------------------------------------------------------*/
#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 #418FC1;
clear:none;
}
#cmsBody h4,
#cmsBody h3.format--subheading {
border-bottom:1px solid #418FC1;
clear:none;
}
#cmsBody p a {
color:#1E598E;
}
#cmsBody .box {
clear:both;
padding:1px;
}
#cmsBody .box p {
padding:5px;
}
#cmsBody #cmsMark img {
margin:0 0 5px;
float:left;
}
#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:#CEE7F5;
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;
}
/*---------------------------------------------------------------------*/
/* ソーシャルボタン */
/*---------------------------------------------------------------------*/
#masterSocialbuttonBtm {
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:6px;
right:4px;
font-family:Arial;
color:#666;
}
/*---------------------------------------------------------------------*/
/* 新着記事 */
/*---------------------------------------------------------------------*/
#masterMain .colBoxNewArticles .colBoxHead {
border-bottom:1px #aaa solid;
}
.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:110px;
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;
width:110px;
height:auto;
}
/*---------------------------------------------------------------------*/
/* 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/smartjapan/images/mail.png) no-repeat 0 0;
background-color:#418FC1;
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;
}

/* 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 #408cb3;
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;
}