/*-----------------------------------------------------------------*/
/* html5reset */
/*-----------------------------------------------------------------*/
ins,mark{color:#000}a,hr{padding:0}article,aside,details,figcaption,figure,footer,header,hgroup,hr,menu,nav,section{display:block}abbr,address,article,aside,audio,b,blockquote,body,canvas,caption,cite,code,dd,del,details,dfn,div,dl,dt,em,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,p,pre,q,samp,section,small,span,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,ul,var,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:0 0}mark{background-color:#ff9}body{line-height:1}nav ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}a{margin:0;font-size:100%;vertical-align:baseline;background:0 0}ins{text-decoration:none}mark{font-style:italic;font-weight:700}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}table{border-collapse:collapse;border-spacing:0}hr{height:1px;border:0;border-top:1px solid #ccc;margin:1em 0}input,select{vertical-align:middle}
/*-----------------------------------------------------------------*/
/* ALL */
/*-----------------------------------------------------------------*/
* {
-webkit-text-size-adjust:none;
-webkit-tap-highlight-color:rgba(0,0,0,0);
}
body {
font:11px -apple-system, Sans-Serif, HiraKakuProN-W3, Meiryo, 'メイリオ', ArialMT, Hiragino Kaku Gothic Pro, 'ヒラギノ角ゴ Pro W3', Osaka, Verdana, 'ＭＳ Ｐゴシック';
line-height:1.9;
*font-size:small;
*font:x-small;
min-width:320px;
}
table {
font-size:inherit;
font:100%;
}
a:link {
color:#000;
text-decoration:none;
-webkit-transition-property:color; /* iOS8|Android4.4.4 */
transition-property:color;
-webkit-transition-duration:500ms;
transition-duration:500ms;
}
a:visited {
color:#000;
text-decoration:none;
-webkit-transition-property:color;
transition-property:color;
-webkit-transition-duration:500ms;
transition-duration:500ms;
}
.formText,
.formEmail,
.formTextarea {
font-size:14px;
}
.deferLoader {
margin:3px auto 0;
display:inline-block;
width:6px;
height:6px;
border-radius:50%;
border:2px solid #CCC;
border-right-color:transparent;
-webkit-animation:jsonloader 1s linear infinite;
animation:jsonloader 1s linear infinite;
}
/*-----------------------------------------------------------------*/
/* FONT-SIZE */
/*-----------------------------------------------------------------*/
.size10 {font-size:77%;}.size11 {font-size:85%;}.size12 {font-size:93%;}.size13 {font-size:100%;}.size14 {font-size:108%;}.size15 {font-size:116%;}.size16 {font-size:123.1%;}.size17 {font-size:131%;}.size18 {font-size:138.5%;}.size19 {font-size:146.5%;}.size20 {font-size:153.9%;}.size21 {font-size:161.6%;}.size22 {font-size:167%;}.size23 {font-size:174%;}.size24 {font-size:182%;}.size25 {font-size:189%;}.size26 {font-size:197%;}
/*-----------------------------------------------------------------*/
/* HEIGHT */
/*-----------------------------------------------------------------*/
.colBoxClear {
font-size:0;
line-height:0;
height:0;
clear:both;
}
.h5px {height:5px;}.h10px {height:10px;}.h15px {height:15px;}.h20px {height:20px;}.h25px {height:25px;}.h30px {height:30px;}
/*-----------------------------------------------------------------*/
/* WRAP */
/*-----------------------------------------------------------------*/
#masterWrap {
overflow:hidden;
}
#masterWrapOuter {
position:relative;
box-shadow:0 0 3px #CCC;
padding-top:50px;
}
.masterWrapOuterAndroid {
left:0;
}
.masterWrapOuterDefault {
-webkit-transform:translate3d(0px,0,0);
transform:translate3d(0px,0,0);
-webkit-transition-property:-webkit-transform;
transition-property:transform;
-webkit-transition-duration:300ms;
transition-duration:300ms;
-webkit-transition-timing-function:ease;
transition-timing-function:ease;
}
.masterWrapOuterAndroid.slideRight {
left:260px;
}
.masterWrapOuterAndroid.slideLeft {
left:-260px;
}
.masterWrapOuterDefault.slideRight {
-webkit-transform:translate3d(260px,0,0);
transform:translate3d(260px,0,0);
}
.masterWrapOuterDefault.slideLeft {
-webkit-transform:translate3d(-260px,0,0);
transform:translate3d(-260px,0,0);
}
#masterWrapInner {
color:#000;
background:#FFF;
}
/*-----------------------------------------------------------------*/
/* SLIDEBOX */
/*-----------------------------------------------------------------*/
#slideBox_transparent {
position:fixed;
width:100%;
height:100%;
top:0;
left:0;
background:transparent;
z-index:999;
display:none;
}
.slideBox {
position:fixed;
top:0;
-webkit-box-sizing:border-box;
box-sizing:border-box;
width:260px;
height:100%;
display:none;
overflow:scroll;
-webkit-overflow-scrolling:touch;
}
.slideBox a {
color:#666;
}
#slideBox_left {
left:0;
padding-top:50px;
}
#slideBox_right {
right:0;
padding-top:50px;
}
.slideBox .colBox {
margin:0 0 5px;
}
.slideBox .colBox .colBoxIndex {
padding:0;
}
.slideBox .colBox .colBoxUlist li {
font-size:12px;
line-height:18px;
margin:0;
padding:9px 7px;
border-bottom:1px solid #EEE;
background:none;
}
/*-----------------------------------------------------------------*/
#colBoxPagelist .colBoxUlist li a img {
vertical-align:middle;
}
/*-----------------------------------------------------------------*/
.colBoxMedialist .colBoxUlist li a {
padding-left:46px;
background-repeat:no-repeat;
background-position:left center;
}
.colBoxMedialist .colBoxUlist .medialist-top a {
background-image:url(http://image.itmedia.co.jp/images/logo/slideleft_top.gif);
background-size:40px 10px;
}
.colBoxMedialist .colBoxUlist .medialist-news a {
background-image:url(http://image.itmedia.co.jp/images/logo/slideleft_news.gif);
background-size:29px 16px;
}
.colBoxMedialist .colBoxUlist .medialist-enterprise a {
background-image:url(http://image.itmedia.co.jp/images/logo/slideleft_enterprise.gif);
background-size:40px 8px;
}
.colBoxMedialist .colBoxUlist .medialist-altblog a {
background-image:url(http://image.itmedia.co.jp/images/logo/slideleft_altblog.gif);
background-size:40px 8px;
}
.colBoxMedialist .colBoxUlist .medialist-executive a {
background-image:url(http://image.itmedia.co.jp/images/logo/slideleft_executive.gif);
background-size:40px 9px;
}
.colBoxMedialist .colBoxUlist .medialist-dc a {
background-image:url(http://image.itmedia.co.jp/images/logo/slideleft_dc.gif);
background-size:40px 10px;
}
.colBoxMedialist .colBoxUlist .medialist-lifestyle a {
background-image:url(http://image.itmedia.co.jp/images/logo/slideleft_lifestyle.gif);
background-size:40px 12px;
}
.colBoxMedialist .colBoxUlist .medialist-pcuser a {
background-image:url(http://image.itmedia.co.jp/images/logo/slideleft_pcuser.gif);
background-size:40px 14px;
}
.colBoxMedialist .colBoxUlist .medialist-mobile a {
background-image:url(http://image.itmedia.co.jp/images/logo/slideleft_mobile.gif);
background-size:40px 15px;
}
.colBoxMedialist .colBoxUlist .medialist-mn a {
background-image:url(http://image.itmedia.co.jp/images/logo/slideleft_mn.gif);
background-size:40px 6px;
/*
background-image:url(http://image.itmedia.co.jp/images/logo/slideleft_mn10th.gif);
background-size:40px 15px;
*/
}
.colBoxMedialist .colBoxUlist .medialist-ee a {
background-image:url(http://image.itmedia.co.jp/images/logo/slideleft_ee.gif);
background-size:36px 16px;
}
.colBoxMedialist .colBoxUlist .medialist-edn a {
background-image:url(http://image.itmedia.co.jp/images/logo/slideleft_edn.gif);
background-size:35px 16px;
}
.colBoxMedialist .colBoxUlist .medialist-nl a {
background-image:url(http://image.itmedia.co.jp/images/logo/slideleft_nl.gif);
background-size:40px 14px;
}
.colBoxMedialist .colBoxUlist .medialist-smartjapan a {
background-image:url(http://image.itmedia.co.jp/images/logo/slideleft_smartjapan.gif);
background-size:40px 12px;
}
.colBoxMedialist .colBoxUlist .medialist-mm a {
background-image:url(http://image.itmedia.co.jp/images/logo/slideleft_mm.gif);
background-size:40px 11px;
}
.colBoxMedialist .colBoxUlist .medialist-ait a {
background-image:url(http://image.itmedia.co.jp/images/logo/slideleft_ait.gif);
background-size:33px 16px;
}
.colBoxMedialist .colBoxUlist .medialist-tt a {
background-image:url(http://image.itmedia.co.jp/images/logo/slideleft_tt.gif);
background-size:25px 16px;
}
.colBoxMedialist .colBoxUlist .medialist-business a {
background-image:url(http://image.itmedia.co.jp/images/logo/slideleft_business.gif);
background-size:40px 12px;
}
.colBoxMedialist .colBoxUlist .medialist-tf a {
background-image:url(http://image.itmedia.co.jp/images/logo/slideleft_tf.gif);
background-size:40px 14px;
}
.colBoxMedialist .colBoxUlist .medialist-classics a {
background-image:url(http://image.itmedia.co.jp/images/logo/slideleft_classics.gif);
background-size:35px 16px;
}
.colBoxMedialist .colBoxUlist .medialist-keywords a {
background-image:url(http://image.itmedia.co.jp/images/logo/slideleft_keywords.gif);
background-size:40px 16px;
}
/*-----------------------------------------------------------------*/
.colBoxMedialist .colBoxUlist li a {
display:block;
}
/*-----------------------------------------------------------------*/
.slideBox iframe {
width:260px;
height:1000px;
}
/*-----------------------------------------------------------------*/
/* HEADER */
/*-----------------------------------------------------------------*/
#masterHeader {
padding:10px;
}
#headerstyle_fixed #masterHeader {
position:fixed;
top:0;
left:0;
width:100%;
height:50px;
z-index:999;
background:#FFF;
box-sizing:border-box;
border-bottom:1px solid transparent;
-webkit-transition-property:border;
transition-property:border;
-webkit-transition-duration:300ms;
transition-duration:300ms;
}
#headerstyle_fixed #masterHeader.scrollShadow,
#headerstyle_fixed #masterHeader.openShadow {
border-bottom:1px solid #CCC;
}
#headerstyle_static #masterHeader {
position:static;
}
/*-----------------------------------------------------------------*/
/* SLIDEBUTTON */
/*-----------------------------------------------------------------*/
.slideBtn {
position:absolute;
top:5px;
width:40px;
height:40px;
display:block;
cursor:pointer;
z-index:999;
}
#slideBtn_left {
left:0;
}
#slideBtn_rank {
left:50px;
z-index:998;
}
#slideBtn_search {
right:50px;
}
#slideBtn_right {
right:0;
}
.slideBtnArea {
width:40px;
height:40px;
}
.slideBtnOpen .slideBtnArea {
-webkit-animation:slideBtnOpen 300ms linear 1 forwards;
animation:slideBtnOpen 300ms linear 1 forwards;
}
.slideBtnOpen360 .slideBtnArea {
-webkit-animation:slideBtnOpen360 300ms linear 1 forwards;
animation:slideBtnOpen360 300ms linear 1 forwards;
}
.slideBtnClose .slideBtnArea {
-webkit-animation:slideBtnClose 300ms linear 1 forwards;
animation:slideBtnClose 300ms linear 1 forwards;
}
.slideBtnClose360 .slideBtnArea {
-webkit-animation:slideBtnClose360 300ms linear 1 forwards;
animation:slideBtnClose360 300ms linear 1 forwards;
}
@-webkit-keyframes slideBtnOpen {
	0% {-webkit-transform:rotate(0deg);}
	100% {-webkit-transform:rotate(180deg);}
}
@keyframes slideBtnOpen {
	0% {transform:rotate(0deg);}
	100% {transform:rotate(180deg);}
}
@-webkit-keyframes slideBtnClose {
	0% {-webkit-transform:rotate(180deg);}
	100% {-webkit-transform:rotate(0deg);}
}
@keyframes slideBtnClose {
	0% {transform:rotate(180deg);}
	100% {transform:rotate(0deg);}
}
@-webkit-keyframes slideBtnOpen360 {
	0% {-webkit-transform:rotate(0deg);}
	100% {-webkit-transform:rotate(360deg);}
}
@keyframes slideBtnOpen360 {
	0% {transform:rotate(0deg);}
	100% {transform:rotate(360deg);}
}
@-webkit-keyframes slideBtnClose360 {
	0% {-webkit-transform:rotate(360deg);}
	100% {-webkit-transform:rotate(0deg);}
}
@keyframes slideBtnClose360 {
	0% {transform:rotate(360deg);}
	100% {transform:rotate(0deg);}
}
#slideBtn_left .slideBtnArea {
background:url(http://image.itmedia.co.jp/spv/images/head_menu.gif) no-repeat center 10px;
background-size:20px auto;
}
#slideBtn_rank .slideBtnArea {
background:url(http://image.itmedia.co.jp/spv/images/head_menu.gif) no-repeat center -30px;
background-size:20px auto;
}
#slideBtn_search .slideBtnArea {
background:url(http://image.itmedia.co.jp/spv/images/head_menu.gif) no-repeat center -56px;
background-size:17px auto;
}
#slideBtn_right .slideBtnArea {
background:url(http://image.itmedia.co.jp/spv/images/head_menu.gif) no-repeat center -110px;
background-size:20px auto;
}
/*-----------------------------------------------------------------*/
/* LOGO */
/*-----------------------------------------------------------------*/
#masterLogo {
margin:0 auto;
width:90px;
height:30px;
}
#masterLogo h1 {
font-size:12px;
line-height:12px;
width:90px;
height:30px;
}
/*-----------------------------------------------------------------*/
#masterLogo a {
display:table-cell;
width:90px;
height:30px;
text-align:center;
vertical-align:middle;
}
#masterLogo a img {
vertical-align:middle;
}
/*-----------------------------------------------------------------*/
/* CONTENTS */
/*-----------------------------------------------------------------*/
/*-----------------------------------------------------------------*/
/* TOP INDEX AJAX LOADER */
/*-----------------------------------------------------------------*/
.index-ajax-loader {
height:50px;
padding:20px;
opacity:1;
overflow:hidden;
-webkit-transition-property:height,padding,opacity;
transition-property:height,padding,opacity;
-webkit-transition-duration:0;
transition-duration:0;
}
.index-ajax-loader.complete {
height:0;
padding:0;
opacity:0;
}
.index-ajax-loader .loading {
font-family:Gill Sans, 'メイリオ', Meiryo;
text-align:center;
}
.index-ajax-loader .loader {
margin:0 auto 10px;
display:block;
width:20px;
height:20px;
border-radius:50%;
border:3px solid #CCC;
border-right-color:transparent;
-webkit-animation:iconloader 1s linear infinite;
animation:iconloader 1s linear infinite;
}
/*-----------------------------------------------------------------*/
/* COLBOX */
/*-----------------------------------------------------------------*/
.colBox {
overflow:hidden;
}
.colBox .colBoxHead {
border-bottom:1px solid #DDD;
position:relative;
padding:10px 5px;
}
.colBox .colBoxHead h1,
.colBox .colBoxHead h2,
.colBox .colBoxHead .colBoxHeadname {
background:url(http://image.itmedia.co.jp/spv/images/ulli_default.png) no-repeat left center;
background-size:14px;
padding:0 0 0 20px;
font-size:130%;
font-weight:normal;
}
.colBox .colBoxHead2 {
background:#EEE;
padding:3px 5px;
font-size:93%;
color:#666;
}
.colBox .colBoxHeadSubtxt {
position:absolute;
top:12px;
right:5px;
}
.colBox .colBoxSubhead {
border-bottom:1px dotted #DDD;
margin:0 0 5px;
padding:0 0 3px;
}
.colBox .colBoxSubhead .subhead {
font-size:12px;
margin:0;
}
.colBox .colBoxIndex {
padding:5px;
}
.colBox .colBoxIndex form {
margin:0;
padding:0;
}
.colBox .colBoxIndex button {
vertical-align:middle;
}
.colBoxIcon {
display:inline;
}
.colBoxIcon a {
float:left;
margin:4px 10px 3px 0;
}
/*-----------------------------------------------------------------*/
.colBox .colBoxIndex .kwdset li {
display:inline-block;
}
.colBox .colBoxIndex .kwdset li a {
display:inline-block;
background:#EEE;
padding:0 3px;
}
/*-----------------------------------------------------------------*/
.colBox .colBoxIndex .type-related li {
border:none;
}
/*-----------------------------------------------------------------*/
/*-----------------------------------------------------------------*/
.colBoxIndexList .colBoxIndex {
-webkit-transition-property:background-color;
transition-property:background-color;
-webkit-transition-duration:0.2s;
transition-duration:0.2s;
padding:0;
}
.colBoxIndexList .colBoxIndex.tap_ui {
background-color:#EEE;
}
.colBoxIndexList .colBoxIcon {
display:block;
border:1px solid #CCC;
margin:0 10px 3px 0;
float:left;
width:82px;
height:62px;
}
.colBoxIndexList .colBoxIcon a {
display:block;
margin:1px 0 0 1px;
width:80px;
height:60px;
}
.colBoxIndexList .colBoxIndex[data-articletype="Special"] {
position:relative;
}
.colBoxIndexList .colBoxIndex[data-articletype="Special"]:before {
content:"PR";
font-size:90%;
color:#999;
position:absolute;
bottom:10px;
right:5px;
}
@media(min-width:341px){
.colBoxIndexList .colBoxIndex[data-articletype="Special"]:before {
right:10px;
}
}
@media(min-width:361px){
.colBoxIndexList .colBoxIndex[data-articletype="Special"]:before {
right:20px;
}
}
/*-----------------------------------------------------------------*/
.colBoxIndexMMDD .colBoxHead {
display:none;
}
/*-----------------------------------------------------------------*/
.setIndexStyleIcon .colBoxIndexList .colBoxIndex {
display:block;
width:auto;
position:relative;
min-height:240px;
overflow:hidden;
border-bottom:1px solid #DDD;
}
.setIndexStyleIcon .colBoxIndexList .colBoxIndex .colBoxLeft {
display:block !important;
border:none;
width:auto;
height:240px;
position:relative;
z-index:8;
}
.setIndexStyleIcon .colBoxIndexList .colBoxIndex .colBoxLeft.colBoxNoimage {
background-position:10px 10px;
background-repeat:no-repeat;
background-color:#F8F8F8;
background-size:80px;
}
.setIndexStyleIcon .colBoxIndexList .colBoxIndex .colBoxLeft:after {
position:absolute;
display:block;
content:'';
top:0;
left:0;
width:100%;
height:100%;
}
.setIndexStyleIcon .colBoxIndexList .colBoxIndex .colBoxLeft .colBoxIcon a {
display:block;
margin:0;
float:none;
width:100%;
height:240px;
-webkit-box-sizing:border-box;
box-sizing:border-box;
padding-top:100px;
}
.setIndexStyleIcon .colBoxIndexList .colBoxIndex .colBoxRight {
display:block;
position:absolute;
bottom:0;
width:100%;
border:none;
-webkit-box-sizing:border-box;
box-sizing:border-box;
padding:8px;
background:rgba(255,255,255,0.9);
z-index:9;
}
/*-----------------------------------------------------------------*/
.setIndexStyleMinimum .colBoxIndexList .colBoxLeft {
background:none !important;
}
.setIndexStyleMinimum .colBoxIndexList .colBoxLeft .colBoxIcon a.iconfix {
border:1px solid #DDD;
box-sizing:border-box;
}
/*-----------------------------------------------------------------*/
.setIndexStyleDefault .colBoxIndexList .colBoxIndex .colBoxLeft {
}
.setIndexStyleDefault .colBoxIndexList .colBoxIndex .colBoxLeft.colBoxNoimage {
background-position:center center;
background-repeat:no-repeat;
background-color:#FFF;
background-size:60px;
}
.setIndexStyleDefault .colBoxIndexList .colBoxIndex .colBoxLeft .colBoxIcon a {
}
.setIndexStyleDefault .colBoxIndexList .colBoxLeft .colBoxIcon a.iconfix {
background:none !important;
}
.setIndexStyleDefault .colBoxIndexList .colBoxIndex .colBoxRight {
padding:10px;
}
/*-----------------------------------------------------------------*/
.setIndexStyleIcon .colBoxIndexList .colBoxLeft .colBoxIcon a.iconfix {
background:none !important;
}
/*-----------------------------------------------------------------*/
.colBoxIndexList .colBoxIndex {
display:-webkit-box;
display:box;
border-bottom:1px solid #DDD;
}
.colBoxIndexList .colBoxIndex .colBoxLeft {
border-right:none;
border-bottom:none;
overflow:hidden;
vertical-align:middle;
padding:10px 5px 10px 10px;
width:80px;
}
@media(min-width:341px){
.colBoxIndexList .colBoxIndex .colBoxLeft {
width:100px;
}
}
@media(min-width:361px){
.colBoxIndexList .colBoxIndex .colBoxLeft {
width:120px;
}
}
.colBoxIndexList .colBoxIndex .colBoxRight {
-webkit-box-flex:1;
box-flex:1;
vertical-align:middle;
padding:10px 10px 10px 5px;
}
.colBoxIndexList .colBoxLeft .colBoxIcon {
display:block;
border:none;
margin:0;
float:none;
width:auto;
height:auto;
}
.colBoxIndexList .colBoxLeft .colBoxIcon a {
display:table-cell;
margin:0;
float:none;
vertical-align:middle;
width:80px;
height:60px;
}
@media(min-width:341px){
.colBoxIndexList .colBoxLeft .colBoxIcon a {
width:100px;
height:75px;
}
}
@media(min-width:361px){
.colBoxIndexList .colBoxLeft .colBoxIcon a {
width:120px;
height:90px;
}
}
.colBoxIndexList .colBoxLeft .colBoxIcon a.iconfix {
display:block;
}
.colBoxIndexList .colBoxLeft .colBoxIcon a .iconloader {
margin:0 auto;
display:block;
width:10px;
height:10px;
border-radius:50%;
border:1px solid #CCC;
border-right-color:transparent;
-webkit-animation:iconloader 1s linear infinite;
animation:iconloader 1s linear infinite;
}
@-webkit-keyframes iconloader {
0% {
-webkit-transform:rotate(0deg);
opacity:0.5;
}
50% {
-webkit-transform:rotate(180deg);
opacity:1.0;
}
100% {
-webkit-transform:rotate(360deg);
opacity:0.5;
}
}
@keyframes iconloader {
0% {
transform:rotate(0deg);
opacity:0.5;
}
50% {
transform:rotate(180deg);
opacity:1.0;
}
100% {
transform:rotate(360deg);
opacity:0.5;
}
}
/*-----------------------------------------------------------------*/
.colBoxIndexEditfree .colBoxHead h1,
.colBoxIndexEditfree .colBoxHead h2,
.colBoxIndexEditfree .colBoxHead .colBoxHeadname {
background:url(http://image.itmedia.co.jp/spv/images/ulli_man.png) no-repeat left center;
background-size:14px;
padding:0 0 0 20px;
}
/*-----------------------------------------------------------------*/
.colBoxSubTitle {
font-size:108%;
-webkit-transition-property:font-size;
transition-property:font-size;
-webkit-transition-duration:100ms;
transition-duration:100ms;
}
.colBoxSubTitle h3 {
font-weight:normal;
}
.colBoxTitle {
font-size:123.1%;
-webkit-transition-property:font-size;
transition-property:font-size;
-webkit-transition-duration:100ms;
transition-duration:100ms;
}
.colBoxTitle h1,
.colBoxTitle h2 {
font-weight:normal;
}
.colBoxDescription {
display:none;
font-size:108%;
-webkit-transition-property:font-size;
transition-property:font-size;
-webkit-transition-duration:100ms;
transition-duration:100ms;
font-weight:normal;
}
.setIndexStyleDefault .colBoxDescription {
display:block;
}
.colBoxDescription h2,
.colBoxDescription h3 {
font-weight:normal;
color:#888;
}
.colBoxInfo {
font-size:90%;
color:#999;
}
.colBoxInfo .icon-writer {
display:block;
background:url(http://image.itmedia.co.jp/spv/images/author.png) no-repeat left center;
background-size:11px 11px;
padding:1px 0 0 15px;
}
.colBoxInfo .icon-date {
display:block;
background:url(http://image.itmedia.co.jp/spv/images/update.png) no-repeat left center;
background-size:11px 11px;
padding:1px 0 0 15px;
}
.colBoxPageLink {
padding:5px;
font-size:108%;
text-align:right;
}
#subtopContents .colBoxPageLink {
display:none;
}
.colBoxUlist ul {
font-size:108%;
list-style-type:none;
}
.colBoxIndexNewssmart .colBoxUlist ul {
margin:0 !Important;
}
.colBoxUlist ul li {
margin:0 0 3px;
padding:0 0 3px 14px;
background:url(data:image/gif;base64,R0lGODlhIAAgAIAAAJmZmQAAACH5BAAAAAAALAAAAAAgACAAAAIehI+py+0Po5y02ouz3rz7D4biSJbmiabqyrbuC5sFADs=) no-repeat left center;
background-size:5px;
border-bottom:1px dotted #CCC;
}
.colBoxIndexNewssmart .colBoxUlist ul li {
border-bottom:1px dotted #ffedea;
font-size:12px !important;
}
.colBoxOlist ul {
font-size:108%;
list-style-type:none;
}
.colBoxTable table {
border-collapse:collapse;
}
.colBoxTable table th,
.colBoxTable table td {
font-size:108%;
border:1px solid #CCC;
padding:1px 3px;
text-align:left;
}
.colBoxTable table th {
background:#EEE;
}
.colBoxBorder {
border-bottom:1px solid #DDD;
}
.colBoxBacknumber .colBoxHead h1,
.colBoxKeywordIndex .colBoxHead h1,
.colBoxBacknumber .colBoxHead .colBoxHeadname,
.colBoxKeywordIndex .colBoxHead .colBoxHeadname {
background:url(http://image.itmedia.co.jp/spv/images/ulli_archive.png) no-repeat left center;
background-size:14px;
padding:0 0 0 20px;
}
.colBoxBacknumber .colBoxIndex,
.colBoxKeywordIndex .colBoxIndex {
padding:10px !important;
}
.colBoxBacknumber select,
.colBoxKeywordIndex select {
font:12px HiraKakuProN-W3, Meiryo, 'メイリオ', ArialMT, Hiragino Kaku Gothic Pro, 'ヒラギノ角ゴ Pro W3', Osaka, Verdana, 'ＭＳ Ｐゴシック';
}
.colBoxBacknumber button,
.colBoxKeywordIndex button {
font:12px HiraKakuProN-W3, Meiryo, 'メイリオ', ArialMT, Hiragino Kaku Gothic Pro, 'ヒラギノ角ゴ Pro W3', Osaka, Verdana, 'ＭＳ Ｐゴシック';
}

.colBoxBacknumber2 {
}
.colBoxBacknumber2 .colBoxIndex {
padding:0;
}
.colBoxBacknumber2 .colBoxUlist {
overflow:scroll;
-webkit-overflow-scrolling:touch;
border-bottom:1px solid #EEE;
}
.colBoxBacknumber2 .colBoxUlist ul {
display:-webkit-box;
display:box;
}
.colBoxBacknumber2 .colBoxUlist ul li {
margin:0;
padding:0;
background:none;
background-size:auto;
border-bottom:none;
}
.colBoxBacknumber2 .colBoxUlist ul li a {
display:inline-block;
padding:15px 10px;
s}

.colBoxInformation .colBoxHead h2,
.colBoxInformation .colBoxHead .colBoxHeadname {
background:url(http://image.itmedia.co.jp/spv/images/ulli_userinfo.png) no-repeat left center;
background-size:14px;
padding:0 0 0 20px;
}
.colBoxInformation .colBoxDescription {
margin:0 0 5px;
}
.colBoxInformation .colBoxDescription h2 {
font-size:12px;
font-weight:normal;
}
.colBoxInformation .colBoxUlist ul {
font-size:12px;
}
.colBoxQuickPoll .colBoxTitle h3 {
font-size:16px !important;
}
.colBoxQuickPoll .colBoxIndex form {
margin:0;
}
.colBoxQuickPoll .colBoxIndex form label {
font-size:14px;
vertical-align:middle;
font-weight:bold;
}
.colBoxQuickPoll .colBoxGraph {
font-size:12px;
border:1px solid #FFF;
background:-webkit-linear-gradient(top, #e4df48, #c3bd1c);
background:linear-gradient(to bottom, #e4df48, #c3bd1c);
border-radius:5px;
box-shadow:0px 0px 1px #999;
text-align:center;
margin:0 0 5px;
padding:2px 0;
}
.colBoxQuickPoll .colBoxInfo {
text-align:center;
}
.colBoxQuickPoll .colBoxInfoBtn {
padding:10px 0 0 0;
}
.colBoxQuickPoll .colBoxInfo p {
color:#C00;
}

.colBoxListinline .colBoxUlist li {
display:inline;
border:none;
margin:0 5px 0 0;
padding:0 0 0 16px;
background-size:12px;
padding-left:16px;
}
.colBoxListinlineblock .colBoxUlist li {
display:inline;
background:none;
border:none;
margin:0;
padding:0;
}
.colBoxListinlineblock .colBoxUlist li a {
display:inline-block;
text-align:center;
font-weight:bold;
background:-webkit-linear-gradient(top, #FFF, #EEE);
background:linear-gradient(to bottom, #FFF, #EEE);
border:1px solid #CCC;
margin:0 5px 5px 0;
padding:5px;
min-width:24px;
}

.colBoxKeywordlist .colBoxUlist li {
background:url(http://image.itmedia.co.jp/images/ulli_key-solid.png) no-repeat left center;
background-size:12px;
padding-left:16px;
}
.colBoxRelKeyword .colBoxUlist li {
display:inline-block;
border:none !important;
margin:0;
background:url(http://image.itmedia.co.jp/images/ulli_key-solid.png) no-repeat left center;
background-size:12px;
padding-left:16px;
}
.colBoxSEOLINK {
font-size:120%;
}

.colBoxKeywordIndex .colBoxUlist li {
background:none;
border:none;
margin:0;
padding:0;
}
.colBoxKeywordIndex .colBoxUlist li a {
display:block;
width:30px;
height:30px;
float:left;
font-size:16px;
line-height:32px;
text-align:center;
font-weight:bold;
margin:0 5px 5px 0;
}
.colBoxKeywordIndex select {
width:100px;
}
.colBoxRanking .colBoxHead h2,
.colBoxRanking .colBoxHead .colBoxHeadname {
background:url(http://image.itmedia.co.jp/spv/images/ulli_king.png) no-repeat left center;
background-size:15px;
padding:0 0 0 20px;
}
.colBoxRanking .colBoxOlist ol {
counter-reset:li;
list-style:none;
padding:0 0 0 1.2em;
}
.colBoxRanking .colBoxOlist ol li {
border-bottom:1px solid #EEE;
font-size:116%;
padding:0 0 0 5px;
}
.colBoxRanking .colBoxOlist ol .rank10 {
border-bottom:none;
}
.colBoxRanking .colBoxOlist ol li a {
position:relative;
display:block;
padding:.2em 0 .2em 2em;
*padding:.4em;
margin:.5em 0;
text-decoration:none;
transition:all .3s ease-out;
}
.colBoxRanking .colBoxOlist ol li a:hover:before {
transform:rotate(45deg);
}
.colBoxRanking .colBoxOlist ol li a:before {
content:counter(li);
counter-increment:li;
position:absolute;
left:-1.3em;
top:50%;
margin-top:-1.3em;
background:#FFF;
height:2em;
width:2em;
line-height:2em;
border:.1em solid #EEE;
text-align:center;
transition:all .3s ease-out;
font-family:Gurmukhi MN, Gill Sans, 'メイリオ', Meiryo;
text-shadow:0 1px 0 rgba(255,255,255,.5);
font-size:123.1%;
color:#333;
}
.colBoxRanking .colBoxOlist ol .rank1 a:before {
background:#FAF09A;
border-color:#CCB600;
color:#000;
}
.colBoxRanking .colBoxOlist ol .rank2 a:before {
background:#FAFAFA;
border-color:#C5C5C5;
color:#000;
}
.colBoxRanking .colBoxOlist ol .rank3 a:before {
background:#F8CD9F;
border-color:#EE810B;
color:#000;
}
/*------------------*/
.colBoxRankingTypeA .colBoxIndex {
padding:0 10px;
}
#colBoxRankingTop .colBoxRankingTypeA .colBoxIndex {
padding:0;
}
.colBoxRankingTypeA .colBoxOlist ol {
padding:0;
}
.colBoxRankingTypeA .colBoxOlist ol li {
padding:5px 0;
}
.colBoxRankingTypeA .colBoxOlist ol li a {
display:table;
padding:0 0 0 40px;
}
.colBoxRankingTypeA .colBoxOlist ol li a:before {
content:counter(li);
counter-increment:li;
position:absolute;
left:0;
top:0;
margin-top:0;
background:#FFF;
width:30px;
height:50px;
line-height:3em;
border:1px solid #DDD;
box-sizing:border-box;
text-align:center;
transition:all .3s ease-out;
font-family:Gurmukhi MN, Gill Sans, 'メイリオ', Meiryo;
text-shadow:0 1px 0 rgba(255,255,255,.5);
font-size:123.1%;
color:#333;
}
.colBoxRankingTypeA .colBoxOlist ol li a .icon-field {
display:table-cell;
vertical-align:top;
}
.colBoxRankingTypeA .colBoxOlist ol li a .icon-field span {
display:block;
border:1px solid #DDD;
width:50px;
height:50px;
box-sizing:border-box;
background-repeat:no-repeat;
background-position:center center;
background-size:cover;
}
.colBoxRankingTypeA .colBoxOlist ol li a .title-field {
display:table-cell;
vertical-align:top;
padding-left:10px;
}
/*------------------*/
#colBoxSearchTop {
display:none;
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
z-index:998;
padding:60px 10px 10px;
box-sizing:border-box;
background:rgba(255,255,255,0);
-webkit-transition-property:background;
transition-property:background;
-webkit-transition-duration:300ms;
transition-duration:300ms;
-webkit-transition-timing-function:ease;
transition-timing-function:ease;
}
#colBoxSearchTop.colBoxActive {
background:rgba(255,255,255,0.7);
}
#colBoxSearchTop .colBoxSearch {
background:#FFF;
box-shadow:0 0 3px #999;
border-radius:2px;
width:100%;
opacity:0;
-webkit-transform:translate3d(0,-300px,0);
transform:translate3d(0,-300px,0);
-webkit-transition-property:-webkit-transform,opacity;
transition-property:transform,opacity;
-webkit-transition-duration:300ms;
transition-duration:300ms;
-webkit-transition-timing-function:ease;
transition-timing-function:ease;
height:100%;
overflow:hidden;
overflow-y:auto;
-webkit-overflow-scrolling:touch;
box-sizing:border-box;
}
#colBoxSearchTop.colBoxActive .colBoxSearch {
opacity:1;
-webkit-transform:translate3d(0,0,0);
transform:translate3d(0,0,0);
}
#colBoxSearchTop .gsc-control-cse {
border:none !important;
padding:10px !important;
}
#colBoxSearchTop .gsib_a {
padding:0 8px !important;
vertical-align:top !important;
}
#colBoxSearchTop .gsib_a .gsc-input {
background-color:transparent !important;
height:35px !important;
}
#colBoxSearchTop input.gsc-search-button-v2 {
margin-top:0 !important;
padding:11px 27px !important;
}
#colBoxSearchTop table.gsc-search-box .gsib_b {
vertical-align:top !important;
}
#colBoxSearchTop table.gsc-search-box .gsib_b {
vertical-align:top !important;
}
#colBoxSearchTop .gsc-result .gs-title {
height:auto !important;
line-height:26px;
}
#colBoxSearchTop .gsc-input-box {
height:35px !important;
}
#colBoxSearchTop .gsst_a {
padding-top:7px !important;
}
#colBoxSearchTop .gsc-results,
#colBoxSearchTop .gsc-cursor-box,
#colBoxSearchTop .gsc-cursor-page {
display:inline-block !important;
text-decoration:none !important;
}
#colBoxSearchTop .gsc-cursor-box {
text-align:left !important;
margin:0 !important;
}
#colBoxSearchTop .gsc-cursor-page, .gsc-cursor-page {
background:#EEE !important;
border:none !important;
border-radius:0 !important;
margin:0 3px 5px !important;
padding:3px 0 !important;
text-decoration:none !important;
width:32px !important;
text-align:center !important;
}
#colBoxSearchTop .gsc-results .gsc-cursor-page.gsc-cursor-current-page {
background:#666 !important;
border:none !important;
color:#FFF !important;
text-shadow:none !important;
}
#colBoxSearchTop .gsc-webResult.gsc-result:hover,
#colBoxSearchTop .gsc-webResult.gsc-result.gsc-promotion:hover,
#colBoxSearchTop .gsc-results .gsc-imageResult-classic:hover,
#colBoxSearchTop .gsc-results .gsc-imageResult-column:hover {
background:none !important;
border-color:#FFF !important;
box-shadow:none !important;
}
#colBoxSearchTop .gsc-thumbnail-inside,
#colBoxSearchTop .gsc-url-top {
padding:0 !important;
}

#colBoxRankingTop {
display:none;
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
z-index:998;
padding:60px 10px 10px;
box-sizing:border-box;
background:rgba(255,255,255,0);
-webkit-transition-property:background;
transition-property:background;
-webkit-transition-duration:300ms;
transition-duration:300ms;
-webkit-transition-timing-function:ease;
transition-timing-function:ease;
}
#colBoxRankingTop.colBoxActive {
background:rgba(255,255,255,0.7);
}
#colBoxRankingTop .colBoxRanking {
padding:0 10px;
background:#FFF;
border:1px solid #CCC;
width:100%;
height:100%;
overflow-y:auto;
-webkit-overflow-scrolling:touch;
box-sizing:border-box;
opacity:0;
-webkit-transform:translate3d(0,-300px,0);
transform:translate3d(0,-300px,0);
-webkit-transition-property:-webkit-transform,opacity;
transition-property:transform,opacity;
-webkit-transition-duration:300ms;
transition-duration:300ms;
-webkit-transition-timing-function:ease;
transition-timing-function:ease;
}
#colBoxRankingTop.colBoxActive .colBoxRanking {
opacity:1;
-webkit-transform:translate3d(0,0,0);
transform:translate3d(0,0,0);
}
#colBoxRankingTop .colBoxRankingClose,
#colBoxSearchTop #colBoxSearchClose {
width:45px;
height:16px;
background :url(http://image.itmedia.co.jp/spv/images/ulli_close.gif) no-repeat center center / contain;
border:1px solid #CCC;
position:absolute;
top:13px;
right:10px;
cursor:pointer;
}
.colBoxSubnavigation {
background:#FFF;
background:linear-gradient(to top, #FFF 0%,#FFF 3%,#EEE 3%,#FFF);
border-top:1px solid #DDD;
border-bottom:1px solid #DDD;
}
.colBoxSubnavigation .colBoxIndex {
padding:0;
border:none;
}
.colBoxSubnavigation .colBoxUlist ul {
display:table;
width:100%;
}
.colBoxSubnavigation .colBoxUlist ul li {
display:table-cell;
background:none;
border:none;
margin:0;
padding:0;
text-align:center;
font-size:12px;
width:25%;
}
.colBoxSubnavigation .colBoxUlist ul li.active {
background:linear-gradient(to bottom, #FFF 0%,#FFF 3%,#E6E6E6 3%,#FFF);
}
.colBoxSubnavigation .colBoxUlist ul li a {
display:block;
border-left:1px solid #FFF;
border-right:1px solid #DDD;
padding:5px 0;
width:100%;
color:#000;
}
.colBoxButton {
width:150px;
margin:0 auto;
border:1px solid #CCC;
border-radius:20px;
}
.colBoxButton a {
display:block;
padding:5px;
font-size:14px;
font-weight:bold;
text-align:center;
background:linear-gradient(to bottom, #369, #036);
border:1px solid #FFF;
border-radius:20px;
}
.colBoxButton a:link,
.colBoxButton a:visited,
.colBoxButton a:hover {
color:#FFF;
text-decoration:none;
}

.colBoxButtons .colBoxUlist ul li {
display:inline;
border:none;
margin:0 3px 0 0;
padding:0;
background:none;
}
.colBoxButtons .colBoxUlist ul li a {
display:inline-block;
padding:5px 10px;
background:#333;
color:#FFF;
border:1px solid #FFF;
font-size:12px;
line-height:18px;
}

.colBoxNewtxt {
color:#C00;
}

.colBoxWarning .colBoxUlist ul li {
background:none;
border:none;
padding:0;
font-weight:bold;
}

.colBoxArchiveList .colBoxIndex .colBoxType {
background:#FBB03B;
border-radius:2px;
text-align:center;
margin-top:5px;
}
#tt .colBoxArchiveList .colBoxType,
.colBoxArchiveList .colBoxIndex[data-articletype="ニュース"] .colBoxType {
display:none;
}
.colBoxArchiveList .imgLazy {
opacity:0;
border:1px solid #DDD;
background-repeat:no-repeat;
background-position:center center;
background-size:cover;
-webkit-transition-property:opacity;
transition-property:opacity;
-webkit-transition-duration:0.3s;
transition-duration:0.3s;
}
.colBoxArchiveList .imgLazy.imgLazy_ok {
opacity:1;
}
/*-----------------------------------------------------------------*/
/* FOOTER */
/*-----------------------------------------------------------------*/
#copyright {
padding:5px;
font-size:10px;
line-height:12px;
text-align:center;
font-family:Gill Sans, 'メイリオ', Meiryo;
}
#pagetop {
text-align:center;
padding:10px;
background:#EEE;
}
/*-----------------------------------------------------------------*/
/* ARTICLE */
/*-----------------------------------------------------------------*/
#cmsWrap {
background:#FFF;
margin:0 0 5px;
}
.cmsHeader {
position:relative;
padding:5px;
}
#cmsBody {
padding:5px;
}
@media(min-width:341px){
.cmsHeader {
padding:5px 10px;
}
#cmsBody {
padding:5px 10px;
}
}
@media(min-width:361px){
.cmsHeader {
padding:5px 20px;
}
#cmsBody {
padding:5px 20px;
}
}
/*-----------------------------------------------------------------*/
/* MOVE /css/spv/cmsInput.css */

/*-----------------------------------------------------------------*/
/* SOCIALBUTTON BIG */
/*-----------------------------------------------------------------*/
.msbSocialbuttonBig {
display:table;
width:100%;
text-align:center;
padding:5px 5px 0;
}
.msbSocialbuttonBig .msbBtn {
display:table-cell;
padding:0 10px 0 0;
vertical-align:top;
overflow:hidden;
}
.msbSocialbuttonBig .msbBtn a {
font-size:12px;
line-height:18px;
}
.msbSocialbuttonBig .msbBtnLikebuttonJson a,
.msbSocialbuttonBig .msbBtnTweetbuttonJson a,
.msbSocialbuttonBig .msbBtnHatenabuttonJson a,
.msbSocialbuttonBig .msbBtnLinebutton a,
.msbSocialbuttonBig .msbBtnGoogleplusone a {
display:inline-block;
min-width:30px;
padding:36px 5px 0;
text-align:center;
}
.msbSocialbuttonBig .msbBtnLikebuttonJson a {
background:url(http://image.itmedia.co.jp/spv/images/msbBtn.png) no-repeat center 5px;
background-size:27px auto;
}
.msbSocialbuttonBig .msbBtnTweetbuttonJson a {
background:url(http://image.itmedia.co.jp/spv/images/msbBtn.png) no-repeat center -45px;
background-size:28px auto;
}
.msbSocialbuttonBig .msbBtnGoogleplusone a {
background:url(http://image.itmedia.co.jp/spv/images/msbBtn.png) no-repeat center -95px;
background-size:27px auto;
}
.msbSocialbuttonBig .msbBtnLinebutton a {
background:url(http://image.itmedia.co.jp/spv/images/msbBtn.png) no-repeat center -162px;
background-size:30px auto;
}
.msbSocialbuttonBig .msbBtnHatenabuttonJson a {
background:url(http://image.itmedia.co.jp/spv/images/msbBtn.png) no-repeat center -195px;
background-size:27px auto;
}
.msbSocialbuttonBig .msbBtnLikebuttonJsonCount,
.msbSocialbuttonBig .msbBtnTweetbuttonJsonCount,
.msbSocialbuttonBig .msbBtnHatenabuttonJsonCount,
.msbSocialbuttonBig .msbBtnLinebutton a,
.msbSocialbuttonBig .msbBtnGoogleplusone a {
font-family:Gill Sans, 'メイリオ', Meiryo;
}
.msbSocialbuttonBig .msbBtnLikebuttonJsonCount .msbBtnJsonloader,
.msbSocialbuttonBig .msbBtnTweetbuttonJsonCount .msbBtnJsonloader,
.msbSocialbuttonBig .msbBtnHatenabuttonJsonCount .msbBtnJsonloader {
margin:3px auto 0;
display:block;
width:6px;
height:6px;
border-radius:50%;
border:2px solid #CCC;
border-right-color:transparent;
-webkit-animation:jsonloader 1s linear infinite;
animation:jsonloader 1s linear infinite;
}
@-webkit-keyframes jsonloader {
0% {
-webkit-transform:rotate(0deg);
opacity:0.2;
}
50% {
-webkit-transform:rotate(180deg);
opacity:1.0;
}
100% {
-webkit-transform:rotate(360deg);
opacity:0.2;
}
}
@keyframes jsonloader {
0% {
transform:rotate(0deg);
opacity:0.2;
}
50% {
transform:rotate(180deg);
opacity:1.0;
}
100% {
transform:rotate(360deg);
opacity:0.2;
}
}
.msbSocialbuttonBig .msbBtnLikebuttonJsonCount {color:#385992;}
.msbSocialbuttonBig .msbBtnTweetbuttonJsonCount {color:#4EB5F2;}
.msbSocialbuttonBig .msbBtnHatenabuttonJsonCount {color:#336FD3;}
.msbSocialbuttonBig .msbBtnLinebutton a {color:#2CBF13 !important;}
.msbSocialbuttonBig .msbBtnGoogleplusone a {color:#BB4940 !important;}

/*-----------------------------------------------------------------*/
/* SOCIALBUTTON SMALL */
/*-----------------------------------------------------------------*/
.msbSocialbuttonSmall {
display:table;
width:100%;
}
.msbSocialbuttonSmall .msbBtn {
display:table-cell;
padding:0 5px 5px 0;
vertical-align:top;
text-align:center;
}
.msbSocialbuttonSmall .msbBtn a {
font-size:12px;
line-height:18px;
}
.msbSocialbuttonSmall .msbBtnLikebuttonJson a,
.msbSocialbuttonSmall .msbBtnTweetbuttonJson a,
.msbSocialbuttonSmall .msbBtnHatenabuttonJson a,
.msbSocialbuttonSmall .msbBtnLinebutton a,
.msbSocialbuttonSmall .msbBtnGoogleplusone a {
display:inline-block;
min-width:40px;
text-align:left;
box-sizing:border-box;
padding:0 5px 0 24px;
}
.msbSocialbuttonSmall .msbBtnLikebuttonJson a {
background:url(http://image.itmedia.co.jp/spv/images/msbBtn.png) no-repeat left 0px;
background-size:18px auto;
}
.msbSocialbuttonSmall .msbBtnTweetbuttonJson a {
background:url(http://image.itmedia.co.jp/spv/images/msbBtn.png) no-repeat left -34px;
background-size:19px auto;
}
.msbSocialbuttonSmall .msbBtnGoogleplusone a {
background:url(http://image.itmedia.co.jp/spv/images/msbBtn.png) no-repeat left -67px;
background-size:18px auto;
}
.msbSocialbuttonSmall .msbBtnLinebutton a {
background:url(http://image.itmedia.co.jp/spv/images/msbBtn.png) no-repeat left -99px;
background-size:18px auto;
}
.msbSocialbuttonSmall .msbBtnHatenabuttonJson a {
background:url(http://image.itmedia.co.jp/spv/images/msbBtn.png) no-repeat left -133px;
background-size:18px auto;
}
.msbSocialbuttonSmall .msbBtnLikebuttonJsonCount,
.msbSocialbuttonSmall .msbBtnTweetbuttonJsonCount,
.msbSocialbuttonSmall .msbBtnHatenabuttonJsonCount,
.msbSocialbuttonSmall .msbBtnLinebutton,
.msbSocialbuttonSmall .msbBtnGoogleplusone {
font-family:Gill Sans, 'メイリオ', Meiryo;
}
.msbSocialbuttonSmall .msbBtnLikebuttonJsonCount {color:#385992;}
.msbSocialbuttonSmall .msbBtnTweetbuttonJsonCount {color:#4EB5F2;}
.msbSocialbuttonSmall .msbBtnHatenabuttonJsonCount {color:#336FD3;}
.msbSocialbuttonSmall .msbBtnLinebutton a {color:#2CBF13 !important;}
.msbSocialbuttonSmall .msbBtnGoogleplusone a {color:#BB4940 !important;}
.msbSocialbuttonSmall .msbBtnLikebuttonJsonCount .msbBtnJsonloader,
.msbSocialbuttonSmall .msbBtnTweetbuttonJsonCount .msbBtnJsonloader,
.msbSocialbuttonSmall .msbBtnHatenabuttonJsonCount .msbBtnJsonloader {
margin:3px auto 0;
display:inline-block;
width:6px;
height:6px;
border-radius:50%;
border:2px solid #CCC;
border-right-color:transparent;
-webkit-animation:jsonloader 1s linear infinite;
animation:jsonloader 1s linear infinite;
}

/*-----------------------------------------------------------------*/
/* SOCIALBUTTON PR */
/*-----------------------------------------------------------------*/
.colBoxCsbBtn {
box-shadow:none;
border:none;
}
.colBoxCsbBtn .colBoxIndex {
border:none;
padding:0;
}
.csbBtn {
float:left;
}
/*-----------------------------------------------------------------*/
/* SUBTOP/FEATURES */
/*-----------------------------------------------------------------*/
#subtopHeader,
#specialHeader {
margin:0 auto 5px;
}
#subtopHeader h1,
#specialHeader h1 {
margin:0;
font-size:12px;
line-height:16px;
text-indent:-9999px;
}
#subtopTitle,
#specialTitle {
margin:0 0 5px;
padding:5px 5px 0;
border-top:5px solid rgba(51,111,211,1);
}
#subtopTitle h1,
#specialTitle h1 {
font-size:146.5%;
}
#subtopDescription,
#specialDescription {
margin:0 0 10px;
padding:0 5px;
}
#subtopDescription h1,
#specialDescription h1 {
}
#tt #specialBody .colBoxDescription {
display:block;
}
.colBoxFeaturesImage .colBoxImage {
text-align:center;
}
/*-----------------------------------------------------------------*/
/* SERIES */
/*-----------------------------------------------------------------*/
#seriesHeader {
vertical-align:middle;
display:table;
width:100%;
border-top:3px solid rgba(51,111,211,1);
margin-bottom:5px;
}
#seriesIcon {
vertical-align:middle;
display:table-cell;
width:50px;
padding:5px;
}
#seriesIconInner {
vertical-align:middle;
display:inline-block;
width:50px;
height:50px;
border:1px solid #CCC;
box-sizing:border-box;
background-repeat:no-repeat;
background-position:center center;
background-size:cover;
}
#seriesIconInner.noImg {
background-size:25px 25px;
background-color:#CCC;
background-image:url(http://image.itmedia.co.jp/spv/images/series_head_noimg.png);
}
#seriesTitle {
vertical-align:middle;
display:table-cell;
padding:5px;
}
#seriesTitle h1 {
font-size:146.5%;
font-weight:normal;
}
#seriesTitle h2 {
font-size:100%;
font-weight:normal;
}
#seriesBody .colBoxIcon a {
background-size:cover;
background-repeat:no-repeat;
background-position:center center;
border:1px solid #DDD;
}
#seriesBody .colBoxIcon.noImg a {
background-image:url(http://image.itmedia.co.jp/spv/images/series_noimg.png);
background-size:40px 40px;
background-color:#CCC;
background-repeat:no-repeat;
background-position:center center;
}
#seriesBody .colBoxButton {
border-radius:0;
width:auto;
border:none;
margin:0;
text-align:center;
}
#seriesBody .colBoxButton a {
border-radius:0;
border:none;
padding:10px;
display:inline-block;
width:auto;
font-weight:normal;
background:#333;
}
/* cmsSeriesList.css */
/*-----------------------------------------------------------------*/
/* AUTHOR */
/*-----------------------------------------------------------------*/
#authorHeader {
margin-bottom:10px;
padding:10px;
}
#authorIcon {
width:75px;
margin:0 auto;
padding:10px 0;
}
#authorIconInner {
width:75px;
height:75px;
border-radius:75px;
background-repeat:no-repeat;
background-position:center center;
background-size:cover;
}
#authorIconInner.noImg {
background-size:25px 25px;
background-color:#CCC;
background-image:url(http://image.itmedia.co.jp/spv/images/author_head_noimg.png);
}
@media(min-width:341px){
#authorIcon {
width:100px;
}
#authorIconInner {
width:100px;
height:100px;
border-radius:100px;
}
#authorIconInner.noImg {
background-size:50px 50px;
}
}
@media(min-width:361px){
#authorIcon {
width:125px;
}
#authorIconInner {
width:125px;
height:125px;
border-radius:125px;
}
#authorIconInner.noImg {
background-size:40px 40px;
}
}
#authorTitle {
}
#authorTitle h1 {
font-size:146.5%;
font-weight:normal;
text-align:center;
}
#authorTitle h2 {
font-size:100%;
font-weight:normal;
max-height:80px;
overflow:scroll;
}
#authorBody .colBoxButton {
border-radius:0;
width:auto;
border:none;
margin:0;
text-align:center;
}
#authorBody .colBoxButton a {
border-radius:0;
border:none;
padding:10px;
display:inline-block;
width:auto;
font-weight:normal;
background:#333;
}
#authorBody #authorIndexBtn {
margin:20px 0;
}
#authorBody .colBoxIcon a {
background-size:cover;
background-repeat:no-repeat;
background-position:center center;
border:1px solid #DDD;
}
#authorBody .colBoxIcon.noImg a {
background-image:url(http://image.itmedia.co.jp/spv/images/series_noimg.png);
background-size:40px 40px;
background-color:#CCC;
}
/*-----------------------------------------------------------------*/
/* KEYWORDS */
/*-----------------------------------------------------------------*/
#keywordsTitle {
margin:0 0 5px;
padding:5px 5px 0;
border-top:3px solid rgba(233,85,32,1);
}
#tt #keywordsTitle {
border-top:3px solid rgba(13,159,148,1)
}
#keywordsTitle h1 {
font-size:167%;
font-weight:normal;
}
#keywordsBody > .colBoxRelKeyword:nth-of-type(1) .colBoxHead {
display:none;
}
#keywordsBody .colBoxIndexKwdindex .colBoxHead {
display:none;
}

/* TT WPKW */
#keywordsBody .colBoxIndexTTWPKwdindex .colBoxIndex .colBoxLeft {
vertical-align:top;
width:80px;
}
#keywordsBody .colBoxIndexTTWPKwdindex .colBoxIndex[title] .colBoxLeft:before {
font-size:8px;
display:block;
font-weight:normal;
text-align:center;
border-bottom:1px solid #EEE;
padding:1px 0 0;
}
#keywordsBody .colBoxIndexTTWPKwdindex .colBoxIndex .colBoxLeft:before {
background:rgba(13,159,148,0.05);
}
#keywordsBody .colBoxIndexTTWPKwdindex .colBoxIndex[title="技術文書"] .colBoxLeft:before {
content:'技術文書';
}
#keywordsBody .colBoxIndexTTWPKwdindex .colBoxIndex[title="事例"] .colBoxLeft:before {
content:'事例';
}
#keywordsBody .colBoxIndexTTWPKwdindex .colBoxIndex[title="講演資料"] .colBoxLeft:before {
content:'講演資料';
}
#keywordsBody .colBoxIndexTTWPKwdindex .colBoxIndex[title="レポート"] .colBoxLeft:before {
content:'レポート';
}
#keywordsBody .colBoxIndexTTWPKwdindex .colBoxIndex[title="製品資料"] .colBoxLeft:before {
content:'製品資料';
}
#keywordsBody .colBoxIndexTTWPKwdindex .colBoxIndex[title="webcast"] .colBoxLeft:before {
content:'webcast';
}
#keywordsBody .colBoxIndexTTWPKwdindex .colBoxIndex[title="その他"] .colBoxLeft:before {
content:'その他';
}
#keywordsBody .colBoxIndexTTWPKwdindex .colBoxIndex[title="カタログ"] .colBoxLeft:before {
content:'カタログ';
}
#keywordsBody .colBoxIndexTTWPKwdindex .colBoxIndex[title="試用版"] .colBoxLeft:before {
content:'試用版';
}
#keywordsBody .colBoxIndexTTWPKwdindex .colBoxIndex[title="e-book"] .colBoxLeft:before {
content:'e-book';
}
#keywordsBody .colBoxIndexTTWPKwdindex .colBoxIndex[title="比較資料"] .colBoxLeft:before {
content:'比較資料';
}
#keywordsBody .colBoxIndexTTWPKwdindex .colBoxIndex[title="技術文書"] .colBoxLeft .colBoxIcon a {
background:url(http://image.itmedia.co.jp/tt/images/spv/typeid_1.png) no-repeat center center;
background-size:30px auto;
}
#keywordsBody .colBoxIndexTTWPKwdindex .colBoxIndex[title="事例"] .colBoxLeft .colBoxIcon a {
background:url(http://image.itmedia.co.jp/tt/images/spv/typeid_2.png) no-repeat center center;
background-size:30px auto;
}
#keywordsBody .colBoxIndexTTWPKwdindex .colBoxIndex[title="講演資料"] .colBoxLeft .colBoxIcon a {
background:url(http://image.itmedia.co.jp/tt/images/spv/typeid_3.png) no-repeat center center;
background-size:30px auto;
}
#keywordsBody .colBoxIndexTTWPKwdindex .colBoxIndex[title="レポート"] .colBoxLeft .colBoxIcon a {
background:url(http://image.itmedia.co.jp/tt/images/spv/typeid_4.png) no-repeat center center;
background-size:30px auto;
}
#keywordsBody .colBoxIndexTTWPKwdindex .colBoxIndex[title="製品資料"] .colBoxLeft .colBoxIcon a {
background:url(http://image.itmedia.co.jp/tt/images/spv/typeid_5.png) no-repeat center center;
background-size:30px auto;
}
#keywordsBody .colBoxIndexTTWPKwdindex .colBoxIndex[title="webcast"] .colBoxLeft .colBoxIcon a {
background:url(http://image.itmedia.co.jp/tt/images/spv/typeid_6.png) no-repeat center center;
background-size:30px auto;
}
#keywordsBody .colBoxIndexTTWPKwdindex .colBoxIndex[title="その他"] .colBoxLeft .colBoxIcon a {
background:url(http://image.itmedia.co.jp/tt/images/spv/typeid_9.png) no-repeat center center;
background-size:30px auto;
}
#keywordsBody .colBoxIndexTTWPKwdindex .colBoxIndex[title="カタログ"] .colBoxLeft .colBoxIcon a {
background:url(http://image.itmedia.co.jp/tt/images/spv/typeid_13.png) no-repeat center center;
background-size:30px auto;
}
#keywordsBody .colBoxIndexTTWPKwdindex .colBoxIndex[title="試用版"] .colBoxLeft .colBoxIcon a {
background:url(http://image.itmedia.co.jp/tt/images/spv/typeid_14.png) no-repeat center center;
background-size:30px auto;
}
#keywordsBody .colBoxIndexTTWPKwdindex .colBoxIndex[title="e-book"] .colBoxLeft .colBoxIcon a {
background:url(http://image.itmedia.co.jp/tt/images/spv/typeid_15.png) no-repeat center center;
background-size:30px auto;
}
#keywordsBody .colBoxIndexTTWPKwdindex .colBoxIndex[title="比較資料"] .colBoxLeft .colBoxIcon a {
background:url(http://image.itmedia.co.jp/tt/images/spv/typeid_17.png) no-repeat center center;
background-size:30px auto;
}

/*-----------------------------------------------------------------*/
/* TT FORM */
/*-----------------------------------------------------------------*/
#customQuest {
margin:0 0 10px;
border:3px solid #CCC;
border-radius:10px;
overflow:hidden;
}
#customQuest form {
margin:0;
padding:0;
}
#customQuest .cqTitle {
background:linear-gradient(to bottom, #444, #111);
border-bottom:2px solid #CCC;
color:#FFF;
font-size:13px;
line-height:20px;
padding:8px;
}
#customQuest .cqTitle strong {
color:#F90;
}
#customQuest #cqWrap {
padding:8px;
}
#customQuest .cqBodyHeading {
font-size:13px;
border-bottom:1px dotted #CCC;
margin:0 0 5px;
padding:0 0 5px;
}
#customQuest .cqBodyHeading strong {
font-size:15px;
color:#F60;
}
#customQuest .cqBodyContents {
font-size:13px;
margin:0 0 15px;
}
#customQuest .cqBodyContents label {
display:block;
margin:0 0 5px;
}
#customQuest .privacy {
background:#EEE;
margin:0 0 10px;
padding:5px;
border-radius:5px;
}
#customQuest .privacy h5 {
background:linear-gradient(to bottom, #FFF, #DDD);
border:1px solid #CCC;
border-radius:5px 5px 0 0;
-webkit-border-radius:5px 5px 0 0;
font-size:13px;
margin:0 0 10px;
padding:5px;
}
#customQuest .privacy ul {
margin:0 0 10px;
padding:5px 5px 5px 30px;
}
#customQuest .privacy ul li,
#customQuest .privacy ol li {
color:#C00;
font-size:11px;
margin:0;
padding:0;
}
#customQuest .privacy p {
margin-bottom:10px;
font-size:13px;
}
#customQuest .c100 {
text-align:center;
}
#customQuest .c100 input {
padding:10px 20px;
}
.cqAgreementContent {
margin-bottom:20px;
}
#ITMprivacy {
height:100px;
overflow-y:scroll;
border:1px solid #CCC;
background:#FFF;
margin-bottom:10px;
padding:10px;
}
#ITMprivacy ul li,
#ITMprivacy ol li {
color:#000 !important;
}
/*-----------------------------------------------------------------*/
/* CMSTOOL */
/*-----------------------------------------------------------------*/
.colBoxFeatures2index120Urllist .colBoxIndexL50,
.colBoxFeatures2index120Urllist .colBoxIndexR50,
.colBoxFeatures2index80Urllist .colBoxIndexL50,
.colBoxFeatures2index80Urllist .colBoxIndexR50,
.colBoxFeatures2index120UrllistRelated .colBoxIndexL50,
.colBoxFeatures2index120UrllistRelated .colBoxIndexR50,
.colBoxFeatures2index80UrllistRelated .colBoxIndexL50,
.colBoxFeatures2index80UrllistRelated .colBoxIndexR50 {
padding:0;
}
.colBoxFeatures2index120Urllist .colBoxIndexL50 .colBoxIndex,
.colBoxFeatures2index120Urllist .colBoxIndexR50 .colBoxIndex,
.colBoxFeatures2index80Urllist .colBoxIndexL50 .colBoxIndex,
.colBoxFeatures2index80Urllist .colBoxIndexR50 .colBoxIndex,
.colBoxFeatures2index120UrllistRelated .colBoxIndexL50 .colBoxIndex,
.colBoxFeatures2index120UrllistRelated .colBoxIndexR50 .colBoxIndex,
.colBoxFeatures2index80UrllistRelated .colBoxIndexL50 .colBoxIndex,
.colBoxFeatures2index80UrllistRelated .colBoxIndexR50 .colBoxIndex {
border-top:none;
}
.colBoxSubtop2index120Urllist .colBoxIndexL50,
.colBoxSubtop2index120Urllist .colBoxIndexR50,
.colBoxSubtop2index80Urllist .colBoxIndexL50,
.colBoxSubtop2index80Urllist .colBoxIndexR50,
.colBoxSubtop2index120UrllistRelated .colBoxIndexL50,
.colBoxSubtop2index120UrllistRelated .colBoxIndexR50,
.colBoxSubtop2index80UrllistRelated .colBoxIndexL50,
.colBoxSubtop2index80UrllistRelated .colBoxIndexR50 {
padding:0;
}
.colBoxSubtop2index120Urllist .colBoxIndexL50 .colBoxIndex,
.colBoxSubtop2index120Urllist .colBoxIndexR50 .colBoxIndex,
.colBoxSubtop2index80Urllist .colBoxIndexL50 .colBoxIndex,
.colBoxSubtop2index80Urllist .colBoxIndexR50 .colBoxIndex,
.colBoxSubtop2index120UrllistRelated .colBoxIndexL50 .colBoxIndex,
.colBoxSubtop2index120UrllistRelated .colBoxIndexR50 .colBoxIndex,
.colBoxSubtop2index80UrllistRelated .colBoxIndexL50 .colBoxIndex,
.colBoxSubtop2index80UrllistRelated .colBoxIndexR50 .colBoxIndex {
border-top:none;
}
.colBoxMiddle2index120Urllist .colBoxIndexL50,
.colBoxMiddle2index120Urllist .colBoxIndexR50,
.colBoxMiddle2index80Urllist .colBoxIndexL50,
.colBoxMiddle2index80Urllist .colBoxIndexR50,
.colBoxMiddle2index120UrllistRelated .colBoxIndexL50,
.colBoxMiddle2index120UrllistRelated .colBoxIndexR50,
.colBoxMiddle2index80UrllistRelated .colBoxIndexL50,
.colBoxMiddle2index80UrllistRelated .colBoxIndexR50 {
padding:0;
}
.colBoxMiddle2index120Urllist .colBoxIndexL50 .colBoxIndex,
.colBoxMiddle2index120Urllist .colBoxIndexR50 .colBoxIndex,
.colBoxMiddle2index80Urllist .colBoxIndexL50 .colBoxIndex,
.colBoxMiddle2index80Urllist .colBoxIndexR50 .colBoxIndex,
.colBoxMiddle2index120UrllistRelated .colBoxIndexL50 .colBoxIndex,
.colBoxMiddle2index120UrllistRelated .colBoxIndexR50 .colBoxIndex,
.colBoxMiddle2index80UrllistRelated .colBoxIndexL50 .colBoxIndex,
.colBoxMiddle2index80UrllistRelated .colBoxIndexR50 .colBoxIndex {
border-top:none;
}
.colBoxIndex .linkset {
font-size:108%;
list-style-type:none;
}
.colBoxIndex .linkset li {
margin:0 0 3px;
padding:0 0 3px 14px;
background:url(data:image/gif;base64,R0lGODlhIAAgAIAAAJmZmQAAACH5BAAAAAAALAAAAAAgACAAAAIehI+py+0Po5y02ouz3rz7D4biSJbmiabqyrbuC5sFADs=) no-repeat left center;
background-size:5px;
border-bottom:1px dotted #CCC;
}

/*-----------------------------------------------------------------*/
/* CREDIT */
/*-----------------------------------------------------------------*/
#cmsPrcredit {
margin:0 0 10px;
padding:5px;
}
#cmsPrcredit .inner {
border:3px solid #CCC;
padding:5px;
}
#cmsPrcredit .inner br {
display:none;
}
#cmsPrcredit .inner .credit {
margin:0;
font-size:12px;
line-height:16px;
}
#cmsPrcredit .inner .credit br {
display:inline;
}

/*-----------------------------------------------------------------*/
/* LARGEIMAGE LOADER */
/*-----------------------------------------------------------------*/
.enlarge {
margin:10px auto;
width:30px;
height:30px;
border-radius:50%;
border:5px solid #CCC;
border-right-color:transparent;
-webkit-animation:iconloader 1s linear infinite;
animation:iconloader 1s linear infinite;
}
/*-----------------------------------------------------------------*/
/* ADTAG */
/*-----------------------------------------------------------------*/
#RECTANGL,
#RECTNGL2,
#SPBANNER,
#AFFILIAT,
#ARBANNER {
width:300px;
margin:0 auto;
-webkit-transform:translate3d(0,0,0);
transform:translate3d(0,0,0);
-webkit-transition-property:-webkit-transform;
transition-property:transform;
-webkit-transition-duration:500ms;
transition-duration:500ms;
-webkit-transition-timing-function:ease;
transition-timing-function:ease;
}
#AFFILIAT,
#ARBANNER {
width:320px;
}
#RECTANGL.slideRight,
#RECTNGL2.slideRight,
#SPBANNER.slideRight,
#AFFILIAT.slideRight {
-webkit-transform:translate3d(1000px,0,0);
transform:translate3d(1000px,0,0);
}
#RECTANGL.slideLeft,
#RECTNGL2.slideLeft,
#SPBANNER.slideLeft,
#AFFILIAT.slideLeft {
-webkit-transform:translate3d(-1000px,0,0);
transform:translate3d(-1000px,0,0);
}
#RECTANGL #adHeaderText,
#RECTNGL2 #adHeaderText,
#SPBANNER #adHeaderText {
width:300px !important;
}
#KTN1 {
text-align:center;
}
#KTN2 {
margin:0 auto 5px;
text-align:center;
width:300px;
}
.colBoxIndexAD {
padding:10px 5px 0;
}
#cmsBody .colBoxIndexAD {
border-top:none;
margin:0 0 20px;
padding:0;
}
.colBoxAD {
box-shadow:none;
background:transparent;
}
.colBoxAD .colBoxIndexAD {
border:none;
padding:0;
}
#TEXT {
padding:5px 5px 0;
}
@media(min-width:341px){
#TEXT {
padding:5px 10px 0;
}
}
@media(min-width:361px){
#TEXT {
padding:5px 20px 0;
}
}
#TEXT .colBoxITT .colBoxIndex {
border:none;
padding:0;
}
#TEXT .colBoxITT .colBoxTitle {
background:url(http://image.itmedia.co.jp/images/ad/ITT_pr.gif) no-repeat 0 3px;
}
#TEXT .colBoxITT .colBoxTitle h3 {
font-size:12px;
line-height:18px;
}
#RICHAD {
width:300px;
margin:0 auto;
}
#colBoxCBOX .colBoxHead,
#colBoxFEATURES .colBoxHead {
background:#EEE;
border-color:#FFF;
}
#colBoxCBOX .colBoxHeadSubtxt,
#colBoxFEATURES .colBoxHeadSubtxt {
font-family:Arial;
color:#999;
}
#colBoxCBOX .colBoxInner,
#colBoxFEATURES .colBoxInner {
border:5px solid #DDD;
}
#colBoxCBOX .colBoxIndex,
#colBoxFEATURES .colBoxIndex {
padding:5px 10px;
}
#colBoxCBOX .colBoxIcon img,
#colBoxFEATURES .colBoxIcon img {
border:1px solid #CCC;
box-sizing:border-box;
}
#colBoxCBOX .colBoxTitle h3,
#colBoxFEATURES .colBoxTitle h3 {
line-height:1.7;
font-weight:normal;
}
#colBoxCBOX .colBoxDescription,
#colBoxFEATURES .colBoxDescription {
display:block !important;
color:#999;
}
#colBoxCBOX .colBoxDescription p,
#colBoxFEATURES .colBoxDescription p {
line-height:1.7;
}
#colBoxCBOX .colBoxClear.h10px,
#colBoxFEATURES .colBoxClear.h10px {
height:0;
}
#cmsBody #colBoxARTICLEB .colBoxTitle h3 {
border:none;
clear:none;
font-size:inherit;
margin:0;
padding:0;
}
#cmsBody #colBoxARTICLEB .colBoxDescription {
display:block !important;
}
#cmsBody #colBoxARTICLEB .colBoxDescription p {
font-size:inherit;
margin:0;
padding:0;
}

/* SCROLL NAVIGATION */
/*-----------------------------------------------------------------*/
/* parts_scrollNavigation.css */

/*-----------------------------------------------------------------*/
/* popIn OVERWRITE */
/*-----------------------------------------------------------------*/
._popIn_recommend_header {
background-position:5px center !important;
padding:0 0 0 16px !important;
}
/*-----------------------------------------------------------------*/
/* ad */
/*-----------------------------------------------------------------*/
.colBoxITT {
margin:0 0 5px;
}
.colBoxITT .colBoxTitle {
background:url(http://image.itmedia.co.jp/images/ad/ITT_pr.gif) no-repeat 0 2px;
margin:0;
padding:0 0 0 24px;
}
.colBoxITT .colBoxTitle h3 {
font-size:12px;
line-height:16px;
font-weight:normal;
}
.colBoxITT .colBoxTitleSubtxt {
display:none;
}