body {
font-family:Meiryo, 'メイリオ', ArialMT, Hiragino Kaku Gothic Pro, 'ヒラギノ角ゴ Pro W3', Osaka, Verdana, 'ＭＳ Ｐゴシック';
-webkit-text-size-adjust:none;
margin:0;
padding:0;
}
a:link {
text-decoration:none;
color:#333;
}
a:visited {
text-decoration:none;
color:#333;
}
a:hover {
text-decoration:underline;
color:#C00;
}
/*---------------------------------------------------------------------*/
/* レイアウト */
/*---------------------------------------------------------------------*/
#masterHeader {
padding-bottom:20px;
background:#000;
color:#CCC;
}
#masterMain {
clear:both;
width:690px;
}
#masterSub {
width:300px;
overflow:hidden;
}
#masterBody {
width:100%;
margin:0 auto;
background:#FFF;
}
#masterContents {
width:100%;
margin:0 auto;
padding:15px 0 20px;
background:#FFF;
}
@media screen and (max-width:480px) { 
  #masterMain {
    width:300px;
    margin:0 auto 50px;
  }
  #masterSub {
    width:300px;
    margin:0 auto;
  }
}
@media screen and (min-width:480px) and ( max-width:768px) {
  #masterMain {
    width:480px;
    margin:0 auto 50px;
  }
  #masterSub {
    width:480px;
    margin:0 auto;
  }
}
@media screen and (min-width:768px) and ( max-width:1010px) {
  #masterMain {
    margin:0 auto 50px;
  }
  #masterSub {
    width:690px;
    margin:0 auto;
  }
}
@media screen and (min-width:1010px) {
  #masterContents {
    width:1010px;
  }
  #masterMain {
    float:left;
  }
  #masterSub {
    width:300px;
    float:right;
  }
}
/*---------------------------------------------------------------------*/
/* カラムボックス */
/*---------------------------------------------------------------------*/
.colBox {
margin-bottom:10px;
width:auto;
box-sizing:border-box;
}
.colBox a:link,
.colBox a:visited {
text-decoration:none;
}
.colBox a:hover {
text-decoration:underline;
color:#C00;
}
.colBoxOuter {}
.colBoxHead {
position:relative;
border-bottom:1px solid #CCC;
margin:0 0 5px;
padding:0 0 3px;
}
.colBoxHeadSubtxt {
position:absolute;
top:3px;
right:0;
font-size:10px;
line-height:14px;
}
.colBoxNewtxt {
font-weight:bold;
color:#C00;
}
.colBoxHead h2 {
font-size:18px;
line-height:22px;
margin:0;
}
#masterSub .colBoxHead h2 {
font-size:14px;
line-height:18px;
margin:0;
}
.colBoxSubhead {
background:#EEE;
margin:0 0 5px;
padding:3px;
}
.colBoxSubhead h4 {
font-size:12px;
line-height:16px;
margin:0;
}
.colBoxIcon {
display:inline;
}
.colBoxIcon img {
margin:0;
}
.colBoxSubTitle {
margin:0 0 3px;
}
.colBoxSubTitle h5 {
font-size:12px;
line-height:16px;
margin:0;
color:#A73;
}
.colBoxTitle {
margin:0 0 15px;
}
.colBoxTitle h3 {
font-size:18px;
line-height:24px;
margin:0;
}
#masterSub .colBoxTitle h3 {
font-size:13px;
line-height:17px;
}
.colBoxDescription {
margin:0 0 3px;
}
.colBoxDescription p {
font-size:13px;
line-height:22px;
margin:0;
}
.colBoxButton {
width:150px;
margin:0 auto;
border:1px solid #CCC;
border-radius:2px;
-webkit-border-radius:2px;
-moz-border-radius:2px;
}
.colBoxButton a {
display:block;
padding:5px;
font-size:14px;
font-weight:bold;
text-align:center;
}
.colBoxButton a:link,
.colBoxButton a:visited,
.colBoxButton a:hover {
color:#777;
text-decoration:none;
}
.colBoxButton a:hover {
background:#eee;
}
.colBoxIndex .linkset {
clear:both;
margin:0 0 3px;
padding:0;
list-style-type:none;
}
.colBoxIndex .linkset li {
font-size:12px;
line-height:16px;
margin:0;
padding:0 0 3px 12px;
background:url(//image.itmedia.co.jp/images/ulli_book0.gif) no-repeat 0 2px;
}
.colBoxInfo {
margin:0 10px;
font-size:10px;
color:#777;
text-align:right;
}
.colBoxInfo::before {
content:"- ";
}
.colBoxInfo a {
color:#777;
}
.colBoxInfo .colBoxDate {
font-size:10px;
line-height:14px;
}
.colBoxInfo .colBoxLinktxt {
font-size:12px;
line-height:16px;
}
.colBoxClear {
font-size:0;
line-height:0;
height:0;
clear:both;
}
.colBoxUlist {}
.colBoxUlist ul {
clear:both;
font-size:12px;
line-height:16px;
margin:0;
padding:0;
list-style-type:none;
}
.colBoxUlist ul li {
margin:0 0 3px;
padding:0 0 3px 14px;
background:url(//image.itmedia.co.jp/images/ulli_book0.gif) no-repeat 0 2px;
border-bottom:1px dotted #CCC;
}
/*---------------------------------------------------------------------*/
/* ITmedia ロゴ */
/*---------------------------------------------------------------------*/
.logo-itmedia {
position:relative;
margin:0 auto;
z-index:1;
}
.logo-itmedia a {
position:absolute;
top:17px;
left:17px;
display:block;
width:80px;
height:20px;
background:url(//image.itmedia.co.jp/topics/1707/blockchain/images/logo_itm.png) no-repeat 0 0;
background-size:contain;
text-indent:-9999px;
}
@media screen and (max-width:768px) { 
  .logo-itmedia a {
    width:50px;
  }
}
@media screen and (min-width:1010px) {
  .logo-itmedia {
    width:1010px;
  }
}
/*---------------------------------------------------------------------*/
/* ヘッダー タイトル */
/*---------------------------------------------------------------------*/
#topicsTitle {
width:100%;
min-width:320px;
height:435px;
margin:0 auto;
}
#topicsTitle h1 {
width:100%;
height:100%;
margin:0;
padding:0;
text-align:center;
color:#999;
background-image:url(//image.itmedia.co.jp/topics/1707/blockchain/images/topics_title.jpg);
background-size:cover;
background-position:50% 50%;
background-repeat:no-repeat;
text-indent:-9999px;
}
@media screen and (max-width:480px) { 
  #topicsTitle {
    height:130px;
  }
}
@media screen and (min-width:480px) and ( max-width:768px) {
  #topicsTitle {
    height:150px;
  }
}
@media screen and (min-width:768px) and ( max-width:1024px) {
  #topicsTitle {
    height:200px;
  }
}
@media screen and (min-width:1024px) {
  #topicsTitle {
    height:435px;
    overflow:hidden;
  }
  #topicsTitle h1 {
    max-width:100%;
    animation: imageAnimation 10s linear 1 0s;
    transform: scale(1.1);
  }
}
@keyframes imageAnimation { 
	0% { opacity:0; transform: scale(1.0); animation-timing-function:ease-in; }
	30% { opacity:1; transform:scale(1.05); animation-timing-function:ease-out;}
	80% { opacity:1; transform: scale(1.08); }
	95% { opacity:1; transform: scale(1.1); }
	100% { opacity:1; }
}
/*---------------------------------------------------------------------*/
/* ヘッダー ABOUT */
/*---------------------------------------------------------------------*/
#topicsAbout {
width:100%;
max-width:1010px;
min-width:320px;
margin:0 auto;
}
#topicsAboutInner p {
font-size:14px;
line-height:26px;
text-align:left;
margin:30px 0 20px;
}
@media screen and (max-height:600px) { 
  #topicsAboutInner {
    padding:20px;
    max-height:90%;
  }
}
@media screen and (max-width:480px) { 
  #topicsAboutHead {
    padding:10px 20px 0;
  }
  #topicsAboutHead h2 {
    margin:0;
  }
  #topicsAboutInner {
    width:280px;
    margin:0 auto 50px;
    padding:15px;
  }
  #topicsAboutInner p {
    font-size:13px;
    line-height:20px;
  }
}
@media screen and (min-width:480px) and ( max-width:768px) {
  #topicsAboutHead {
    padding:10px 20px 0;
  }
  #topicsAboutHead h2 {
    margin:0;
  }
  #topicsAboutInner {
    padding:20px;
    max-height:90%;
  }
  #topicsAboutInner p {
    font-size:13px;
    line-height:20px;
  }
}
/*---------------------------------------------------------------------*/
/* ヘッダー PickUP 枠 */
/*---------------------------------------------------------------------*/
.colBoxPickUp {
width:98%;
margin:0 auto;
}
.colBoxPickUpCategory {
width:49%;
float:left;
}
.colBoxPickUpCategory:nth-child(2n) {
float:right;
}
.colBoxPickUp .colBoxOuter {
width:495px;
-webkit-overflow-scrolling: touch;
}
.colBoxPickUp .colBoxOuter > * {
  -webkit-transform: translateZ(0px);
}
.colBoxPickUp .colBoxHead {
position:relative;
padding:16px 0 0 0;
}
.colBoxPickUp .colBoxHead::before {
content: 'PickUp';
position:absolute;
top:0;
right:0;
color:#D8D8D4;
font-size:30px;
}
.colBoxPickUp .colBoxIndex {
float:left;
width:240px;
height:220px;
margin:0 15px 15px 0;
background:#FFF;
overflow:hidden;
}
.colBoxPickUp .colBoxIndex:last-child {
margin:0 0 15px 0;
}
.colBoxPickUp .colBoxTitle {
margin:0;
}
.colBoxPickUp .colBoxTitle h3 {
font-size:13px;
line-height:20px;
margin:0;
padding:7px 10px;
}
.colBoxPickUp .colBoxTitle h3 a {
color:#333;
}
/* for タイトルカット */
.colBoxPickUp .colBoxTitle {
overflow:hidden;
height:50px;
}
.colBoxPickUp .colBoxTitle h3 {
position:relative;
overflow:hidden;
height:50px;
padding-right:11px;
}
.colBoxPickUp .colBoxTitle h3::before {
position:absolute;
content:"…";
top:31px;
right:10px;
font-size:10px;
color:#333;
}
.colBoxPickUp .colBoxTitle h3::after {
background:#fff;
position:absolute;
content:"";
height:100%;
width:100%;
}
.colBoxPickUp .colBoxIcon a {
display:block;
height:150px;
overflow:hidden;
}
.colBoxPickUp .colBoxIcon img {
width:240px;
height:180px;
}
@media screen and (min-width:480px) and (max-width:768px) {
  .colBoxPickUp .colBoxOuter {
    width:auto;
  }
  .colBoxPickUp .colBoxIndex:last-child,
  .colBoxPickUp .colBoxIndex {
    float:inherit;
    margin:0 auto 15px;
  }
  .colBoxPickUp .colBoxHead::before {
    display:none;
  }
}
@media screen and (max-width:480px) { 
  .colBoxPickUpCategory {
    width:100%;
    overflow-x:auto;
    overflow-y:hidden;
    -webkit-overflow-scrolling:touch;
  }
  .colBoxPickUp .colBoxOuter {
    width:510px;
  }
  .colBoxPickUp .colBoxHead::before {
    display:none;
  }
  .colBoxPickUp .colBoxIndex:last-child,
  .colBoxPickUp .colBoxIndex {
    float:left;
    margin:0 15px 15px 0;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .colBoxPickUp .colBoxOuter {
    width:auto;
  }
  .colBoxPickUp .colBoxIndex {
    width:47%;
  }
  .colBoxPickUp .colBoxIcon img {
    width:100%;
    height:auto;
  }
}
@media screen and (min-width:1024px) {
  .colBoxPickUp {
    width:1010px;
  }
}
/*---------------------------------------------------------------------*/
/* メインカラム 新着記事枠 */
/*---------------------------------------------------------------------*/
#colBoxArticlesNav {
position:relative;
margin:30px auto 50px auto;
padding:0 0 15px 0;
text-align:center;
}
#colBoxArticlesNav a {
position:relative;
width:160px;
margin:0 10px;
padding:10px;
color:#333;
text-decoration:none;
font-size:18px;
font-weight:bold;
}
#colBoxArticlesNav span {
position:absolute;
left:0;
bottom:0;
display:block;
width:50px;
height:5px;
background:#000;
}
/*
#colBoxArticlesNav a:nth-child(2)::after {
content:'Business';
}
#colBoxArticlesNav a:nth-child(3)::after {
content:'Infrastructure';
}
#colBoxArticlesNav a:nth-child(2)::after,
#colBoxArticlesNav a:nth-child(3)::after {
position:absolute;
width:160px;
bottom:-5px;
right:0;
color:#ccc;
font-weight:normal;
font-size:14px;
}
*/
.colBoxArticles .colBoxHead {
display:none;
}
.colBoxArticles .colBoxIndex {
position:relative;
margin:0 0 20px;
}
.colBoxArticles .colBoxIndexLeft {
float:left;
width:100px;
}
.colBoxArticles .colBoxIndexRight {
float:right;
width:580px;
}
.colBoxArticles .colBoxArticleType {
float:left;
width:90px;
margin:0 10px 10px 0;
padding:2px 0;
background:#A01C1C;
color:#FFF;
font-size:12px;
text-align:center;
}
.colBoxArticles .type-interview .colBoxArticleType {
background:#1C57A0;
}
.colBoxArticles .type-casestudy .colBoxArticleType {
background:#1199AF;
}
.colBoxArticles .type-feature .colBoxArticleType {
background:#E0B61B;
}
.colBoxArticles .type-trend .colBoxArticleType {
background:#754478;
}
.colBoxArticles .colBoxImage {
text-align:center;
}
.colBoxArticles .colBoxImage img {
max-width:600px;
height:auto;
margin:0 auto;
}
.colBoxArticles .colBoxIcon {
float:left;
}
.colBoxArticles .colBoxIcon a {
display:block;
height:150px;
overflow:hidden;
}
.colBoxArticles .colBoxIcon img {
width:240px;
height:180px;
margin:0 15px 15px 0;
}
#ISTLC .colBoxOuter {
margin-bottom:20px;
border-bottom:1px #ddd solid;
}
#ISTLC .colBoxHead {
display:none;
}
#ISTLC .colBoxInner {
padding-top:30px;
border-top:1px #ddd solid;
}
#ISTLC .colBoxIndex {
position:relative;
}
#ISTLC .colBoxTitle::before {
content:'SPECIAL';
float:left;
width:90px;
margin:0 20px 10px 0;
padding:2px 0;
background:#27A208;
color:#FFF;
font-size:12px;
text-align:center;
}
#ISTLC .colBoxTitle::after {
content:'PR';
position:absolute;
top:0;
right:0;
color:#999;
font-size:12px;
font-weight:bold;
}
#ISTLC .colBoxIcon {
margin:0 0 0 110px;
}
#ISTLC .colBoxIcon a {
height:inherit;
}
#ISTLC .colBoxIcon img {
width:inherit;
height:inherit;
}
#ISTLC .colBoxNewtxt {
margin:0 0 0 7px;
font-size:16px;
}
@media screen and (min-width:480px) and (max-width:768px) {
  #colBoxArticlesNav {
    display:none;
  }
}
@media screen and (max-width:480px) { 
  #colBoxArticlesNav {
    display:none;
  }
  .colBoxArticles .colBoxArticleType {
    float:none;
  }
  .colBoxArticles .colBoxIndexLeft {
    float:none;
    width:100px;
  }
  .colBoxArticles .colBoxIndexRight {
    float:none;
    width:300px;
  }
  .colBoxArticles .colBoxImage img {
    max-width:300px;
  }
  .colBoxArticles .colBoxIcon a {
    height:inherit;
  }
  .colBoxArticles .colBoxIcon img {
    width:80px;
    height:60px;
  }
  #ISTLC .colBoxIcon {
    margin:0;
  }
}
@media screen and (min-width:480px) and ( max-width:768px) {
  .colBoxArticles .colBoxIndexRight {
    width:380px;
  }
  .colBoxArticles .colBoxImage img {
    max-width:480px;
  }
  .colBoxArticles .colBoxIcon img {
    width:160px;
    height:120px;
  }
}
/*---------------------------------------------------------------------*/
/* サイドカラム レクタングル */
/*---------------------------------------------------------------------*/
#ITR {
margin:0 0 20px;
}
@media screen and (min-width:480px) and ( max-width:768px) {
  #ITR {
    width:300px;
    margin:0 auto 20px;
  }
}
@media screen and (min-width:768px) and ( max-width:1010px) {
  #ITR {
    width:300px;
    margin:0 20px 20px;
    float:left;
  }
}
/*---------------------------------------------------------------------*/
/* サイドカラム 関連記事 */
/*---------------------------------------------------------------------*/
.colBoxRecommend .colBoxIcon img {
margin:0 7px 10px 0;
}
@media screen and (min-width:768px) and ( max-width:1010px) {
  .colBoxRecommend {
    width:300px;
    margin:0 20px 10px;
    float:left;
  }
}
/*---------------------------------------------------------------------*/
/* サイドカラム スポンサー枠 */
/*---------------------------------------------------------------------*/
.colBoxSponsors .colBoxHead {
margin:0 0 10px;
}
.colBoxSponsors .colBoxUlist li {
margin:0 0 15px;
padding:0;
background:inherit;
border-bottom:none;
}
.colBoxSponsors .colBoxUlist li a {
display:block;
text-align:center;
}
.colBoxSponsors .colBoxUlist li img {
max-width:300px;
margin:0 auto;
}
@media screen and (min-width:768px) and ( max-width:1010px) {
  .colBoxSponsors {
    width:300px;
    margin:0 20px 10px;
    float:left;
  }
}
/*---------------------------------------------------------------------*/
/* 共通フッタ（簡易版） */
/*---------------------------------------------------------------------*/
#globalFooterLink {
width:100%;
height:1%;
margin:0 auto 10px;
padding:0;
font-size:10px;
line-height:14px;
text-align:right;
}
#globalFooterCorp {
clear:both;
width:100%;
margin:0 auto 15px;
padding:10px 0 0;
border-top:1px solid #DDD;
}
#globalFooterCorpIn {
}
#globalFooterCorp p a:link,
#globalFooterCorp p a:visited {
}
#globalFooterCorpLogo {
position:relative;
display:block;
height:1%;
margin:0 0 5px;
padding:12px 0 0 180px;
font-size:12px;
line-height:16px;
}
#globalFooterCorpLogo a {
position:absolute;
top:0;
left:0;
display:block;
width:170px;
height:28px;
background:url(//image.itmedia.co.jp/images/logo/170_itmedia_bgw.gif) no-repeat 0 0;
text-indent:-9999px;
float:left;
}
#globalFooterCorpLink {
margin:0;
font-size:12px;
line-height:16px;
clear:both;
}
@media screen and (min-width:1010px) {
  #globalFooterLink {
    width:970px;
  }
  #globalFooterCorp {
    width:970px;
  }
}