body {
font-family:Meiryo, 'メイリオ', ArialMT, Hiragino Kaku Gothic Pro, 'ヒラギノ角ゴ Pro W3', Osaka, Verdana, 'ＭＳ Ｐゴシック';
-webkit-text-size-adjust:none;
margin:0;
padding:0;
background:#FFF;
color:#333;
}
a:link {
text-decoration:none;
color:#333;
}
a:visited {
text-decoration:none;
color:#666;
}
a:hover {
color:#CBDCEC;
}
img {
border:none;
}
/*---------------------------------------------------------------------*/
/* メディアリスト */
/*---------------------------------------------------------------------*/
.globalRelatedMediaList {
display:table;
width:100%;
}
.globalRelatedMediaList ul {
float:right;
margin:5px 10px;
padding:0;
list-style-type:none;
}
.globalRelatedMediaList ul li {
float:left;
width:80px;
height:25px;
margin:0 0 0 14px;
font-size:12px;
}
.globalRelatedMediaList ul li a {
display:block;
height:25px;
text-indent:-9999px;
}
.globalRelatedMediaList ul li.globalRelatedMediaList-MONO a {
background:#fff url(https://image.itmedia.co.jp/images/logo/80_mn_bgw.gif) no-repeat center center;
background-size:contain;
}
.globalRelatedMediaList ul li.globalRelatedMediaList-EETJ {
width:60px;
}
.globalRelatedMediaList ul li.globalRelatedMediaList-EETJ a {
background:#fff url(https://image.itmedia.co.jp/images/logo/80_ee_bgw2.gif) no-repeat center center;
background-size:contain;
}
.globalRelatedMediaList ul li.globalRelatedMediaList-EDNJ {
width:60px;
}
.globalRelatedMediaList ul li.globalRelatedMediaList-EDNJ a {
height:20px;
margin:3px 0 0;
background:#fff url(https://image.itmedia.co.jp/images/logo/80_edn_bgw.gif) no-repeat center center;
background-size:contain;
}
.globalRelatedMediaList ul li.globalRelatedMediaList-SJ a {
background:#fff url(https://image.itmedia.co.jp/images/logo/80_smartjapan_bgw.gif) no-repeat center center;
background-size:contain;
}
.globalRelatedMediaList ul li.globalRelatedMediaList-library a {
background:#fff url(https://image.itmedia.co.jp/mn/images/library_logo_80.png) no-repeat center center;
background-size:contain;
}
.globalRelatedMediaList ul li.globalRelatedMediaList-tf a {
background:#fff url(https://image.itmedia.co.jp/images/logo/150_tf.png) no-repeat center center;
background-size:contain;
}
.globalRelatedMediaList ul li.globalRelatedMediaList-modelabo a {
background:#fff url(https://image.itmedia.co.jp/mn/images/modelabo_logo_80.png) no-repeat center center;
background-size:contain;
}
.globalRelatedMediaList ul li.globalRelatedMediaList-SJBUILT a {
background:#fff url(https://image.itmedia.co.jp/images/logo/150_smartjapan_built_bgw.png) no-repeat center center;
background-size:contain;
}
/*---------------------------------------------------------------------*/
/* レイアウト */
/*---------------------------------------------------------------------*/
#masterMain {
width:auto;
}
#masterBody {
width:100%;
margin:0 auto;
}
#masterContents {
width:100%;
margin:0 auto;
padding:15px 0 20px;
}
#localNavigation {
margin:0 auto;
overflow:hidden;
text-align:center;
}
#localNavigation .lnavBtn {
display:block;
text-align:center;
padding: 0;
float:left;
}
#localNavigation .lnavBtn:last-child {
margin:0;
border: none;
}
#localNavigation .lnavBtn span,
#localNavigation .lnavBtn a {
display:block;
position:relative;
width:247px;
height:38px;
text-indent:-99999px;
background-position:0 0;
background-repeat:no-repeat;
opacity:1;
transition-property: opacity;
transition-duration: 0.3s;
transition-timing-function: ease-out;
}
#localNavigation .lnavBtn a:hover {
opacity:0.7;
}
section {
margin:0 0 30px;
}

@media screen and (max-width:498px) {
	#masterMain {
	width:320px;
	margin:0 auto 50px;
	}
	.globalRelatedMediaList {
	display:none;
	}
	#localNavigation {
	width:350px;
	padding:5px 0 0;
	}
	#localNavigation .lnavBtn {
	margin:0 0 5px;
	padding: 0;
	border: none;
	}

	#localNavigation .lnavBtn span,
	#localNavigation .lnavBtn a {
	width:175px;
	height:26px;
	background-size:175px 26px;
	}
	#masterContents {
	border:none;
	}
}


@media screen and (min-width:498px) and ( max-width:747px) {
	#masterMain {
	width:498px;
	margin:0 auto 50px;
	}
	.globalRelatedMediaList {
	width:498px;
	margin:0 auto;
	}
	.globalRelatedMediaList ul li {
	margin:0 0 0 6px;
	}
	#localNavigation {
	width:498px;
	}
	#localNavigation .lnavBtn {
	margin:0;
	padding: 0;
	}
	#localNavigation .lnavBtn,
	#localNavigation .lnavBtn span,
	#localNavigation .lnavBtn a {
	width:124px;
	height:20px;
	background-size:124px 20px;
	}
}
@media screen and (min-width:747px) and ( max-width:989px) {
	#masterMain {
	width:747px;
	margin:0 auto 50px;
	}
	.globalRelatedMediaList {
	width:747px;
	margin:0 auto;
	}
	#localNavigation {
	width:747px;
	}
	#localNavigation .lnavBtn {
	}
	#localNavigation .lnavBtn,
	#localNavigation .lnavBtn span,
	#localNavigation .lnavBtn a {
	width:186px;
	height:29px;
	background-size:186px 29px;
	}
}
@media screen and (min-width:989px) {
	#masterBodyInner {
	width:990px;
	margin:0 auto;
	box-shadow:0 0 30px 10px #e6e6e6;
	}
	#masterContents {
	width:990px;
	}
	#localNavigation {
	width:990px;
	}
}
/*---------------------------------------------------------------------*/
/*colbox*/
/*---------------------------------------------------------------------*/
.colBox {
clear:both;
margin:0 auto 10px;
width:auto;
box-sizing:border-box;
}
.colBox a:link,
.colBox a:visited {
text-decoration:none;
}
.colBoxInner,
.colBoxHead {
position:relative;
text-align:left;
}
.colBoxHead {
clear:both;
margin:0 10px 10px;
padding:0;
}
.colBoxHead h2 {
margin:0;
padding:3px 3px 0 15px;
font-weight:bold;
font-size:18px;
line-height:27px;
color:#081b5c;
background:url(https://image.itmedia.co.jp/mn/subtop/features/esec/heading.gif) no-repeat 0 0;
}
.colBoxHeadSubtxt {
position:absolute;
top:15px;
right:15px;
font-size:14px;
line-height:14px;
color:#FFF;
}
.colBoxIndex {
position:relative;
float:left;
width:210px;
margin:10px 18px 30px;
padding:4px 0;
}
/*
.colBoxIndex.tieup::after {
content: '- PR -';
position:absolute;
right:0;
bottom:-10px;
font-size:12px;
line-height:12px;
color:#666;
}
*/
.colBoxTitle {
width:100%;
height:64px;
overflow:hidden;
margin:0 0 3px;
padding:0;
bottom:0;
left:0;
}
.colBoxTitle h3 {
font-size:14px;
line-height:20px;
margin:0;
padding:5px 0;
word-break:break-all;
}
.tieup .colBoxTitle h3::before {
content:"PR";
position:relative;
top:-1px;
margin:0 5px 0 0;
padding:1px 5px 0;
border-radius:2px;
background:#e83a3e;
font-size:12px;
font-weight:normal;
color:#fff;
}
.colBoxTitle h3 a {
transition:color 0.8s;
}
.colBoxTitle h3 a:hover {
transition:color 0.1s;
}
.colBoxNewtxt {
font-weight:bold;
color:#C00;
}
.colBoxIcon {
display:block;
width:210px;
height:118px;
overflow:hidden;
position:relative;
border:1px #eee solid;
}
.colBoxIcon a {
line-height:0;
display:block;
width:210px;
height:118px;
}
.colBoxIcon img {
margin:0;
position:absolute;
width:210px;
height:158px;
top:-20px;
left:0;
}
.colBoxDescription {
margin:0 0 8px;
}
.colBoxDescription p {
font-size:13px;
line-height:20px;
margin:0;
}
.colBoxInfo {
clear:both;
font-size:15px;
text-align:right;
}
.colBoxClear {
font-size:0;
line-height:0;
height:0;
clear:both;
}
/* TOP STORY */
.colBoxTopStory .colBoxIndex {
width:456px;
border-top:none;
}
.colBoxTopStory .colBoxIcon {
float:left;
margin:0 15px 10px 0;
}
.colBoxTopStory .colBoxTitle {
height:auto;
}
.colBoxTopStory .colBoxTitle h3 {
font-size:18px;
line-height:26px;
}
@media screen and (max-width:498px) {
	.colBoxTopStory .colBoxIndex,
	.colBoxTopStory .colBoxIcon,
	.colBoxTopStory .colBoxIcon a,
	.colBoxTopStory .colBoxIcon img,
	.colBoxTopStory .colBoxTitle {
	width:240px;
	}
}
@media screen and (min-width:747px) and ( max-width:989px) {
	.colBoxTopStory .colBoxIndex{
	width:691px;
	}
}
@media screen and (min-width:989px) {
	.colBoxTopStory .colBoxTitle h3 {
	position:relative;
	overflow:hidden;
	height:50px;
	padding-right:10px;
	}
	.colBoxTopStory .colBoxTitle h3::before {
	position:absolute;
	content:"…";
	top:38px;
	right:5px;
	font-size:10px;
	color:#555;
	}
	.colBoxTopStory .colBoxTitle h3::after {
	background:#fff;
	position:absolute;
	content:"";
	height:100%;
	width:100%;
	}
}
/* ISABB */
.colBoxISABB::after {
clear:both;
}
.colBoxISABB .colBoxInner > div,
.colBoxISABB .colBoxIndex {
float:left;
width:460px;
height:330px;
margin:0 10px;
padding:0;
border:none;
}
.colBoxISABB .colBoxInner > div > a {
width:460px!important;
height:auto!important;
margin:0 auto;
}
.colBoxISABB video {
width:460px!important;
height:auto!important;
min-height:250px;
}
.colBoxISABB iframe {
float:left;
width:460px;
height:auto;
min-height:250px;
margin:0 10px 50px;
}
.colBoxISABB .colBoxInner > div:nth-child(odd),
.colBoxISABB .colBoxIndex:nth-child(odd) {
clear:both;
margin:0 0 0 15px;
}
.colBoxISABB iframe:nth-child(odd) {
clear:both;
margin:0 0 50px 15px;
}
.colBoxISABB .colBoxInner > div:nth-child(even),
.colBoxITSB .colBoxIndex:nth-child(even) {
float:right;
margin:0 15px 0 0;
}
.colBoxISABB iframe:nth-child(even) {
float:right;
margin:0 15px 50px 0;
}
.colBoxISABB .colBoxTitle {
height:auto;
overflow:auto;
margin:0 0 7px;
}
.colBoxISABB .colBoxTitle h3 {
padding:0 0 5px 0;
font-size:16px;
line-height:24px;
}
.colBoxISABB .colBoxDescription {
float:left;
width:235px;
}
.colBoxISABB .colBoxIcon {
float:left;
margin:0 10px 10px 0;
width:210px;
height:140px;
}
.colBoxISABB .colBoxIcon a {
width:210px;
height:140px;
}
.colBoxISABB .colBoxIcon img {
position:relative;
width:210px;
height:140px;
top:0;
}
@media screen and ( max-width:989px) {
	.colBoxISABB .colBoxInner {
	text-align:center;
	}
	.colBoxISABB iframe,
	.colBoxISABB .colBoxInner > div,
	.colBoxISABB .colBoxIndex {
	float:none!important;
	height:inherit!important;
	margin:0 auto 30px!important;
	text-align:left!important;
	}
}
@media screen and (max-width:498px) {
	.colBoxISABB iframe,
	.colBoxISABB .colBoxInner > div,
	.colBoxISABB .colBoxIndex {
	width:300px!important;
	height:auto!important;
	margin:0 auto 20px!important;
	}
	.colBoxISABB .colBoxInner > div > a,
	.colBoxISABB video {
	width:300px!important;
	}
	.colBoxISABB iframe,
	.colBoxISABB video {
	min-height:170px;
	}
	.colBoxISABB .colBoxIcon {
	float:none;
	margin:0 auto 10px;
	}
	.colBoxISABB .colBoxDescription {
	float:none;
	width:auto;
	}
	.colBoxISABB .colBoxInfo {
	border-bottom:2px #ddd solid;
	padding:0 0 10px;
	}
	#topicsTitle {
        max-width:none !important;
        min-width:none !important;
        height: 100px !important;
	}
}

/*---------------------------------------------------------------------*/
/* header title */
/*---------------------------------------------------------------------*/
#topicsTitle {
width:100%;
max-width:990px;
min-width:350px;
height:180px;
margin:0 auto;
position:relative;
}
#topicsTitle h1 {
width:100%;
max-width:990px;
height:100%;
margin:0;
padding:0;
text-align:center;
color:#999;
background:url(https://image.itmedia.co.jp/mn/subtop/features/esec/title.png) no-repeat 0 0;
background-size:contain;
background-position:center;
text-indent:-9999px;
}
#topicsTitle h1 a {
width:100%;
max-width:990px;
height:100%;
display:block;
}
#topicsDescription {
width:100%;
margin:0 auto;
}
#topicsDescription p {
	margin:0;
	padding:14px 13px 10px;
	font-size:14px;
	color: #212569;
	text-align: justify;
}
@media screen and (max-width:498px) {
	#topicsTitle {
	width:350px;
	height:64px;
	}
	#topicsDescription {
	width:350px;
	background: #fff;
/*	border-top: solid 1px #1D347E;*/
	}
	#topicsDescription p {
	font-size:12px;
	line-height:150%;
	padding: 10px 10px 3px;
	}
}
@media screen and (min-width:498px) and ( max-width:747px) {
	#topicsTitle {
	width:498px;
	height:91px;
	}
	#topicsDescription {
	width:498px;
	background: -moz-linear-gradient(top, #60627f -30%, #FFF 8%);
  	background: -webkit-linear-gradient(top, #60627f -30%, #FFF 8%);
  	background: linear-gradient(to bottom, #60627f -30%, #FFF 8%);
	}
	#topicsDescription p {
	font-size:12px;
	padding:12px;
	line-height: 20px;
	}
}
@media screen and (min-width:747px) and ( max-width:989px) {
	#topicsTitle {
	width:747px;
	height:136px;
	}
	#topicsDescription {
	width:747px;
	background: -moz-linear-gradient(top, #60627f -30%, #FFF 8%);
  	background: -webkit-linear-gradient(top, #60627f -30%, #FFF 8%);
  	background: linear-gradient(to bottom, #60627f -30%, #FFF 8%);
	}
	#topicsDescription p {
	font-size:12px;
    padding: 13px 10px;
	}
}
/*---------------------------------------------------------------------*/
/* Top Story */
/*---------------------------------------------------------------------*/

/*---------------------------------------------------------------------*/
/* article */
/*---------------------------------------------------------------------*/
#colBoxArticleList .colBoxInner span {
display:block;
width:200px;
margin:10px auto 40px;
padding:0;
background:#FFF;
text-align:center;
cursor:pointer;
transition:opacity 0.5s;
color:#fff;
font-size:16px;
font-weight:bold;
background:#007cb8;
}
#colBoxArticleList .colBoxInner span::after,
#colBoxArticleList .colBoxInner span::before {
display:block;
content:"";
height:3px;
width:100%;
margin:8px 0;
}
#colBoxArticleList .colBoxInner span:hover {
opacity:0.7;
}

/*---------------------------------------------------------------------*/
/* スポンサーロゴ */
/*---------------------------------------------------------------------*/
.colBoxLogolist {
margin:0;
overflow:hidden;
}
.colBoxLogolist .colBoxLogo {
float:left;
margin:0 12px 30px;
padding:10px;
border:1px #ddd solid;
}
.colBoxLogolist .colBoxLogo a {
display:block;
line-height:0;
}
.colBoxLogolist .colBoxLogo img {
width:200px;
}
@media screen and (max-width:498px) {
	.colBoxLogolist .colBoxLogo {
	float:none;
	width:260px;
	margin:0 auto 18px;
	text-align:center;
	}
}
/*---------------------------------------------------------------------*/
/* 共通フッタ（簡易版） */
/*---------------------------------------------------------------------*/
#globalFooterLink {
width:94%;
margin:0 auto 10px;
padding:0;
font-size:10px;
line-height:14px;
text-align:right;
}
#globalFooterCorp {
clear:both;
width:94%;
margin:0 auto;
padding:10px 0;
border-top:1px solid #DDD;
}
#globalFooterCorpIn {
}
#globalFooterCorp p a:link,
#globalFooterCorp p a:visited {
}
#globalFooterCorpLogo {
position:relative;
display:bslock;
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(https://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:989px) {
  #globalFooterLink {
    width:970px;
  }
  #globalFooterCorp {
    width:970px;
  }
}
@media screen and (max-width:498px) {
	.colBoxIndex {
	margin:0 auto 18px;
	float:none;
	}
}