/*--------------------------------------------------------------------------
GLOBAL
--------------------------------------------------------------------------*/
/* RESET */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
  background: transparent;
  border: 0;
  font-size: 100%;
  font-family: "Meiryo UI", "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "游ゴシック Medium", Yu Gothic Medium, YuGothicM, "游ゴシック体", YuGothic, sans-serif;
  margin: 0;
  outline: 0;
  padding: 0;
  vertical-align: baseline; /*position:relative;*/
  letter-spacing: 0.05em;
}

:focus {
  outline: 0
}

blockquote, q {
  quotes: none
}

blockquote:before, blockquote:after, q:before, q:after {
  content: '';
  content: none
}

caption, td, th {
  font-weight: normal;
  text-align: left
}

dt, strong, th {
  font-weight: bold
}

em {
  font-style: italic
}

ol, ul {
  list-style: none
}

sub {
  vertical-align: sub
}

sup {
  vertical-align: super
}

table {
  border-collapse: collapse;
  border-spacing: 0
}

/* DEFAULT */
a {
  color: #0066A0;
  cursor: pointer;
  text-decoration: none
}

a:hover {
  color: #860000;
  text-decoration: underline
}

body {
  background: #55585B url(/media/c/2012/images/base/bg-body.jpg);
  color: #252525;
  font: 14px "Meiryo UI", "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "游ゴシック Medium", Yu Gothic Medium, YuGothicM, "游ゴシック体", YuGothic, sans-serif;
  line-height: 1.5em;
  position: relative
}

button, input, select, textarea {
  font: normal 12px Arial, Helvetica, sans-serif
}

/*
h1, h2, h3, h4 { font-weight:bold; line-height:1.25 }
	h1, h2 { font-size:2.5em }
	h2 { font-size:1.3em;}
	h3 { font-size:1.167em }
	h4 { font-size:1em }
*/
/*table { width:100% }*/
td, th {
  vertical-align: top
}

h1 {
  font-size: 1.6em;
}

h2 {
  font-size: 1.3em;
}

h1 a, h2 a, h3 a, h4 a {
  color: inherit;
}

h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover {
  color: #860000
}


/*
--------------------------------------------------------------------------
Google icon
--------------------------------------------------------------------------*/

@import url("https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200");

.material-symbols-sharp {
  font-variation-settings: 'FILL' 0,
  'wght' 400,
  'GRAD' 0,
  'opsz' 20
}


/*
--------------------------------------------------------------------------
STRUCTURAL
--------------------------------------------------------------------------*/
/* LAYOUT */
.column-1, .column-2, .column-3, .column-4, .column-5, .column-6, .column-7, .column-8, .column-9, .column-10, .column-11, .column-12, .column-13, .column-14, .column-15, .column-16 {
  display: inline;
  float: left;
  margin-left: 10px;
  margin-right: 10px;
  position: relative
}

.column-1 {
  width: 60px
}

.column-2 {
  width: 140px
}

.column-3 {
  width: 220px
}

.column-4 {
  width: 300px
}

.column-5 {
  width: 380px
}

.column-6 {
  width: 460px
}

.column-7 {
  width: 540px
}

.column-8 {
  width: 620px
}

.column-9 {
  width: 700px
}

.column-10 {
  width: 780px
}

.column-11 {
  width: 860px
}

.column-12 {
  width: 940px
}

.first {
  margin-left: 0 !important
}

.last {
  margin-right: 0 !important
}

.left {
  float: left;
}

.right {
  float: right;
}

.bold {
  font-weight: bold;
}

.pb10 {
  padding-bottom: 10px
}

.pb15 {
  padding-bottom: 15px
}

.pb20 {
  padding-bottom: 20px
}

.pt10 {
  padding-top: 10px
}

.pt15 {
  padding-top: 15px
}

.pt20 {
  padding-top: 20px
}

.mb10 {
  margin-bottom: 10px !important
}

.mb15 {
  margin-bottom: 15px !important
}

.mb20 {
  margin-bottom: 20px !important
}

.mb30 {
  margin-bottom: 30px !important
}

.mt10 {
  margin-top: 10px !important
}

.mt15 {
  margin-top: 15px !important
}

.mt20 {
  margin-top: 20px !important
}

.mt30 {
  margin-top: 30px !important
}

.tc {
  text-align: center;
}

/* CLEARFIX */
.clearfix:after {
  clear: both;
  content: " ";
  display: block;
  font-size: 0;
  height: 0;
  visibility: hidden
}

.clearfix {
  display: inline-block
}

/* start commented backslash hack \*/
* html .clearfix {
  height: 1%
}

.clearfix {
  display: block
}

/* close commented backslash hack */
.clear {
  clear: both
}

/* CONTAINER */
#main {
  background: #FFF;
  padding: 15px;
  overflow: hidden;
}

#rbSkin {
  background: url(/media/c/2012/images/base/bg-page.png) repeat-x;
  background: -moz-linear-gradient(top, #EEE 0, #FFF 75px, #FFF 130px, rgba(255, 255, 255, 0.5) 500px, transparent 100%);
  background: -ms-linear-gradient(top, #EEE 0, #FFF 75px, #FFF 130px, rgba(255, 255, 255, 0.5) 500px, transparent 100%);
  background: -o-linear-gradient(top, #EEE 0, #FFF 75px, #FFF 130px, rgba(255, 255, 255, 0.5) 500px, transparent 100%);
  background: linear-gradient(top, #EEE 0, #FFF 75px, #FFF 130px, rgba(255, 255, 255, 0.5) 500px, transparent 100%);
  border-top: 1px solid #FFF;
}

/*17add*/
#rbSkin {
  background: #ffffff;
  border-top: none !important;
}

/*17add*/

#rbWrap {
  width: 100%;
  background: url(/media/c/2012/images/base/bg-wrapper-long.png);
  padding: 0px 0px 20px 0px;
  background-repeat: repeat-y;
  background-position: center;
}

.wrapper {
  margin: 0 auto;
  width: 1000px;
}

/* HEADER */
#rbHeader {
  background: #2a0000 url(/media/c/2012/images/base/header-cnet-jp.jpg) no-repeat 50% 0;
}

#rbHeader .int {
  height: 47px;
  position: relative;
  z-index: 10; /* <- must be higher than leaderboard + story slider */
}

#rbHeader .rbLogo {
  background: url(/media/c/2012/images/base/rb-logo.png) no-repeat 0 100%;
  height: 88px;
  left: -80px;
  position: absolute;
  top: 0;
  width: 256px;
}

#rbHeader .rbLogo a {
  display: block;
  height: 88px;
  margin-left: 86px;
  text-indent: -9999px;
  width: 104px;
}

#universalSearch {
  float: right;
  margin: 10px 10px 0 0;
  width: 190px;
}

#universalSearchBox {
  background: none;
  border: none;
  color: #575757;
  float: left;
  padding: 5px 0;
  width: 150px;
}

.searchBoxWrap {
  background: #FFF;
  border-bottom: 1px solid #7A3228;
  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.45), 0 1px 3px rgba(0, 0, 0, 0.5) inset;
  -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.45), 0 1px 3px rgba(0, 0, 0, 0.5) inset;
  -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.45), 0 1px 3px rgba(0, 0, 0, 0.5) inset;
  overflow: auto;
  padding-left: 10px;
  position: relative;
}

.searchGo {
  background: url(/media/c/2012/images/icon/icon-sprite.png) no-repeat 4px -560px;
  border: none;
  cursor: pointer;
  float: left;
  font-size: 0;
  height: 25px;
  line-height: 0;
  text-indent: -9999px;
  width: 25px;
}

.sns-list {
  float: right;
  width: 110px;
  margin: 10px 0px 0 0;
}

.sns-list ul {
  margin: 0;
  padding: 0
}

.sns-list ul li {
  float: left;
  padding: 0 5px 0 0;
}

/* google custom search */
.google_custom_search_form {
  float: right;
  margin: 10px 10px 0 0;
  width: 190px;
}

.google_custom_search_wrap {
  background: #FFF;
  border-bottom: 1px solid #7A3228;
  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.45), 0 1px 3px rgba(0, 0, 0, 0.5) inset;
  -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.45), 0 1px 3px rgba(0, 0, 0, 0.5) inset;
  -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.45), 0 1px 3px rgba(0, 0, 0, 0.5) inset;
  overflow: auto;
  padding-left: 10px;
  position: relative;
}

.google_custom_search_box {
  background: none;
  border: none !important;
  color: #575757;
  float: left;
  height: 19px;
  width: 140px;
  margin-top: 2px;
}

.google_custom_search_go {
  background: url(/media/c/2012/images/icon/icon-sprite.png) no-repeat 4px -560px;
  border: none;
  cursor: pointer;
  float: left;
  font-size: 0;
  height: 25px;
  line-height: 0;
  text-indent: -9999px;
  width: 25px;
}

.google_custom_search_form_responsive {
  float: right;
  width: 190px;
  margin: 0;
}

.google_custom_search_wrap_responsive {
  background: #FFF;
  border-bottom: 1px solid #7A3228;
  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.45), 0 1px 3px rgba(0, 0, 0, 0.5) inset;
  -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.45), 0 1px 3px rgba(0, 0, 0, 0.5) inset;
  -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.45), 0 1px 3px rgba(0, 0, 0, 0.5) inset;
  overflow: auto;
  padding-left: 10px;
  position: relative;
  height: 30px;
  overflow: hidden;
}

.google_custom_search_box_responsive {
  background: none;
  border: none !important;
  color: #575757;
  float: left;
  height: 19px;
  width: 140px;
  margin-top: 2px;
}

.google_custom_search_go_responsive {
  background: url(/media/c/2012/images/icon/icon-sprite.png) no-repeat 4px -560px;
  border: none;
  cursor: pointer;
  float: left;
  font-size: 0;
  height: 25px;
  line-height: 0;
  text-indent: -9999px;
  width: 25px !important;
}


/* NAVIGATION */
#primaryNav {
  background: #39393B;
  background: -moz-linear-gradient(top, #626265, #39393B);
  background: -ms-linear-gradient(top, #626265, #39393B);
  background: -o-linear-gradient(top, #626265, #39393B);
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#626265), to(#39393B));
  background: -webkit-linear-gradient(top, #626265, #39393B);
  background: linear-gradient(top, #626265, #39393B);
  box-shadow: 0 1px 1px rgba(160, 160, 160, 0.75) inset, 0 -2px 20px rgba(111, 4, 2, 0.8);
  -moz-box-shadow: 0 1px 1px rgba(160, 160, 160, 0.75) inset, 0 -2px 20px rgba(111, 4, 2, 0.8);
  -webkit-box-shadow: 0 1px 1px rgba(160, 160, 160, 0.75) inset, 0 -2px 20px rgba(111, 4, 2, 0.8);
  height: 41px;
}

#primaryNavBar i {
  display: none;
}

#primaryNavBar > li {
  float: left;
  position: relative;
  padding-bottom: 0;
}

#primaryNavBar > li > a, #subNavBar > li > a {
  color: #FFF;
  float: left;
  font: bold 0.92em/41px 'メイリオ', meiryo, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'ＭＳ Ｐゴシック', sans-serif;
  height: 41px;
  left: -1px;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.8);
  -khtml-text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.8);
  -moz-text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.8);
  -webkit-text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.8);
  padding: 0 9px;
  position: relative;
}

#primaryNavBar > li > a:hover, #primaryNavBar > li > a.active {
  background: #252527;
  background: rgba(0, 0, 0, 0.4);
  box-shadow: 1px 0 1px #2A2A2A inset, -1px 0 1px #2A2A2A inset, 2px -1px 1px -1px #5B5B5E, -2px -1px 1px -1px #5B5B5E;
  -moz-box-shadow: 1px 0 1px #2A2A2A inset, -1px 0 1px #2A2A2A inset, 2px -1px 1px -1px #5B5B5E, -2px -1px 1px -1px #5B5B5E;
  -webkit-box-shadow: 1px 0 1px #2A2A2A inset, -1px 0 1px #2A2A2A inset, 2px -1px 1px -1px #5B5B5E, -2px -1px 1px -1px #5B5B5E;
  text-decoration: none;
}

#primaryNavBar > li.expandable .menuHead {
  padding-right: 5px;
}

#primaryNavBar > li.expandable .menuHead span {
  background: url(/media/c/2012/images/icon/icon-sprite.png) no-repeat -26px -653px;
  display: inline-block;
  height: 10px;
  margin-left: 1px;
  vertical-align: middle;
  width: 10px;
}

#primaryNavBar > li.expandable .menuWrapper, #edition .menuWrapper {
  background: #D6D7D7;
  background: -moz-linear-gradient(top, #6B6D6E, #565758);
  background: -ms-linear-gradient(top, #6B6D6E, #565758);
  background: -o-linear-gradient(top, #6B6D6E, #565758);
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#6B6D6E), to(#565758));
  background: -webkit-linear-gradient(top, #6B6D6E, #565758);
  background: linear-gradient(top, #6B6D6E, #565758);
  border-radius: 0 3px 3px 3px;
  -moz-border-radius: 0 3px 3px 3px;
  -webkit-border-radius: 0 3px 3px 3px;
  display: none;
  left: 0;
  padding: 5px 5px 6px 5px;
  position: absolute;
  top: 36px;
  z-index: 9999;
}

#primaryNavBar > li.expandable .menuWrapper .nav, #edition .menuWrapper .nav {
  background: #F4F4F4;
  border: 1px solid rgba(86, 87, 88, 0.8);
  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.45);
  -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.45);
  -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.45);
  line-height: 1.333em;
  padding: 15px 5px 20px;
}

#primaryNavBar > li.expandable .menuWrapper ul {
  float: left;
  font-size: 1em;
}

#primaryNavBar > li.expandable .menuWrapper li a, #edition .menuWrapper li a, #edition .menuWrapper p {
  border-bottom: 1px solid #DDD;
  box-shadow: 0 1px 0 #FFF;
  -moz-box-shadow: 0 1px 0 #FFF;
  -webkit-box-shadow: 0 1px 0 #FFF;
  clear: left;
  color: #252525;
  display: inline-block;
  float: left;
  text-shadow: 0 1px 0 #FFF;
  -khtml-text-shadow: 0 1px 0 #FFF;
  -moz-text-shadow: 0 1px 0 #FFF;
  -webkit-text-shadow: 0 1px 0 #FFF;
  margin: 0 10px;
  padding: 5px 0 5px 2px;
  width: 220px;
}

#primaryNavBar > li.expandable .menuWrapper li a:hover, #edition .menuWrapper li a:hover {
  background-color: #EEE;
  color: #860000;
  text-decoration: none;
}

#primaryNavBar > li.expandable:hover {
  z-index: 10; /* <- must be higher than leaderboard + story slider */
}

#primaryNavBar > li.expandable:hover .menuHead {
  background: #EDEDED;
  background: -moz-linear-gradient(top, #808182, #6D6D6E);
  background: -ms-linear-gradient(top, #808182, #6D6D6E);
  background: -o-linear-gradient(top, #808182, #6D6D6E);
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#808182), to(#6D6D6E));
  background: -webkit-linear-gradient(top, #808182, #6D6D6E);
  background: linear-gradient(top, #808182, #6D6D6E);
  border: 1px solid #414141;
  border-bottom: 0;
  border-radius: 3px 3px 0 0;
  -moz-border-radius: 3px 3px 0 0;
  -webkit-border-radius: 3px 3px 0 0;
  box-shadow: 2px -1px 3px -3px rgba(0, 0, 0, 0.8), 0 1px 0 rgba(255, 255, 255, 0.35) inset;
  -moz-box-shadow: 2px -1px 3px -3px rgba(0, 0, 0, 0.8), 0 1px 0 rgba(255, 255, 255, 0.35) inset;
  -webkit-box-shadow: 2px -1px 3px -3px rgba(0, 0, 0, 0.8), 0 1px 0 rgba(255, 255, 255, 0.35) inset;
  height: 37px;
  left: -1px;
  margin-top: -1px;
  padding: 0 4px 0 8px;
  position: relative;
}

#primaryNavBar > li.expandable:hover .menuHead span {
  background-position: -27px -629px;
}

#primaryNavBar > li.expandable:hover .menuWrapper, #edition:hover .menuWrapper,
#primaryNavBar > li.expandable .menuWrapper.visible {
  display: block;
  box-shadow: 0 4px 4px 1px rgba(0, 0, 0, 0.25), 0 1px 0 rgba(255, 255, 255, 0.35) inset;
  -moz-box-shadow: 0 4px 4px 1px rgba(0, 0, 0, 0.25), 0 1px 0 rgba(255, 255, 255, 0.35) inset;
  -webkit-box-shadow: 0 4px 4px 1px rgba(0, 0, 0, 0.25), 0 1px 0 rgba(255, 255, 255, 0.35) inset;
}

#primaryNavBar li.home {
  margin-left: 160px;
}

#primaryNavBar li.home a {
  background: url(/media/c/2012/images/icon/icon-sprite.png) no-repeat 18px -842px;
  text-indent: -9999px;
  width: 30px;
}

#primaryNavBar li.home a:hover, #primaryNavBar > li.home a.active {
  background-position: 18px -586px;
  box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
}

#primaryNavBar > li.expandable .display_l {
  position: absolute;
  right: 2px !important;
  left: auto;
}

#primaryNavBar .menuinfo {
  width: 450px;
}

#primaryNavBar .menuinfo .nav,
#primaryNavBar .menuinfo #lateststories {
  float: left;
}

#lateststories {
  width: 300px;
  margin-left: 10px;
}

#lateststories a {
  color: #fff;
}

#lateststories dl {
  margin-top: 15px;
}

#lateststories dt {
  color: #111;
  text-shadow: 1px 1px 1px #888;
  font-size: 1.25em;
  font-weight: bold;
  margin-bottom: 5px;
}

#lateststories dt span {
  color: yellow;
  text-shadow: none;
}

#lateststories dd {
  margin: 0 10px;
  padding: 6px 0;
  border-bottom: 1px solid #444;
  box-shadow: 0 1px 0 #777;
}

#primaryNavBar > li.expandable .menuinfo li a, #edition .menuinfo li a, #edition .menuinfo p {
  width: 100px;
}

#tabmenu_01 {
  margin-left: 160px;
}

#tabmenu_02 a {
  font-size: 110% !important;
}

#tabmenu_04 .menuWrapper .nav {
  width: 310px;
}

#tabmenu_04 .menuWrapper ul,
#tabmenu_04 .menuWrapper li a {
  width: 150px !important
}

#tabmenu_05 .menuWrapper .nav {
  width: 260px;
}

#tabmenu_05 .menuWrapper ul,
#tabmenu_05 .menuWrapper li a {
  width: 120px !important;
}

#tabmenu_08 img {
  position: relative;
  top: 2px;
}


#primaryNavBar li#zd_menubtn:hover .menuHead {
  background: #15293E;
  background: -moz-linear-gradient(top, #24476C, #15293E);
  background: -ms-linear-gradient(top, #24476C, #15293E);
  background: -o-linear-gradient(top, #24476C, #15293E);
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#24476C), to(#15293E));
  background: -webkit-linear-gradient(top, #24476C, #15293E);
  background: linear-gradient(top, #24476C, #15293E);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#24476C, endColorstr=#15293E);
}

#zd_menubtn .menuWrapper {
  background: #15293E !important;
  background: -moz-linear-gradient(top, #24476C, #15293E) !important;
  background: -ms-linear-gradient(top, #24476C, #15293E) !important;
  background: -o-linear-gradient(top, #24476C, #15293E) !important;
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#24476C), to(#15293E)) !important;
  background: -webkit-linear-gradient(top, #24476C, #15293E) !important;
  background: linear-gradient(top, #24476C, #15293E) !important;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#24476C, endColorstr=#15293E) !important;
  border-radius: 3px !important;
  -moz-border-radius: 3px !important;
  -webkit-border-radius: 3px !important;
}

#zd_menubtn .notification-area {
  width: 410px;
}

#zd_menubtn .notification-area div {
  color: #ffffff;
}

#primaryNavBar li#tr_menubtn a {
  padding: 0 4px;
}

li.loginAction {
  float: right !important;
}

li.loginAction a.menuHead {
  background: #808182;
  background: -moz-linear-gradient(top, #808182, #6D6D6E);
  background: -ms-linear-gradient(top, #808182, #6D6D6E);
  background: -o-linear-gradient(top, #808182, #6D6D6E);
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#808182), to(#6D6D6E));
  background: -webkit-linear-gradient(top, #808182, #6D6D6E);
  background: linear-gradient(top, #808182, #6D6D6E);
  border: 1px solid #414141;
  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  box-shadow: 2px -1px 3px -3px rgba(0, 0, 0, 0.8), 0 1px 0 rgba(255, 255, 255, 0.35) inset;
  -moz-box-shadow: 2px -1px 3px -3px rgba(0, 0, 0, 0.8), 0 1px 0 rgba(255, 255, 255, 0.35) inset;
  -webkit-box-shadow: 2px -1px 3px -3px rgba(0, 0, 0, 0.8), 0 1px 0 rgba(255, 255, 255, 0.35) inset;
  height: 40px !important;
  left: -1px;
  margin: -1px 0 0 0;
  padding: 0 4px 0 11px !important;
  position: relative;
}

#login_btn {
  width: 32px;
  height: 32px;
  margin-top: 3px;
  margin-left: 12px;
  border: 1px solid #333;
  background: #aaa;
  -moz-box-shadow: inset 0 0 3px #666;
  -webkit-box-shadow: inset 0 0 3px #666;
  box-shadow: inset 0 0 3px #666;
}

#subNav {
  background: #252527;
  background: -moz-linear-gradient(top, #252527, #444446);
  background: -ms-linear-gradient(top, #252527, #444446);
  background: -o-linear-gradient(top, #252527, #444446);
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#252527), to(#444446));
  background: -webkit-linear-gradient(top, #252527, #444446);
  background: linear-gradient(top, #252527, #444446);
  text-align: center;
}

#subNavBar li {
  display: inline;
}

#subNavBar li a {
  color: #CCC;
  display: inline-block;
  height: 36px;
  float: none;
  font-size: 1.167em;
  line-height: 36px;
}

#subNavBar li a:hover, #subNavBar li a.active {
  color: #FFF;
  text-decoration: none;
}

#subNavBar li a.highlight {
  color: #F73;
}

#edition .siteLogo {
  display: block;
  height: 47px;
  left: 180px;
  position: absolute;
  text-indent: -9999px;
  width: 50px;
}

#edition:hover .siteLogo {
  background: url(/media/c/2012/images/base/menu-arrow.png) no-repeat 27px 30px;
  z-index: 10000;
}

#edition .menuWrapper {
  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  left: 120px;
  top: 40px;
}

f
#edition .menuWrapper li {
  font-size: 1.167em;
}

#edition .menuWrapper li a, #edition .menuWrapper p {
  width: 150px;
}

#edition .menuWrapper p {
  font-size: .917em;
  padding-top: 0;
}

/* FOOTER */
#rbFooter {
  font-size: 12px;
  background: url(/media/c/2012/images/base/rb-logo-footer.png) no-repeat 50% 100%;
  line-height: 1.333em;
  padding: 20px 0 178px 0;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.8);
  -khtml-text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.8);
  -moz-text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.8);
  -webkit-text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.8);
}

#rbFooter a {
  color: #fff;
}

#rbFooter ul,
#rbFooter li. {
  font-size: 12px;
}

#rbFooter, .rbFooterMap h4 a {
  color: #B7B7B7 !important;
}

.rbFooterMap, .rbFooterCopy {
  margin: 0 auto;
  width: 940px;
}

.rbFooterMap {
  border-bottom: 1px solid #4f5354;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1);
  -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1);
  -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1);
  margin-bottom: 20px;
}

.rbFooterMap h4 {
  font-size: 1.333em;
}

.rbFooterMap ul {
  margin: 0 0 20px 0;
  overflow: auto;
}

.rbFooterMap li {
  font-size: 1.083em;
  margin: 10px 0 0 0;
}

.rbFooterSponsors {
  background: #3d3d3d;
  background: rgba(0, 0, 0, 0.24);
  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.25), 0 0 5px rgba(0, 0, 0, 0.25) inset;
  -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.25), 0 0 5px rgba(0, 0, 0, 0.25) inset;
  -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.25), 0 0 5px rgba(0, 0, 0, 0.25) inset;
  padding: 10px;
}

.rbFooterSponsors h4 {
  font-size: 1.083em;
}

.rbFooterSponsors ul {
  margin: 0;
}

.simple-footer li {
  display: inline;
  margin: 0 10px 0 0;
}

.simple-footer li:after {
  content: "|";
  position: relative;
  padding: 0 0 0 10px;
}

.simple-footer li.last:after {
  content: "";
  padding: 0;
}

#rbFooter .about_ai {
  color: white;
  margin: 10px 0;
  font-size: 12px;
  text-align: center;
}

#rbFooter .about_ai dd {
  display: inline;
  padding: 0 5px;
  border-right: solid 1px white;
}

#rbFooter .copyright_ai {
  font-size: 10px;
  color: white;
  margin: 0;
  text-align: center;
}

#contents_r .rcol_cont {
  margin-bottom: 20px;
}

/* -----------------------------------------------------------------------
  MARKETERS TOP AD
--------------------------------------------------------------------------*/
#marketers_header {
  background: #E0E0E0;
  background: -moz-linear-gradient(top, #F2F2F2, #E0E0E0);
  background: -ms-linear-gradient(top, #F2F2F2, #E0E0E0);
  background: -o-linear-gradient(top, #F2F2F2, #E0E0E0);
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#F2F2F2), to(#E0E0E0));
  background: -webkit-linear-gradient(top, #F2F2F2, #E0E0E0);
  background: linear-gradient(top, #F2F2F2, #E0E0E0);
  box-shadow: 0 -6px 10px #E7E7E7 inset;
  -moz-box-shadow: 0 -6px 10px #E7E7E7 inset;
  -webkit-box-shadow: 0 -6px 10px #E7E7E7 inset;
  clear: both;
  padding: 20px 0;
  text-align: center;
}

#marketers_header .marketers_header_inner {
  width: 1000px;
  margin: 0 auto 0 20px;
}

#marketers_header #leaderboard-top {
  width: 728px;
  height: 90px;
  overflow: hidden;
  float: right;
  background: none;
  clear: none;
  padding: 0;
}

#marketers_header .leaderboard .ad {
  width: 728px;
}

#marketers_header .sub_logo {
  width: 245px;
  float: left;
  margin-top: 20px;
}


/*
--------------------------------------------------------------------------
ADS
--------------------------------------------------------------------------*/
.leaderboard .ad {
  margin: 0 auto;
  position: relative;
  width: 980px;
  z-index: 2; /* <- must be higher than follow bar */
}

#leaderboard-bottom {
  background: #E0E0E0;
  background: -moz-linear-gradient(top, #F2F2F2, #E0E0E0);
  background: -ms-linear-gradient(top, #F2F2F2, #E0E0E0);
  background: -o-linear-gradient(top, #F2F2F2, #E0E0E0);
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#F2F2F2), to(#E0E0E0));
  background: -webkit-linear-gradient(top, #F2F2F2, #E0E0E0);
  background: linear-gradient(top, #F2F2F2, #E0E0E0);
  box-shadow: 0 6px 10px #E7E7E7 inset;
  -moz-box-shadow: 0 6px 10px #E7E7E7 inset;
  -webkit-box-shadow: 0 6px 10px #E7E7E7 inset;
  clear: both;
  padding: 10px 0;
  text-align: center;
}

#leaderboard-top {
  background: #E0E0E0;
  background: -moz-linear-gradient(top, #F2F2F2, #E0E0E0);
  background: -ms-linear-gradient(top, #F2F2F2, #E0E0E0);
  background: -o-linear-gradient(top, #F2F2F2, #E0E0E0);
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#F2F2F2), to(#E0E0E0));
  background: -webkit-linear-gradient(top, #F2F2F2, #E0E0E0);
  background: linear-gradient(top, #F2F2F2, #E0E0E0);
  box-shadow: 0 -6px 10px #E7E7E7 inset;
  -moz-box-shadow: 0 -6px 10px #E7E7E7 inset;
  -webkit-box-shadow: 0 -6px 10px #E7E7E7 inset;
  clear: both;
  padding: 10px 0;
  text-align: center;
}

/*17add*/
#leaderboard-top {
  background: #ffffff !important;
  clear: both;
  padding: 10px 0;
  text-align: center;
  box-shadow: none;
}

.leaderboard {
  background: #ffffff !important;
}

/*17add*/

.ad a {
  color: inherit
}

.ad_large_footer_wrapper {
  clear: both
}

.ad_large_footer {
  text-align: center; /*padding-top: 20px*/
}

.ad_container {
  font-size: 0;
  line-height: 0
}

.leaf_style .ad_large > div {
  min-height: 90px;
}

.ad_large > div {
  min-height: 90px;
}

/* close up */
.close_up {
  padding: 0 10px;
  background-color: #e4e4e4;
  -moz-box-shadow: inset 0 0 2px #999;
  -webkit-box-shadow: inset 0 0 2px #999;
  box-shadow: inset 0 0 2px #999;
}

.close_up li {
  float: left;
  width: 19%;
  text-align: center;
  padding-bottom: 0;
}

.closeup_title {
  margin-right: 20px;
  font-weight: bold;
  background: url(/media/c/2012/images/icon/icon_arrow_k.png) no-repeat right 50%;
}

.tieup_sp {
  text-align: center;
}

.tieup_sp h3 {
  padding: 5px 0;
}

.tieup_sp p {
  margin-bottom: 5px;
}

.tieup li {
  border-bottom: 1px solid #DDD;
  padding: 7px 0 3px;
}

.tieup img {
  border: 1px solid #CCC;
  float: left;
  margin: 0 5px 10px 0;
  padding: 0;
}

.tieup li a {
  color: #252525;
}

.tieup li a:hover {
  color: #860000
}

#contents_r ul.tieup li p {
  font-size: 12px;
}

.tieup li.arrow {
  list-style-image: none;
  background: url('/media/z/2011/arrow_gray.gif') no-repeat 10px 12px;
  margin: 0 0 5px 0;
  padding-left: 10px;
}

#tieup_control .tieup li.arrow b {
  padding-left: 20px;
}

#tieup_control .tieup li.arrow p {
  padding-left: 20px;
}

#cnetid-lead {
  margin-top: -6px;
}

.ad_square_leaf {
  float: left;
  margin: 0 10px 10px 0;
}

.block_story .ad_square_leaf object, .block_story .ad_square_leaf embed {
  display: block;
  margin: 0;
  text-align: left;
}

.ad_text {
  margin-bottom: 10px;
  padding-top: 5px;
  border-top: 1px solid #CCC;
  border-bottom: 1px solid #CCC;
}

.ad_text_top,
.ad_text_bottom {
  margin: 0;
  padding: 0 0 4px 0;
  border: none;
  zoom: 1;
  font-size: 12px;
}

.ad_text_top a,
.ad_text_bottom a {
  color: #252525 !important;
  font-weight: normal !important;
  text-decoration: none !important;
}

.ad_text_top a:hover,
.ad_text_bottom a:hover {
  color: #860000 !important;
  text-decoration: underline !important;
}

.ad_text_top a:before,
.ad_text_bottom a:before {
  content: "PR";
  position: relative;
  color: #bbbbbb;
  border-right: 1px solid #bbbbbb;
  margin-right: 5px;
  padding-right: 5px;
  font-size: 85%;
}

.ad_rect_top {
  margin-bottom: 10px;
}

.block_ad_reg_banner {
  margin-bottom: 10px;
  text-align: center;
}

#ad_rect > div {
  min-height: 250px
}

.adsense_mainbox01 {
  margin: 20px 0 0 0;
  padding: 5px 0 3px 3px;
  background: #E4E4E4;
}

.adsense_3columnbox {
  background: url('/media/c/2010/image/bg/adsense-3columnbox-bg.gif') 2px bottom no-repeat;
  margin-bottom: 2px;
}

.adsense_box01 {
  width: 202px;
  border-top: 1px solid #D5D5D5;
  margin: 0 0 0 2px;
  padding: 5px;
  float: left;
}

.adsense_box01 img {
  border: 1px solid #CCC;
  float: left;
  padding: 2px;
}

.adsense_box01 p {
  width: 110px;
  float: left;
  font-size: 12px;
  margin-left: 4px;
  line-height: 1.3;
}

.adsense_box01 p a {
  font-weight: bold;
}

p.note {
  color: #666;
  font-size: 12px;
  margin: 10px 15px;
}

.ad_interestmatch {
  border: 1px solid #CCC;
  padding: 10px; /*margin-bottom: 20px;*/
  margin-bottom: 0 !important;
}

.ad_interestmatch li {
  margin-bottom: 5px;
}

.ad_interestmatch a {
  color: #252525;
}

.ad_interestmatch a:hover {
  color: #860000
}

.ad_interestmatch .title {
  font-weight: bold;
}

.ad_interestmatch .desc {
  margin-left: 10px;
}

.ad_interestmatch .about {
  text-align: right;
}

.ad_interestmatch .about a {
  font-weight: bold;
}

.ad_interestmatch ul.list_disc li {
  list-style: disc inside;
}

.ad_interestmatch .adby {
  text-align: right;
  font-size: 11px;
}


.time, .txt_pr {
  font-size: 11px;
  color: #BBB;
}

.txt_pr {
  margin-left: 5px;
}

.newsletter img {
  vertical-align: middle
  margin: 20px 0;
}

#tieup_control .tieup b {
  display: block
}

#tieup_control .tieup b,
#tieup_control .tieup p {
  padding-left: 45px;
}

/* -----------------------------*-----------------------------------------
 LARGE IMAGE
--------------------------------------------------------------------------*/
#l_img_main {
  text-align: center;
  background: white;
  padding: 20px 0;
}

#l_img_main img {
  margin: 10px 0;
}

#l_img_main .link a {
  border: 1px #E8E8E8 solid;
  padding: 5px;
  font-weight: normal;
  font-size: 14px;
  text-decoration: none
}

#l_img_main .caption {
  width: 80%;
  font-size: 16px;
  margin: 0 auto 10px auto;
}

/* -----------------------------------------------------------------------
 TITLES
--------------------------------------------------------------------------*/
/* category title*/
.t_category {
  clear: both;
  margin: 20px 0 10px;
  padding-left: 20px;
  background: #3a3a3d;
  /*filter: progid:DXImageTransform.Microsoft.Gradient(Enabled=1,GradientType=0,StartColorStr=#3a3a3d,EndColorStr=#5b5b5e); */
  background: -moz-linear-gradient(top, #3a3a3d, #5b5b5e);
  background: -webkit-gradient(linear, left top, left bottom, from(#3a3a3d), to(#5b5b5e));
  border-top: 1px solid #999999;
  border-right: 1px solid #999999;
  border-left: 1px solid #999999;

  border-top-left-radius: 3px;
  -webkit-border-top-left-radius: 3px;
  -moz-border-top-left-radius: 3px;

  border-top-right-radius: 3px;
  -webkit-border-top-right-radius: 3px;
  -moz-border-top-right-radius: 3px;

  -moz-box-shadow: inset 1px 1px 1px #eeeeee;
  -webkit-box-shadow: inset 0px 1px 1px #eeeeee;
  box-shadow: inset 0px 1px 1px #eeeeee;

  color: #fff;
  -moz-text-shadow: 0 -1px 0 #000;
  -webkit-text-shadow: 0 -1px 0 #000;
  text-shadow: 0 -1px 0 #000;
}

h2.t_category {
  clear: both;
  margin: 20px 0 10px;
  /*padding-left: 20px;*/
  padding: 5px 0 5px 20px;
  background: #3A3A3D;
  /*filter: progid:DXImageTransform.Microsoft.Gradient(Enabled=1,GradientType=0,StartColorStr=#5b5b5e,EndColorStr=#3a3a3d); */
  background: linear-gradient(top, #5B5B5E, #3A3A3D);
  background: -ms-linear-gradient(top, #5B5B5E, #3A3A3D);
  background: -moz-linear-gradient(top, #5B5B5E, #3A3A3D);
  background: -webkit-gradient(linear, left top, left bottom, from(#5B5B5E), to(#3A3A3D));
  border-top: 1px solid #3C3C3E;
  border-right: 1px solid #3C3C3E;
  border-left: 1px solid #3C3C3E;
  border-radius: 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -moz-box-shadow: inset 0px 1px 0px #999999;
  -webkit-box-shadow: inset 0px 1px 0px #999999;
  box-shadow: inset 0px 1px 0px #999999;
  color: white;
  -moz-text-shadow: 0 -1px 0 #000;
  -webkit-text-shadow: 0 -1px 0 #000;
  text-shadow: 0 -1px 0 black;
  outline-width: 0;
  outline-style: none;
  outline-color: invert;
}

h2.t_category .header_icon {
  float: right;
  margin-top: 4px;
}

h2.t_category a {
  color: #fff;
}

h2.t_category a:hover {
  color: inherit;
}

h2.t_category a.next,
h2.t_category a.prev {
  display: block;
  width: 25px;
  height: 18px;
  line-height: 18px;
  float: right;
  background: url(/media/c/2012/images/icon/custom-sprite.png) no-repeat;
  text-indent: -9999px;
}

h2.t_category a.next {
  background-position: right -291px;
  border-left: 1px solid #ccc;
  padding-left: 4px;
}

h2.t_category a.prev {
  background-position: 0 -270px;
  border-right: 1px solid #000;
  padding-right: 2px;
}

h2.t_category a.disabled {
  background: none;
  cursor: default;
}


h4.special_pr {
  clear: both;
  margin: 10px 0;
  padding: 5px 10px !important;
  background-color: #E4E4E4 !important;
  -moz-box-shadow: inset 0 0 2px #999;
  -webkit-box-shadow: inset 0 0 2px #999;
  box-shadow: inset 0 0 2px #999;
}

#digital_header {
  font-size: 1.6em;
  font-weight: bold;
  line-height: 1.8em;
  color: #4575A3;
  border-bottom: 2px solid #4575A3;
  margin-bottom: 20px;
}


/* -----------------------------------------------------------------------
 STAMPS
--------------------------------------------------------------------------*/
/** top stamp ---------------*/
.top_stamp,
.top_stamp_square {
  height: 13px;
  line-height: 13px;
  display: inline-block;
  zoom: 1; /* zoom and *display = ie7 hack for display:inline-block */
  *display: inline;
  vertical-align: baseline;
  margin: 0 1px;
  padding: 2px 0px 0px 1px;
  outline: none;
  cursor: pointer;
  text-align: center;
  text-decoration: none;
  font-size: 11px;
  font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', sans-serif, 'ＭＳ Ｐゴシック';
  font-weight: lighter;
}

.top_stamp:hover,
.top_stamp_square:hover {
  text-decoration: none;
}

.top_stamp:active,
.top_stamp_square:active {
  position: relative;
  top: 1px;
}

.top_stamp {
  -webkit-border-radius: .5em;
  -moz-border-radius: .5em;
  border-radius: .5em;
}

.top_stamp_square {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
}

/* color styles
---------------------------------------------- */

/* black */
.black {
  color: #d7d7d7;
  border: solid 1px #333;
  background: #333;
  background: -webkit-gradient(linear, left top, left bottom, from(#666), to(#000));
  background: -moz-linear-gradient(top, #666, #000);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#666666', endColorstr='#000000');
}

.black:hover {
  background: #000;
  background: -webkit-gradient(linear, left top, left bottom, from(#444), to(#000));
  background: -moz-linear-gradient(top, #444, #000);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#444444', endColorstr='#000000');
}

.black:visited {
  color: #d7d7d7;
}

.black:active {
  color: #666;
  background: -webkit-gradient(linear, left top, left bottom, from(#000), to(#444));
  background: -moz-linear-gradient(top, #000, #444);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#000000', endColorstr='#666666');
}

/* gray */
.gray {
  color: #e9e9e9;
  border: solid 1px #555;
  background: #6e6e6e;
  background: -webkit-gradient(linear, left top, left bottom, from(#888), to(#575757));
  background: -moz-linear-gradient(top, #888, #575757);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#888888', endColorstr='#575757');
}

.gray:visited {
  color: #e9e9e9;
}

.gray:hover {
  background: #616161;
  background: -webkit-gradient(linear, left top, left bottom, from(#757575), to(#4b4b4b));
  background: -moz-linear-gradient(top, #757575, #4b4b4b);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#757575', endColorstr='#4b4b4b');
}

.gray:active {
  color: #afafaf;
  background: -webkit-gradient(linear, left top, left bottom, from(#575757), to(#888));
  background: -moz-linear-gradient(top, #575757, #888);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#575757', endColorstr='#888888');
}

/* white */
.white {
  color: #606060;
  border: solid 1px #b7b7b7;
  background: #fff;
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ededed));
  background: -moz-linear-gradient(top, #fff, #ededed);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ededed');
}

.white:visited {
  color: #606060;
}

.white:hover {
  background: #ededed;
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#dcdcdc));
  background: -moz-linear-gradient(top, #fff, #dcdcdc);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#dcdcdc');
}

.white:active {
  color: #999;
  background: -webkit-gradient(linear, left top, left bottom, from(#ededed), to(#fff));
  background: -moz-linear-gradient(top, #ededed, #fff);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#ffffff');
}

/* orange */
.orange {
  color: #fef4e9;
  border: solid 1px #da7c0c;
  background: #f78d1d;
  background: -webkit-gradient(linear, left top, left bottom, from(#faa51a), to(#f47a20));
  background: -moz-linear-gradient(top, #faa51a, #f47a20);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#faa51a', endColorstr='#f47a20');
}

.orange:visited {
  color: #fef4e9;
}

.orange:hover {
  background: #f47c20;
  background: -webkit-gradient(linear, left top, left bottom, from(#f88e11), to(#f06015));
  background: -moz-linear-gradient(top, #f88e11, #f06015);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f88e11', endColorstr='#f06015');
}

.orange:active {
  color: #fcd3a5;
  background: -webkit-gradient(linear, left top, left bottom, from(#f47a20), to(#faa51a));
  background: -moz-linear-gradient(top, #f47a20, #faa51a);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f47a20', endColorstr='#faa51a');
}

/* red */
.red {
  color: #faddde;
  border: solid 1px #980c10;
  background: #d81b21;
  background: -webkit-gradient(linear, left top, left bottom, from(#ed1c24), to(#aa1317));
  background: -moz-linear-gradient(top, #ed1c24, #aa1317);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ed1c24', endColorstr='#aa1317');
}

.red:visited {
  color: #faddde;
}

.red:hover {
  background: #b61318;
  background: -webkit-gradient(linear, left top, left bottom, from(#c9151b), to(#a11115));
  background: -moz-linear-gradient(top, #c9151b, #a11115);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#c9151b', endColorstr='#a11115');
}

.red:active {
  color: #de898c;
  background: -webkit-gradient(linear, left top, left bottom, from(#aa1317), to(#ed1c24));
  background: -moz-linear-gradient(top, #aa1317, #ed1c24);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#aa1317', endColorstr='#ed1c24');
}

/* blue */
.blue {
  color: #d9eef7;
  border: solid 1px #0076a3;
  background: #0095cd;
  background: -webkit-gradient(linear, left top, left bottom, from(#00adee), to(#0078a5));
  background: -moz-linear-gradient(top, #00adee, #0078a5);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00adee', endColorstr='#0078a5');
}

.blue:visited {
  color: #d9eef7;
}

.blue:hover {
  background: #007ead;
  background: -webkit-gradient(linear, left top, left bottom, from(#0095cc), to(#00678e));
  background: -moz-linear-gradient(top, #0095cc, #00678e);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0095cc', endColorstr='#00678e');
}

.blue:active {
  color: #80bed6;
  background: -webkit-gradient(linear, left top, left bottom, from(#0078a5), to(#00adee));
  background: -moz-linear-gradient(top, #0078a5, #00adee);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0078a5', endColorstr='#00adee');
}

/* rosy */
.rosy {
  color: #fae7e9;
  border: solid 1px #b73948;
  background: #da5867;
  background: -webkit-gradient(linear, left top, left bottom, from(#f16c7c), to(#bf404f));
  background: -moz-linear-gradient(top, #f16c7c, #bf404f);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f16c7c', endColorstr='#bf404f');
}

.rosy:visited {
  color: #fae7e9;
}

.rosy:hover {
  background: #ba4b58;
  background: -webkit-gradient(linear, left top, left bottom, from(#cf5d6a), to(#a53845));
  background: -moz-linear-gradient(top, #cf5d6a, #a53845);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cf5d6a', endColorstr='#a53845');
}

.rosy:active {
  color: #dca4ab;
  background: -webkit-gradient(linear, left top, left bottom, from(#bf404f), to(#f16c7c));
  background: -moz-linear-gradient(top, #bf404f, #f16c7c);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bf404f', endColorstr='#f16c7c');
}

/* green */
.green {
  color: #e8f0de;
  border: solid 1px #538312;
  background: #64991e;
  background: -webkit-gradient(linear, left top, left bottom, from(#7db72f), to(#4e7d0e));
  background: -moz-linear-gradient(top, #7db72f, #4e7d0e);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#7db72f', endColorstr='#4e7d0e');
}

.green:visited {
  color: #e8f0de;
}

.green:hover {
  background: #538018;
  background: -webkit-gradient(linear, left top, left bottom, from(#6b9d28), to(#436b0c));
  background: -moz-linear-gradient(top, #6b9d28, #436b0c);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6b9d28', endColorstr='#436b0c');
}

.green:active {
  color: #a9c08c;
  background: -webkit-gradient(linear, left top, left bottom, from(#4e7d0e), to(#7db72f));
  background: -moz-linear-gradient(top, #4e7d0e, #7db72f);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4e7d0e', endColorstr='#7db72f');
}

/* pink */
.pink {
  color: #feeef5;
  border: solid 1px #d2729e;
  background: #f895c2;
  background: -webkit-gradient(linear, left top, left bottom, from(#feb1d3), to(#f171ab));
  background: -moz-linear-gradient(top, #feb1d3, #f171ab);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#feb1d3', endColorstr='#f171ab');
}

.ping:visited {
  color: #feeef5;
}

.pink:hover {
  background: #d57ea5;
  background: -webkit-gradient(linear, left top, left bottom, from(#f4aacb), to(#e86ca4));
  background: -moz-linear-gradient(top, #f4aacb, #e86ca4);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f4aacb', endColorstr='#e86ca4');
}

.pink:active {
  color: #f3c3d9;
  background: -webkit-gradient(linear, left top, left bottom, from(#f171ab), to(#feb1d3));
  background: -moz-linear-gradient(top, #f171ab, #feb1d3);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f171ab', endColorstr='#feb1d3');
}

/* Yellow */
.yellow {
  color: #000033;
  border: solid 1px #cc6600;
  background: #ffff33;
  background: -webkit-gradient(linear, left top, left bottom, from(#ffff33), to(#ffff99));
  background: -moz-linear-gradient(top, #ffff33, #ffff99);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffff33', endColorstr='#ffff99');
}

.yellow:visited {
  color: #000033;
}

.yellow:hover {
  background: #ffcc33;
  background: -webkit-gradient(linear, left top, left bottom, from(#ffcc33), to(#ffcc99));
  background: -moz-linear-gradient(top, #ffcc33, #ffcc99);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffcc33', endColorstr='#ffcc99');
}

.yellow:active {
  color: #000033;
  background: -webkit-gradient(linear, left top, left bottom, from(#ffcc33), to(#ffcc99));
  background: -moz-linear-gradient(top, #ffcc33, #ffcc99);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffcc33', endColorstr='#ffcc99');
}

/* Purple */
.purple {
  color: #F0F8FF;
  border: solid 1px #660066;
  background: #9900cc;
  background: -webkit-gradient(linear, left top, left bottom, from(#9900cc), to(#9966cc));
  background: -moz-linear-gradient(top, #9900cc, #9966cc);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#9900cc', endColorstr='#9966cc');
}

.purple:visited {
  color: #F0F8FF;
}

.purple:hover {
  background: #cc00cc;
  background: -webkit-gradient(linear, left top, left bottom, from(#cc00cc), to(#cc99cc));
  background: -moz-linear-gradient(top, #cc00cc, #cc99cc);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cc00cc', endColorstr='#cc99cc');
}

.purple:active {
  color: #F0F8FF;
  background: -webkit-gradient(linear, left top, left bottom, from(#cc00cc), to(#cc99cc));
  background: -moz-linear-gradient(top, #cc00cc, #cc99cc);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cc00cc', endColorstr='#cc99cc');
}


/*---------------------------------------------------------------------
 SOCIAL BOOKMARK
 ----------------------------------------------------------------------*/
#social_bkm_wrap_top {
  height: 20px;
  /*border-top: 1px dotted #ddd;*/
  text-align: left;
  /*padding: 10px 0;*/
  padding: 5px 0;
  margin: 5px 0 0 0;
  position: relative;
  z-index: 2;
}

#social_bkm_wrap_under_leaf {
  min-height: 20px;
  float: right;
  padding: 5px 0;
  margin: 0 0 10px 0;
  position: relative;
  z-index: 2;
}


#social_bkm_wrap_under_leaf li {
  background: none;
  position: relative;
  z-index: 1001;
  float: left;
  padding: 0;
  margin-bottom: 5px;
  list-style: none;
  border: none;
  margin-left: 10px !important;
  height: 20px;
}


#social_bkm_wrap_bottom {
  height: 25px !important;
  text-align: left;
  padding: 5px 0;
  margin: 5px 0 0 0;
  position: relative;
  z-index: 1;
}

#social_bkm_wrap_extra {
  height: 20px;
  text-align: left;
  padding: 5px 0;
  margin: -20px 0 20px 0;
  position: relative;
  z-index: 1;
}

#social_bkm_wrap_top li,
#social_bkm_wrap_bottom li,
#social_bkm_wrap_extra li {
  background: none;
  /*float: left;*/
  position: relative;
  z-index: 1001;
  padding: 0;
  margin-bottom: 5px;
  list-style: none;
  border: none;
}

#social_bkm_wrap_top li.right_sbm {
  float: right;
  margin-right: 10px;
}

#social_bkm_wrap_top li.last {
  margin: 0
}

#social_bkm_wrap_top a {
  font-weight: normal
}

#social_bkm_wrap_top .expandable,
#social_bkm_wrap_extra .expandable {
  position: relative;
}

#social_bkm_wrap_top .expandable .menuWrapper,
#social_bkm_wrap_extra .expandable .menuWrapper {
  display: none;
  position: absolute;
  top: 19px;
  right: 0;
  z-index: 999
}

#social_bkm_wrap_top .expandable:hover .menuWrapper,
#social_bkm_wrap_extra .expandable:hover .menuWrapper {
  display: block;
}

#social_bkm_wrap_top .expandable:hover,
#social_bkm_wrap_extra .expandable:hover {
  border: 1px solid #868686;
  -webkit-box-shadow: inset 0 0 5px #ddd;
  -moz-box-shadow: inset 0 0 5px #ddd;
  box-shadow: inset 0 0 5px #ddd;
}

#social_bkm_wrap_top .menuWrapper .menu,
#social_bkm_wrap_extra .menuWrapper .menu {
  background: #fff;
  border: 1px solid #868686;
  -webkit-box-shadow: inset 0 0 5px #ddd;
  -moz-box-shadow: inset 0 0 5px #ddd;
  box-shadow: inset 0 0 5px #ddd;
  padding: 10px;
  margin-top: 5px;
}

#social_bkm_wrap_bottom li.right_sbm {
  float: right;
}

#social_bkm_wrap_bottom li.last {
  margin: 0
}

#social_bkm_wrap_bottom a {
  font-weight: normal
}

#social_bkm_wrap_bottom .expandable,
#social_bkm_wrap_extra .expandable {
  position: relative;
}

#social_bkm_wrap_bottom .expandable .menuWrapper,
#social_bkm_wrap_extra .expandable .menuWrapper {
  display: none;
  position: absolute;
  top: 19px;
  right: 0;
  z-index: 999
}

#social_bkm_wrap_bottom .expandable:hover .menuWrapper,
#social_bkm_wrap_extra .expandable:hover .menuWrapper {
  display: block;
}

#social_bkm_wrap_bottom .expandable:hover,
#social_bkm_wrap_extra .expandable:hover {
  border: 1px solid #868686;
  -webkit-box-shadow: inset 0 0 5px #ddd;
  -moz-box-shadow: inset 0 0 5px #ddd;
  box-shadow: inset 0 0 5px #ddd;
}

#social_bkm_wrap_bottom .menuWrapper .menu,
#social_bkm_wrap_extra .menuWrapper .menu {
  background: #fff;
  border: 1px solid #868686;
  -webkit-box-shadow: inset 0 0 5px #ddd;
  -moz-box-shadow: inset 0 0 5px #ddd;
  box-shadow: inset 0 0 5px #ddd;
  padding: 10px;
  margin-top: 5px;
}

#atode_print, #atode_action, #atode_pulldown, #atode_pulldown_dl {
  height: 18px;
  line-height: 18px;
  vertical-align: top;
  color: #666;
  background: #fff;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#DFDFDF');
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#DFDFDF));
  background: -moz-linear-gradient(top, #fff, #DFDFDF);
  cursor: pointer;
  border: 1px solid #C6C6C6 !important;
  margin-right: 10px !important;
}

#sbm_btn {
  height: 18px;
  line-height: 18px;
  vertical-align: top;
  color: #666;
  background: #fff;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#DFDFDF');
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#DFDFDF));
  background: -moz-linear-gradient(top, #fff, #DFDFDF);
  cursor: pointer;
  font-size: 0.85em;
  border: 1px solid #C6C6C6;
}

#sbm_btn .menu {
  width: 190px;
  line-height: 25px;
}

#sbm_btn .sbm_button {
  float: left;
  display: block;
  width: 90px;
  line-height: 25px;
  height: 25px;
}

#sbm_icon {
  background: url("/media/c/2012/images/icon/icon_bkm.png") left center no-repeat;
  padding: 0 5px 0 20px;
}

/*----------------------------------------------------------------------
 ATODE
 -----------------------------------------------------------------------*/
#atode {
  height: 20px;
  line-height: 20px;
  vertical-align: top;
  position: relative;
  background: #fff;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#DFDFDF');
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#DFDFDF));
  background: -moz-linear-gradient(top, #fff, #DFDFDF);
  cursor: pointer;
  font-size: 14px;
  color: #666;
}

#atode a {
  font-size: 0.85em;
  vertical-align: top;
}

#atode_action, #atode_pulldown, #atode_pulldown_dl {
  border: 1px solid #C6C6C6;
  float: left;
}

#atode_action:hover {
  border: 1px solid #868686;
  -webkit-box-shadow: inset 0 0 5px #ddd;
  -moz-box-shadow: inset 0 0 5px #ddd;
  box-shadow: inset 0 0 5px #ddd;
}

#atode_action a {
  color: #666;
  text-decoration: none
}

#atode_pulldown {
  height: 18px;
  cursor: pointer
}

#atode_pulldown .desc, #atode_pulldown .btn {
  height: 18px;
  line-height: 18px;
  float: left;
}

#atode_pulldown .desc {
  font-size: 12px;
}

#atode_pulldown .desc img {
  vertical-align: middle;
}

#atode_pulldown .btn {
  width: 18px;
  padding: 0;
  border: none;
}

#atode_pulldown.active .desc {
  display: none
}

#atode_pulldown_actions {
  width: 80px;
}

#atode_pulldown_actions dd {
  height: 20px;
  padding: 0 0 0 28px;
  margin: 0 0 10px 0;
  background-image: url(/media/c/2012/images/atode/ato_sprite.png);
  background-repeat: no-repeat;
}

#atode_pulldown_actions dd:hover {
  background-color: #ddd;
}

#atode_pulldown_dl {
  height: 18px;
  cursor: pointer
}

#atode_pulldown_dl .desc, #atode_pulldown .btn {
  height: 18px;
  line-height: 18px;
  float: left;
}

#atode_pulldown_dl .desc {
  font-size: 12px;
}

#atode_pulldown_dl .desc img {
  vertical-align: middle;
}

#atode_pulldown_dl .btn {
  width: 18px;
  padding: 0;
  border: none;
}

#atode_pulldown_dl.active .desc {
  display: none
}

#atode_pulldown_actions_dl {
  width: 80px;
}

#atode_pulldown_actions_dl dd {
  height: 20px;
  padding: 0 0 0 28px;
  margin: 0 0 10px 0;
  background-image: url(/media/c/2012/images/atode/ato_sprite.png);
  background-repeat: no-repeat;
}

#atode_pulldown_actions_dl dd:hover {
  background-color: #ddd;
}

#atode_pulldown_actions_clip {
  width: 110px;
}

.atode_clip {
  background-position: 0 0;
}

.atode_print {
  background-position: 0 -20px;
}

.atode_ml_pdf {
  background-position: 0 -40px;
}

.atode_ml_html {
  background-position: 0 -60px;
}

.atode_ml_epub {
  background-position: 0 -80px;
}

.atode_ml_text {
  background-position: 0 -100px;
}

.atode_dl_pdf {
  background-position: 0 -120px;
}

.atode_dl_epub {
  background-position: 0 -140px;
}

.atode_dl_text {
  background-position: 0 -160px;
}


#social_bkm_wrap_bottom #atode_print,
#social_bkm_wrap_bottom .atode_clip,
#social_bkm_wrap_bottom #atode_pulldown,
#social_bkm_wrap_bottom #atode_pulldown_dl {
  height: 20px;
  margin-right: 3px !important;
  padding: 0 5px 0 35px;
  background: #efefef url(/media/c/2012/images/atode/ato_sprite.png) no-repeat 0 0;
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false) !important;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
}

#social_bkm_wrap_bottom #atode_print {
  background-position: 6px -20px;
}

#social_bkm_wrap_bottom #atode_print a {
  color: #666666;
}

#social_bkm_wrap_bottom #atode_print a:hover {
  text-decoration: none;
}

#social_bkm_wrap_bottom #atode_pulldown {
  background-position: 5px -60px;
}

#social_bkm_wrap_bottom #atode_pulldown_dl {
  background-position: 5px -140px;
}

#social_bkm_wrap_bottom .atode_clip {
  background-position: 5px 0;
  padding-right: 10px;
}

#social_bkm_wrap_bottom .btn {
  background: transparent;
  line-height: auto;
}

#social_bkm_wrap_bottom #atode_print:hover,
#social_bkm_wrap_bottom .atode_clip:hover,
#social_bkm_wrap_bottom #atode_pulldown:hover,
#social_bkm_wrap_bottom #atode_pulldown_dl:hover {
  border: 1px solid #868686 !important;
}

#social_bkm_wrap_bottom .right_sbm:hover {
  border: none;
  box-shadow: none;
}


/*------------------------------------------------------------------------------
 TOOLTIP
 -------------------------------------------------------------------------------*/
.ctooltip {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 999;
  background-color: #f8f8f8;
  padding: 3px 5px;
  border: 2px solid #c6c6c6;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -moz-box-shadow: 0 -1px 10px #ddd;
  -webkit-box-shadow: 0 -1px 10px #ddd;
  box-shadow: 0 -1px 10px #ddd;
  letter-spacing: -0.1em;
}

.ctooltip .ctooltip-pointer-down, .ctooltip .ctooltip-pointer-down-inner {
  position: absolute;
  width: 0;
  height: 0;
  border-bottom-width: 0;
  background: none;
}

.ctooltip .ctooltip-pointer-down {
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-top-width: 14px;
  bottom: -14px;
  right: auto;
  left: 50%;
  margin-left: -7px;
}

.ctooltip .ctooltip-pointer-down-inner {
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 10px solid #c6c6c6;
  bottom: auto;
  top: -14px;
  left: -5px;
}

/*------------------------------------------------------------------------------
 JQUERY UI
 -------------------------------------------------------------------------------*/
#nologin_window {
  overflow: hidden;
}

.ui-dialog {
  background: #F9F7F0;
  padding: 5px;
  border: 2px solid #c6c6c6;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -moz-box-shadow: 0 0 15px #bbb;
  -webkit-box-shadow: 0 0 15px #bbb;
  box-shadow: 0 0 15px #bbb;
}

.ui-dialog-titlebar {
  text-align: right
}

.ui-dialog-titlebar a {
  color: #333
}


/*------------------------------------------------------------------------------
 POPUP
 -------------------------------------------------------------------------------*/
.popupWrap {
  height: 24px;
  line-height: 24px;
  width: auto;
  background: #808182;
  padding: 3px;
  border-width: 2px !important;
  position: absolute;
  bottom: -5px;
  right: 0;
  border: 1px solid #414141;
  border-radius: 2px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -webkit-box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.65), 0 1px 0 rgba(255, 255, 255, 0.35) inset;
  -moz-box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.65), 0 1px 0 rgba(255, 255, 255, 0.35) inset;
  box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.65), 0 1px 0 rgba(255, 255, 255, 0.35) inset;
}

.popupContent {
  background: #F4F4F4;
  padding: 0 5px;
  font-size: 0.8em;
  color: #555
}

.popupArrow {
  border-color: transparent transparent transparent #565758;
  border-style: solid;
  border-width: 10px;
  height: 0;
  position: absolute;
  width: 0;
  left: 100%;
  top: 5px;
}

/* read it later
------------------------------------------------------------------**/
#readitlater a {
  width: 83px;
  height: 14px;
  line-height: 14px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  border: 1px solid #6C6C6C;
  background: #5E5E5E url(/media/c/2012/images/bg/roundedBg.png) 0px 0px repeat-x;
  color: white;
  text-align: center;
  position: relative;
  top: 3px;
  display: block;
}

.ad_about {
  margin: 3px 0 0 0;
  text-align: right;
  color: #666;
  background: url(/media/c/2012/images/icon/icon_arrow_k.png) no-repeat 190px 50%;
}


#blogger_profile .author_img {
  max-width: 138px;
}

#blogger_profile .author_name a {
  color: #0066A0;
  font-size: 1.2em;
}

#blog_profile_title img {
  float: left;
  margin: 0 10px 10px 0;
}

#blog_profile_title h1 {
  font-size: 1.4em;
  line-height: 1.2em;
  margin-bottom: 5px;
}

#blog_profile_title h3 a {
  color: #0066A0;
  font-size: 1.1em;
}

.app_author_img {
  float: left;
  margin-right: 10px;
}

.app_author_name {
  font-size: 100%;
  font-weight: bold;
  background-color: #f0f0f0;
  margin: 0 0 10px 0px;
  padding: 5px 10px;
}

/* breaking news
---------------------------------------------------------*/
#breaking-news {
  height: 27px;
  line-height: 27px;
  margin-bottom: 10px;
  background: #DA3405;
  background: -moz-linear-gradient(top, #DA3405 0%, #B32C0F 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #DA3405), color-stop(100%, #B32C0F));
  background: -webkit-linear-gradient(top, #DA3405 0%, #B32C0F 100%);
  background: -o-linear-gradient(top, #DA3405 0%, #B32C0F 100%);
  background: -ms-linear-gradient(top, #DA3405 0%, #B32C0F 100%);
  background: linear-gradient(to bottom, #DA3405 0%, #B32C0F 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#DA3405', endColorstr='#B32C0F', GradientType=0);
  border: 1px solid #8E200D;
  box-shadow: inset 0 0 8px rgba(255, 255, 255, 0);
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
}

#breaking-news h2 {
  font-size: 1em;
  float: left;
  padding: 0 15px 0 10px;
  color: #5A1103;
  margin-right: 5px;
  background: url("/media/c/2012/images/base/br-arrow.png") center right no-repeat;
  padding-right: 35px;
  text-shadow: 0 1px 1px #DA3D0D;
}

#breaking-news img {
  vertical-align: top;
}

#breaking-news a {
  color: #fff;
  font-weight: bold;
  text-shadow: 0 -1px #7B1D05;
}

/* latest news number
--------------------------------------------------------------*/
#primaryNavBar > li.expandable .menuHead span.latest_num {
  height: 41px;
  background-image: none;
  margin-left: 1px;
}

#primaryNavBar > li.expandable .menuHead span.latest_num b {
  display: block;
  position: absolute;
  top: -5px;
  right: 13px;
  line-height: 16px;
  height: 16px;
  padding: 0 5px;
  color: #222;
  text-shadow: 0 1px rgba(0, 0, 0, 0.25);
  border: 1px solid #F4A306;
  border-radius: 10px;
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.08), inset 0 1px rgba(255, 255, 255, 0.3);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.08), inset 0 1px rgba(255, 255, 255, 0.3);
  background-color: #FABA3E;
}

#primaryNavBar > li.expandable:hover .menuHead span.latest_num b {
  right: 12px;
}

span.latest_num.badge-yellow b {
  background: #FC0;
  background: -moz-linear-gradient(top, #FC0 0%, #E5BF00 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #FC0), color-stop(100%, #E5BF00));
  background: -webkit-linear-gradient(top, #FC0 0%, #E5BF00 100%);
  background: -o-linear-gradient(top, #FC0 0%, #E5BF00 100%);
  background: -ms-linear-gradient(top, #FC0 0%, #E5BF00 100%);
  background: linear-gradient(top, #FC0 0%, #E5BF00 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffcc00', endColorstr='#e5bf00', GradientType=0);
  border: 1px solid #D0A700;
  -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.25) inset;
  -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.25) inset;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.25) inset;
  font-family: 'Helvetica Condensed Bold', Helvetica, Arial, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'ＭＳ Ｐゴシック', sans-serif;
  font-size: 13px;
}

#primaryNavBar > li.expandable .menuWrapper .notification-menu li a {
  width: 110px;
  float: none;
}

#primaryNavBar > li.expandable .menuWrapper .notification-menu ul {
  float: none;
}

#notification-news {
  width: 440px;
}

#notification-news .nav {
  width: 130px;
}

.notification-menu, .notification-area {
  float: left;
}

.notification-area {
  padding: 15px 0 0 15px;
  width: 270px;
}

.notification-area div {
  margin: 0 0 5px 0 !important;
  text-shadow: 0 1px 0 #999;
  font-size: 1.4em;
  -webkit-margin-before: 1em;
  -webkit-margin-after: 1em;
  -webkit-margin-start: 0px;
  -webkit-margin-end: 0px;
  font-weight: bold;
}

.notification-area div span {
  float: left;
  font-size: 2em;
  color: #FC0;
  margin: 0 10px 0 -5px;
  text-shadow: 1px 1px 1px #000;
}

.notification-area li {
  border-bottom: 1px solid #5b5b5b;
  padding: 4px 0;
  box-shadow: 0 1px 0 #737373;
  background: url("/media/c/2012/images/bullet/notification-arrow.png") no-repeat 0 2px;
}

.notification-area .datetime {
  color: #ccc;
  font-size: 11px;
  font-weight: normal;
}

#primaryNavBar > li.expandable .menuWrapper .notification-area li {
  color: #FC0;
  font-weight: bold;
}

#primaryNavBar > li.expandable .menuWrapper .notification-area li a {
  float: none;
  display: inline;
  color: #fff;
  box-shadow: none;
  border: none;
  text-shadow: none;
  font-weight: normal;
  padding-left: 8px;
}

#primaryNavBar > li.expandable .menuWrapper .notification-area li a:hover {
  background: none;
}

#primaryNavBar > li.expandable .notification-area li.read {
  color: #aaa;
}

#primaryNavBar > li.expandable .notification-area li.read a {
  color: #8f8f8f;
}

#notification-stories-top,
#notification-stories-bottom {
  margin-bottom: 5px;
}

#notifications-more {
  text-align: center;
  color: #FC0;
  font-size: 11px;
  cursor: pointer;
  float: right;
}

#notification-ee {
  width: 300px;
  position: absolute;
  top: 50px;
  left: 125px;
  z-index: 9998;
}

#notification-ee img,
#notification-ee p {
  float: left;
}

#notification-ee p {
  background: #fff;
  width: 150px;
  border-radius: 5px;
  border: 3px solid #FC0;
  padding: 5px;
  position: relative;
  margin-top: 25px;
}

#notification-ee p::before {
  content: "";
  position: absolute;
  display: block;
  width: 0;
  top: 10px;
  bottom: auto;
  left: -15px;
  border-width: 7px 15px 7px 0;
  border-color: transparent #FC0;
  border-style: solid;
}

#notification-ee p::after {
  content: "";
  position: absolute;
  display: block;
  border-style: solid;
  top: 11px;
  bottom: auto;
  left: -11px;
  border-width: 6px 17px 6px 0;
  border-color: transparent white;
}

#cnetid_alert_header {
  display: none;
  background-color: #efefef;
  min-height: 30px;
  line-height: 25px;
  text-align: center;
  color: #ff0000;
  font-size: 14px;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  top: 0px;
  left: 0px;
  width: 100%;
}

.cnetid_alert_header_fixed {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 10000;
}

.leaf_sbm_button_space_facebook {
  height: 20px !important;
}

.leaf_sbm_button_space_twitter {
  margin-left: 5px !important;
  height: 20px !important;
}

.leaf_sbm_button_space_googleplus1 {
  margin-left: 5px !important;
  height: 20px !important;
}

.leaf_sbm_button_space_hatena {
  margin-left: 5px !important;
  height: 20px !important;
}

.leaf_sbm_button_space_note {
  margin-left: 5px !important;
  height: 20px !important;
}

.sns_note_kaku {
  display: block;
  border-radius: 3px;
  background-color: #2cb696;
  height: 20px;
  padding: 0px 4px 0px 2px;
}

.sns_note_kaku img {
  position: relative;
  left: -4px;
  top: -3px;
}

.sns_note_kaku span {
  color: white;
  zoom: 1;
  white-space: nowrap;
  font-size: 11px;
  display: inline-block;
  -ms-flex-item-align: center;
  -ms-grid-row-align: center;
  align-self: center;
  padding-top: 3px;
  line-height: 1;
  vertical-align: top;
  position: relative;
  left: -6px;
  top: 1px;
}

.sns_note_kaku:hover {
  background-color: #228d74;
}

.tw_btn {
  position: relative;
  height: 20px;
  box-sizing: border-box;
  padding: 1px 8px 1px 6px;
  /*background-color:#1b95e0;*/
  background-color: #000000;
  color: #fff;
  border-radius: 3px;
  font-weight: 500;
  cursor: pointer
}

/*.tw_btn:active,.tw_btn:focus,.tw_btn:hover{background-color:#0c7abf}*/
.tw_btn:active, .tw_btn:focus, .tw_btn:hover {
  background-color: #151515
}

.tw_btn:active {
  box-shadow: inset 0 3px 5px rgba(0, 0, 0, .1)
}

.tw_btn .tw_label {
  margin-left: 3px;
  white-space: nowrap;
  display: inline-block;
  vertical-align: top;
  zoom: 1;
  font: normal normal normal 11px/18px 'Helvetica Neue', Arial, sans-serif;
  color: #FFFFFF;
}

span.balloon {
  position: relative;
  display: block;
  border: 1px solid #bbb;
  font-weight: 700;
  color: #777;
  background: #fff;
}

span.balloon:hover {
  background-color: #EEEEEE;
}

span.balloon {
  float: left;
  height: 18px;
  padding: 0 6px;
  line-height: 18px;
  font-size: 11px;
  font-weight: 400;
  border-radius: 3px;
}

span.balloon em {
  font-style: normal;
  -moz-transition: opacity .3s;
  -webkit-transition: opacity .3s;
  -ms-transition: opacity .3s;
  -o-transition: opacity .3s;
}

span.balloon i {
  border-right-color: #aaa;
}

span.balloon i, span.balloon u {
  top: 50%;
  left: 0;
  margin: -4px 0 0 -4px;
  border-left: 0;
}

span.balloon i, span.balloon u {
  display: block;
  position: absolute;
  border: 4px solid transparent;
  width: 0;
  height: 0;
  line-height: 0;
  zoom: 1;
  z-index: 10;
  left: -4px;
  border-right-color: #999;
}

span.balloon u {
  margin-left: -3px;
  border-right-color: #fff;
}


.leaf_sbm_button_space_pocket {
  margin-left: 5px !important;
  height: 20px !important;
}

.pocket-btn {
  width: 100px;
}

#social_bkm_wrap_bottom .leaf_sbm_button_space_twitter,
#social_bkm_wrap_bottom .leaf_sbm_button_space_googleplus1 {
  margin-right: 20px;
}

#right_poll_box input {
  float: left;
  margin-right: 10px;
}

.box_gray .btn_newsletter, #right_newsletter_box .btn_newsletter {
  text-align: center;
}

.box_gray .btn_newsletter a, #right_newsletter_box .btn_newsletter a {
  /*display: block;*/
  margin: 20px;
  padding: 5px 20px;
  text-align: center;
  color: #eeeeee;
  -moz-text-shadow: 1px -1px 1px #798c96;
  -webkit-text-shadow: 1px -1px 1px #798c96;
  text-shadow: 1px -1px 1px #798c96;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  -moz-box-shadow: inset 0px 1px 1px #fff;
  -webkit-box-shadow: inset 0px 1px 1px #fff;
  box-shadow: inset 0px 1px 1px #fff;
  background: #9AA8B0;
  filter: progid:DXImageTransform.Microsoft.Gradient(Enabled=1, GradientType=0, StartColorStr=#c2cfd6, EndColorStr=#798c96);
  background: -moz-linear-gradient(top, #c2cfd6, #798c96);
  background: -webkit-gradient(linear, left top, left bottom, from(#c2cfd6), to(#798c96));
  border: 1px solid #647680;
  zoom: 1;
}

.box_gray .btn_newsletter a:hover, #right_newsletter_box .btn_newsletter a:hover {
  text-decoration: none;
  color: #ffffff;
  background: #798c96;
}

#right_poll_box .poll_title {
  border-bottom: 1px solid #444;
}

#right_poll_box .poll_title b {
  color: #961515;

}

.social_bkm_pocket {
  display: inline-block;
  _display: inline;
}


/************************************
 * スマホの場合に画面のトップに表示 *
 ************************************/
/**
 *
 */
#SpTopBg {
  font-family: Helvetica, Arial, sans-serif;
  width: 100%;
  display: block;
  background: -webkit-gradient(linear, left top, left bottom, from(#C5C5C2), to(#bdbdb9));
  background-color: #a5a59f;
  padding: 13px 0 12px;
  border-bottom: 2px solid #E1E1DA;
  text-align: center;
  min-width: 1240px !important;
}

/**
 *
 */
a#SpTopLink {
  width: 940px;
  color: #32322B;
  display: block;
  margin: 0 auto;
  position: relative;
  text-align: left;
  background: -webkit-gradient(linear, left top, left bottom, from(#FFFFFF), to(#ebebe4));
  background-color: white;
  border: 4px solid #a5a59f;
  border-radius: 15px;
  text-decoration: none;
  padding: 0 20px;
}

/**
 *
 */
#SpTopLinkInner {
  background: transparent url(/media/c/avalon/images/mini/icon_phone.png) no-repeat left center;
  background-size: 70px 100px;
  height: 115px;
}

/**
 *
 */
p.SpTopLinkSub {
  font-size: 56px;
  line-height: 82px;
  font-weight: bold;
  text-shadow: 0 4px 0 #FFF;
  display: inline-block;
  background: url(/media/c/avalon/images/mini/sptop_arrow.png) no-repeat right center;
  background-size: 30px 60px;
  width: 940px;
}

/**
 *
 */
p.SpTopLinkSub span {
  display: block;
  text-align: center;
}

/**
 *
 */
p.SpTopLinkSub .FirstLine {
  margin-top: 20px;
}

/**
 *
 */
p.SpTopLinkSub .SecondLine {
  color: #b90000;
}

.viewmore {
  clear: both;
  float: right;
  margin-right: 10px;
  margin-bottom: 10px;
  padding-left: 20px;
  white-space: nowrap;
  position: relative;
}

.viewmore:after {
  content: "";
  position: absolute;
  top: 8px;
  left: 5px;
  width: 4px;
  height: 4px;
  border-top: 1px solid #aa1801;
  border-right: 1px solid #aa1801;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}


.youtube_frame_560 {
  height: 315px;
  width: 560px;
  text-align: center;
}


/* -------------------------------------------------------------------------------

 ADD Style 2017

------------------------------------------------------------------------------- */


/* ===============================================================================

DEFAULT

=============================================================================== */


body {
  background: none;
  background-color: #ffffff;
}

/*
@media screen and (max-width:1240px) {
  body{
    min-width:1240px;
  }
}*/ /* <- tablet ipad fix */


a {
  /*color:#0066A0;*/
  cursor: pointer;
  text-decoration: none;
  transition: 0.3s;
  -webkit-transition: 0.3s;
  color: #0f0f0f;
}

a:hover {
  color: #df6105 !important;
  text-decoration: none !important;
}

.clearfix:after {
  clear: both;
  content: " ";
  display: block;
}


.center {
  text-align: center;
  margin: 0 auto;
}


/* CONTAINER -------------------------------------------------------------*/


#wrap {
  margin: 0;
  padding: 0;
}

#page-wrap {
  margin: 0 auto;
  width: 1240px;
}


/* ===============================================================================

HEADER

=============================================================================== */

#header-wrap {
  width: 100%;
  min-width: 1240px;
}

#header-wrap .header-social-block {
  background-color: #ffffff;
  width: 100%;
}

#header-wrap .header-social-block .social-inner {
  display: -webkit-box; /*Android browser*/
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end; /*Android browser*/
  -webkit-justify-content: flex-end;
  -ms-justify-content: flex-end;
  justify-content: flex-end;
  padding: 8px;
}

#header-wrap .header-social-block .social-inner li {
  padding-bottom: 0 !important;
}


.header-social-block .social-inner li.icon-fb a {
  background: url(/media/c/2012/images/responsive/spritesheet.png) no-repeat;
  background-position: -41px -5px;
  width: 28px;
  height: 28px;
  display: block;
}

.header-social-block .social-inner li.icon-tw a {
  background: url(/media/c/2012/images/responsive/spritesheet.png) no-repeat;
  background-position: -43px -43px;
  width: 28px;
  height: 28px;
  display: block;
}

.header-social-block .social-inner li.icon-rss a {
  background: url(/media/c/2012/images/responsive/spritesheet.png) no-repeat;
  background-position: -5px -43px;
  width: 28px;
  height: 28px;
  display: block;
}

.header-social-block .social-inner li.icon-mail a {
  background: url(/media/c/2012/images/responsive/spritesheet.png) no-repeat;
  background-position: -79px -5px;
  width: 28px;
  height: 28px;
  display: block;
}

.header-social-block .icon-zdnet a {
  background: url(/media/c/2012/images/responsive/spritesheet.png) no-repeat;
  background-position: -95px -80px;
  width: 70px;
  height: 25px;
  display: block;
}

.header-social-block .icon-techrepublic a {
  background: url(/media/c/2012/images/responsive/spritesheet.png) no-repeat;
  background-position: -81px -45px;
  width: 80px;
  height: 25px;
  display: block;
}


.header-social-block .social-inner li a {
  margin: 0 6px;
}

.header-social-block .social-inner li a:hover {
  opacity: 0.7;
  filter: alpha(opacity=70);
}


#header-wrap .header-main-block {
  background-color: #050505; /*202404*/
  display: -webkit-box; /*Android browser*/
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /*width:100%;*/
  height: 56px;
  min-width: 1240px;
  padding: 0;
  position: relative;
}

#header-wrap .header-main-block .logo {
  display: block;
  position: absolute;
  top: 20px; /*202207*/
  left: 20px;
  z-index: 100;
}

#header-wrap .header-main-inner {
  /*min-width:1240px;*/
  width: 100%;
  margin: 0 auto;
  position: relative;
  display: flex;
}


.header-social-block ul, .header-navigation-block ul {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}


#header-wrap .header-branding-block {
  height: auto;
  display: -webkit-box; /*Android browser*/
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  flex-direction: row;
  min-width: 210px;
  position: relative;
  left: 45px;
  z-index: 1000;
}


/*.google_custom_search_wrap*/
.header_search_box .searchBtnD {
  overflow: hidden;
  position: relative;
  margin: 12px 0 0 0;
  padding: 0 10px; /*202207*/
  box-shadow: 0 0 10px #ccc; /*202207*/
  border-radius: 50px; /*202207*/
}

/*.google_custom_search_box*/
.searchBtnD .searchBtn {
  border-radius: 20px;
  -webkit-border-radius: 20px;
  background: #ffffff;
  border: none !important;
  padding: 10px 15px;
  background: url("https://www.google.com/cse/static/ja/google_custom_search_watermark.gif") 3px center no-repeat rgb(255, 255, 255);
  width: 150px;
}


/*.google_custom_search_go*/
.searchBtnD .hcd_btn_scope {
  background: url(/media/c/2012/images/responsive/spritesheet.png) no-repeat;
  background-position: -5px 0;
  border: none;
  cursor: pointer;
  line-height: 0;
  text-indent: -9999px;
  position: absolute;
  top: 0px;
  right: 8px;
  width: 26px;
  height: 26px;
}

.hcd_btn_scope a { /*transition delete*/
  transition: none !important;
}


/* header-id header-search add 202404 */


.header-main-block .header-nav-id,
.header-main-block .header-nav-search {
  /*float:right;*/
  text-align: center;
  /*position:absolute;
  top:0;
  right:15px;*/
}


.header-main-block .header-nav-search {
  /*width: 50px;
  height: 50px;
  font-size:50px;
  position: relative;*/
  width: auto;
  cursor: pointer;
}

.header-main-block .header-nav-id span {
  display: block;
  background-color: #e71d1d;
  color: #fff !important;
  margin: 11px 10px;
  padding: 6px 15px;
  border-radius: 5px;
  font-size: 12px;
  position: absolute;
  top: 0;
  right: 20px;
}

.header-main-block .header-nav-search span {
  display: block;
  /*border: 1px solid #fff;
  border-radius: 5px;
  margin: 5px;
  padding: 5px;
  width: 30px;
  height: 30px;*/
  width: 50px;
  height: 50px;
  font-size: 50px;
  position: absolute;
  top: 0;
  /*right: 130px;*/
  right:200px;
}

.header-main-block .header-nav-search span:before {
  position: absolute;
  display: block;
  content: "";
  top: 15px;
  left: 35%;
  width: 30%;
  height: 30%;
  border-radius: 50%;
  border: 3px solid #ffffff;
}

.header-main-block .header-nav-search span:after {
  position: absolute;
  display: block;
  content: "";
  top: 60%;
  left: 60%;
  width: 25%;
  height: 5%;
  background: #ffffff;
  margin: 5px 0 0 3px;
  transform: rotate(45deg);
}

.header-main-block .header-nav-id span:hover,
.header-main-block .header-nav-search span:hover {
  cursor: pointer;
  opacity: 0.85;
}

.header-main-block .header-nav-id span a,
.header-main-block .header-nav-search span a {
  color: #fff !important;
}


.header-main-block .header-nav-search .search-box-pc {
  width: 100%;
  background-color: #333;
  position: absolute;
  top: 56px;
  left: 0;
  /*position:relative;
  margin-top:56px;*/
  z-index: 100;
}

.header-main-block .header-nav-search .search-box-pc form {
  width: 70%;
  margin: 15px auto;
  position: relative;
}


.header-main-block .header-nav-search .search-box-pc input {
  font: normal 20px Arial, Helvetica, sans-serif;
  text-align: center;
}

.header-main-block .header-nav-search .searchBtn {
  border-radius: 10px;
  -webkit-border-radius: 10px;
  background: #ffffff;
  border: none !important;
  /*margin:0 25px;*/
  padding: 15px;
  background: url(//www.google.com/cse/static/ja/google_custom_search_watermark.gif) 3px center no-repeat rgb(255, 255, 255);
  width: 90%;
}


.header-main-block .header-nav-search form .hcd_btn_scope {
  background: url(/media/c/2012/images/responsive/spritesheet.png) no-repeat;
  background-position: -5px -5px;
  border: none;
  cursor: pointer;
  line-height: 0;
  text-indent: -9999px;
  position: absolute;
  top: 30%;
  right: 5%;
  width: 30px;
  height: 30px;
}


/*id*/
.header-main-block .header-nav-id .menu-id {
  width: 100%;
  background-color: #333;
  margin: 0 auto;
  text-align: center;
  z-index: 9999;
  position: absolute;
  top: 56px;
  left: 0;
}

.header-main-block .header-nav-id .menu-id li {
  width: 100%;
  border-bottom: 1px solid #444;
  /*border-bottom:1px solid #666;*/
  /*box-shadow:0 1px 0 #d0d0d0;*/
  padding: 20px 0;
}

.header-main-block .header-nav-id .menu-id li:last-child {
  border-bottom: none;
}

.header-main-block .header-nav-id .menu-id li a {
  color: #fff;
}

.header-main-block .header-nav-id .menu-id li a:hover {
  color: #bcd7df !important;
}


/* header-nav-menu add 202404 */

.header-main-block .header-menu-area {
  width: 100%;
  position: absolute;
  top: 10px;
  left: 0;
  padding: 0;
  z-index: 1000;
}


.header-main-block .header-menu-area .header-menu-hamburger {
  width: 30%;
  position: absolute;
  top: 0;
  left: 0;
  z-index:1;
  /*margin:0 0 0 25px;*/
}


.header-main-block .header-menu-area .header-menu-hamburger li {
  width: 100%;
  margin: 10px auto;
  color: #fff;
  font-size: 12px;
  z-index: 1;
  position: absolute;
  top: 0;
  left: 0;
}

.header-main-block .header-menu-area .header-menu-hamburger li:hover {
  cursor: pointer;
}


.header-main-block .header-menu-area .header-menu-hamburger .nav-hamburger {
  width: 20px;
  margin: 0 0 0 25px;
}

.header-main-block .header-menu-area .header-menu-hamburger li span:first-child,
.header-main-block .header-menu-area .header-menu-hamburger li span:nth-child(2),
.header-main-block .header-menu-area .header-menu-hamburger li span:nth-child(3) {
  width: 20px;
  height: 2px;
  background-color: #fff;
  margin-bottom: 5px;
  display: block;
}

.header-main-block .header-menu-area .header-menu-hamburger .menu-primary {
  width: 100%;
  background-color: #050505;
  margin: 20px 0 0 0;
}

.header-main-block .header-menu-area .header-menu-hamburger .menu-primary .menu-primary-inner {
  padding: 20px 10%;
}

.header-main-block .header-menu-area .header-menu-hamburger .menu-primary .menu-primary-inner.flex {
  display: flex;
  flex-wrap: wrap;
}

.header-main-block .header-menu-area .header-menu-hamburger .menu-primary .menu-primary-inner.line-border {
  border-bottom: 1px dotted #444;
  margin-bottom: 10px;
}

.header-main-block .header-menu-area .header-menu-hamburger .menu-primary li {
  margin: 0;
  padding: 5px 0;
  font-size: 140%;
  text-align: left;
  width: 50%;
  display: block;
}

.header-main-block .header-menu-area .header-menu-hamburger .menu-primary li a {
  color: #ffffff;
}
.header-main-block .header-menu-area .header-menu-hamburger .menu-primary li a:hover{
  color: #e71d1d !important;
}

.header-main-block .header-menu-area .header-menu-hamburger .menu-primary li.parent-menu,
.header-main-block .header-menu-area .header-menu-hamburger .menu-primary li.child-menu {
  position: relative;
}

.header-main-block .header-menu-area .header-menu-hamburger .menu-primary li.parent-menu {
  padding: 5px 0 10px 0;
  font-weight: bold;
  font-size: 160%;
  width: 100%;
}

.header-main-block .header-menu-area .header-menu-hamburger .menu-primary li.parent-menu:hover {
  cursor: default;
}

/* expand navi */
.header-nav-id .menu-id,
.header-nav-search .search-box-pc,
.header-main-block .header-menu-area .header-menu-hamburger .menu-primary{
  max-height: 0px;
  transition: all 300ms 0s ease;
  overflow: hidden;
}


.active_search {
  max-height: 420px !important;
}

.active_id {
  max-height: 420px !important;
}

.active_category {
  max-height: 550px !important;
}

.active_share {
  max-height: 300px !important;
}

.active_primary {
  max-height: 1300px !important;
}

/* header-nav-menu add 202404 end */




.header-main-block .header-navigation-block {
  /*width:100%;*/
  display:flex;
  position:relative;
  left:30px;
  z-index:1000;
}


.header-main-block .header-navigation-block ul {
  position: relative;
  display:flex;
  align-items:center;
}

.header-main-block .header-navigation-block ul li {
  padding-bottom: inherit;
  color: #ffffff;
  font-size: 1rem;
  width:130px;
  height:56px;
  line-height:56px;
  text-align:center;
}

.header-main-block .header-navigation-block ul li a,
.header-main-block .header-navigation-block ul li span{
  color: #ffffff;
  display: block;
}
.header-main-block .header-navigation-block ul li a:hover,
.header-main-block .header-navigation-block ul li span:hover{
  color: #e71d1d !important;
  cursor:pointer;
}



/* expand navi category deep*/
.header-main-block .header-navigation-block ul ul.menu_category,
.header-main-block .header-navigation-block ul ul.menu_deep{
  max-height: 0px;
  transition: all 300ms 0s ease;
  overflow: hidden;
}


.header-main-block .header-navigation-block ul ul.active_category_primary{
  max-height: 600px;
}

.header-main-block .header-navigation-block ul ul.active_deep_primary{
  max-height: 300px;
}


/*メニュー入れ子 category deep*/
.header-main-block .header-navigation-block ul ul {
  display: block;
  transition: 0.3s;
}

.header-main-block .header-navigation-block ul ul.menu_category,
.header-main-block .header-navigation-block ul ul.menu_deep {
  position: absolute;
  top: 56px;
  z-index: 1000;
  background-color:#050505;
}

.header-main-block .header-navigation-block ul ul.menu_category li,
.header-main-block .header-navigation-block ul ul.menu_deep li{
  padding:0;
  height:46px;
  line-height:46px;
}

.header-main-block .header-navigation-block ul ul.menu_category li a,
.header-main-block .header-navigation-block ul ul.menu_deep li a {
  color: #ffffff;
  /*padding:10px;*/
  /*width: 250px;*/
}


/*メニュー入れ子 category deep end*/


.header-main-block .header-navigation-block li.member a {
  /*background-color:#999999;*/
  background-color: #fff; /*202207*/
  border-left: 1px solid #ccc; /*202207*/
  font-size: inherit;
}

.header-main-block .header-navigation-block li.member a:hover {
  background-color: #050505; /*202207*/
  color: #ffffff !important;
}


/*メニュー入れ子 member*/
.header-main-block .header-navigation-block ul ul.menu_member {
  position: absolute;
  top: 58px;
  z-index: 1000;
  border-left: none;
}

.header-main-block .header-navigation-block ul ul.menu_member li a {
  background-color: #ffffff;
  color: #808080;
  border-left: none;
  height: 48px;
  line-height: 48px;
  width: 250px;
}

.header-main-block .header-navigation-block ul ul.menu_member li a:hover {
  background-color: #f0f0f0;
  color: #F36A02 !important;
}

/*メニュー入れ子 end*/


.header-main-block .header-navigation-block li.edition {
  /*background-color:#d55201;*/
  background-color: #fff; /*202207*/
  border-left: solid 1px #ccc; /*202207*/
  width: 160px;
}

.header-main-block .header-navigation-block li.edition a {
  border-left: none;
  display: block;
  /*background:url(/media/c/2012/images/responsive/japan_edition.png) left center no-repeat transparent;*/
  padding: 0 22px;
}


.header-main-block .header-navigation-block li.edition a:hover {
  background-color: #F36A02;
}

.header-main-block .header-navigation-block li.edition span {
  display: block;
  margin: 18px 0 18px 12px;
  padding-left: 25px;
  /*color:#ffffff;*/
  color: #050505; /*202207*/
  font-weight: bold;
  position: relative;
}

/*.header-main-block .header-navigation-block li.edition span:before{
  content:"";
  position:absolute;
  top:1px;
  left:0;
  box-sizing: border-box;
  width: 20px;
  height: 20px;
  border: 1px solid #050505;
  -webkit-border-radius: 50%;
  border-radius: 50%;
}*/

.header-main-block .header-navigation-block li.edition span:after {
  content: "";
  position: absolute;
  top: 6px;
  left: 6px;
  width: 6px;
  height: 6px;
  border-bottom: 1px solid #050505;
  border-left: 1px solid #050505;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}


.header-main-block .header-navigation-block li.edition span img {
  float: left;
  margin-right: 5px;
}


/*メニュー入れ子*/
.header-main-block .header-navigation-block ul ul.edition_menu {
  position: absolute;
  top: 58px;
  z-index: 1000;
  background-color: #ffffff;
}

.header-main-block .header-navigation-block ul ul.edition_menu li a {
  color: #808080;
  display: block;
  width: 160px;
  height: 48px;
  line-height: 48px;
}

.header-main-block .header-navigation-block ul ul.edition_menu li a:hover {
  background-color: #f0f0f0;
  color: #F36A02;
}

/*メニュー入れ子 end*/


/*メニュー入れ子 action*/
.header-main-block .header-navigation-block ul.menu_category, .header-main-block .header-navigation-block ul.menu_member, .header-main-block .header-navigation-block ul.edition_menu {
  /*visibility: hidden;*/
  /*display: none;*/
  /*opacity: 0;*/
  transition: 0.3s;
  /*box-shadow: 0px 0px 5px #cccccc;*/
}

.header-main-block .header-navigation-block li.menu:hover > ul.menu_category, .header-main-block .header-navigation-block li.member:hover > ul.menu_member, .header-main-block .header-navigation-block li.edition:hover > ul.edition_menu {
  /*visibility: visible;*/
  display: block;
  /*opacity: 1;*/
  /*transform: translateY(0);*/
}

/*メニュー入れ子 action end*/


/*-----------------------------------------------------------------------------
  header logo style add 202006 202108
-----------------------------------------------------------------------------*/

/*#header-wrap .header-main-block .category_logo{
  margin-right:90px;
}

#header-wrap .header-main-block .category_logo a{
  display: block;
  position: absolute;
  top: 10px;
  left:195px;
  background:url(/media/c/2020/images/category/spritesheet_category_v2.png) no-repeat;
}*/

/*#header-wrap .header-main-block .category_logo .category_retech{
  background-position:0 0;
  width:78px;
  height:32px;
}

#header-wrap .header-main-block .category_logo .category_fintech{
  background-position:0 -32px;
  width:80px;
  height:37px;
}

#header-wrap .header-main-block .category_logo .category_healthtech{
  background-position:0 -69px;
  width:80px;
  height:36px;
}

#header-wrap .header-main-block .category_logo .category_space{
  background-position:0 -105px;
  width:80px;
  height:37px;
}

#header-wrap .header-main-block .category_logo .category_workstyle{
  background-position:0 -142px;
  width:80px;
  height:37px;
}

#header-wrap .header-main-block .category_logo .category_mobility{
  background-position:0 -179px;
  width:80px;
  height:39px;
}

#header-wrap .header-main-block .category_logo .category_food{
  background-position:0 -218px;
  width:80px;
  height:37px;
}

#header-wrap .header-main-block .category_logo .category_edutech{
  background-position:0 -255px;
  width:80px;
  height:37px;
}*/


/*responsive*/
/*@media screen and (max-width: 640px){

  #header-wrap-resp .category_logo a{
    display: block;
    position: absolute;
    top: 5px;
    left: 130px;
    background-size:90%;
  }

}*/


/* ===============================================================================

FOOTER

=============================================================================== */


#pageTop {
  position: fixed;
  bottom: 15px;
  right: 15px;
  z-index: 1000;
}

#pageTop a {
  display: block;
  z-index: 1000;
  padding: 8px 0 0 8px;
  border-radius: 30px;
  width: 40px;
  height: 40px;
  background-color: #c0c0c0;
  color: #fff;
  font-weight: bold;
  text-decoration: none;
  text-align: center;
}

#pageTop a::after {
  position: absolute;
  top: 50%;
  left: 50%;
  content: '';
  width: 12px;
  height: 12px;
  margin: -3px 0 0 -6px;
  border-left: 2px solid #fff;
  border-bottom: 2px solid #fff;
  -webkit-transform: rotate(135deg);
  transform: rotate(135deg);
  box-sizing: border-box;
}

#pageTop a:hover {
  text-decoration: none;
  opacity: 0.7;
}


#footer-wrap {
  background-color: #e2e2e2;
  border-top: 1px solid #9c9c9c;
  color: #151515;
  padding: 15px 0;
  font-size: 14px;
  width: 100%;
  min-width: 1240px;
  /*box-sizing: border-box;*/
}


#footer-wrap .footer-info-block {
  background-color: #e2e2e2;
  border-bottom: 1px solid #cccccc;
  box-shadow: 0 1px 0 #ffffff !important;
  margin: 0 auto 1px;
  padding: 0 0 25px 0;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  min-width: 1240px;
  /*overflow:hidden;*/
}

.footer-info-block .info-left {
  font-size: 10px;
  padding: 0 0 0 40px;
  /*min-width:820px;*/
  color: #505050;
}

footer-info-block {
  width: 1240px; \9;
}

.footer-info-block .info-left {
  width: 800px \9;
  word-break: break-all \9;
  display: block \9;
}


.footer-info-block .info-left span {
  display: block;
}

.footer-info-block .info-right {
  padding: 0 0 0 40px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
  font-size: 12px;
  min-width: 420px;
}

.footer-info-block .info-right span {
  display: block;
}

#footer-wrap .map-block {
  margin: 0 auto;
  background-color: #e2e2e2;
  min-width: 1240px;
  display: -webkit-box; /*Android browser*/
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}


#footer-wrap .map-block div {
  padding: 15px 0;
}

#footer-wrap .map-block .footer-logo {
  text-align: center;
  padding: 25px 0; /*202207*/
}


#footer-wrap .map-block ul {
  margin: 0 auto;
  clear: both;
  display: -webkit-box; /*Android browser*/
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  min-width: 1240px;
  background-color: #e2e2e2;
}

#footer-wrap .map-block li {
  width: 198px;
  border-right: 1px solid #cccccc;
  box-shadow: 1px 0 0 #ffffff;
}

#footer-wrap .map-block li:last-child {
  border-right: none;
  box-shadow: none;
}


#footer-wrap .map-block .map-topics {
  margin: 10px 0 0 15px;
  font-size: 16px;
}

#footer-wrap .map-block .map-contents {
  margin: 15px 0 0 15px;
  font-size: 14px;
}

#footer-wrap .footer-copy-block {
  /*border-top:1px solid #cccccc;*/
  background-color: #e2e2e2;
  margin: 20px auto 10px;
  font-size: 10px;
  min-width: 1240px;
  text-align: center;
  color: #505050;
}


/* ===============================================================================

SLAIDER

=============================================================================== */


#slider-wrap {
  height: 420px;
  width: 100%;
  margin: 0;
  position: relative;
  background-color: #151515;
}


.topics-item-box {
  position: relative;
  float: left;
  overflow: hidden;
  text-align: left;
  height: 100%;
  color: #ffffff;
}

.topics-item-box a {
  font-weight: bold;
  color: #ffffff;
  display: block;
}

.topics-item-box a:hover {
  color: #ff721d !important;
}

.topics-item-box-vertical {
  display: block;
  /*height:50%;*/
  max-height: 50%;
  position: relative;
}


@media screen and (min-width: 1160px) {

  .topics-item-box-vertical {
    max-height: 48.5%;
  }
}


.item-01 {
  width: 50%;
  height: 420px;
  line-height: 1.2;
  z-index: 0;
  position: relative;
}


.item-02 {
  width: 25%;
  height: 100%;
  line-height: 1.2;
  background-size: 100%;
  z-index: 0;
  position: relative;
  overflow: hidden;
}

.item-03 {
  width: 25%;
  height: 100%;
  line-height: 1.2;
  background-size: 100%;
  z-index: 0;
}


.topics-img {
  position: relative;
  display: block;
  overflow: hidden;
}

.topics-img:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.0) 20%, rgba(0, 0, 0, 0.9) 100%); /*safari Android*/
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.0) 20%), to(rgba(0, 0, 0, 0.9) 100%)); /*safari Android*/
  background: linear-gradient(rgba(0, 0, 0, 0.0) 20%, rgba(0, 0, 0, 0.9) 100%);
  width: 100%;
  height: 100%;
}


.topics-img img {
  min-width: 100%;
}

.topics-img img.small {
  width: 80%;
}


.item-02 .topics-img img {
  max-width: 200%;
  text-align: center;
  margin-left: -40%;
}

@media screen and (min-width: 1600px) {
  .item-02 .topics-img img {
    text-align: center;
    margin-left: -20%;
  }
}


.item-01 .topics-media {
  position: absolute;
  left: 30px;
  font-size: 11px;
  font-weight: bold;
  text-align: left;
  margin: 5px 0;
  display: block;
  color: #ceee20;
  text-shadow: 0 0 7px #444444;
}

.item-01 .topics-media, .item-02 .topics-media {
  position: absolute;
  left: 25px;
  font-size: 11px;
  font-weight: bold;
  text-align: left;
  margin: 5px 0;
  display: block;
  color: #ceee20;
  text-shadow: 0 0 7px #444444;
}


.item-03 .topics-media {
  position: absolute;
  left: 20px;
  font-size: 11px;
  font-weight: bold;
  text-align: left;
  margin: 5px 0;
  display: block;
  color: #ceee20;
  text-shadow: 0 0 7px #444444;
}


.topics-text-01 {
  font-size: 28px;
  width: 100%;
  display: block;
  position: absolute;
  bottom: 15px;
}

.topics-item-box .topics-text-01 a {
  padding: 30px;
}

.topics-text-02 {
  font-size: 22px;
  width: 100%;
  display: block;
  position: absolute;
  bottom: 15px;
}

.topics-item-box .topics-text-02 a {
  padding: 25px;
}

.topics-text-03 {
  font-size: 18px;
  width: 100%;
  display: block;
  position: absolute;
  bottom: 15px;
}

.topics-item-box .topics-text-03 a {
  padding: 20px;
}

.item-01 .topics-text-summary, .item-02 .topics-text-summary {
  /*padding:0 25px;*/
  width: 90%;
  display: block;
  position: absolute;
  top: 350px;
  left: 25px;
  font-size: 14px;
  font-weight: bold;
}

.topics-item-box-vertical .topics-text-summary {
  font-size: 14px;
  /*padding:0 25px;*/
  width: 90%;
  display: block;
  position: absolute;
  top: 160px;
  left: 25px;
}

.topics-img .item02 {
  background-color: #000;
}


/*Swiper Setting*/

.swiper-container {
  min-width: 1240px !important;
}

.swiper-slide {
  width: 100%;
  height: 420px !important;
}

.swiper-container-horizontal > .swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction {
  display: block;
}


.swiper-pagination {
  display: none;
}

.swiper-button-next.swiper-button-white, .swiper-container-rtl .swiper-button-prev.swiper-button-white {
  background-color: rgba(0, 0, 0, 0.6);
  padding: 25px;
}


.swiper-pagination-bullet {
  width: 13px !important;
  height: 13px !important;
}


/*Swiper Setting end*/


/* ===============================================================================

NAVIGATION

=============================================================================== */

#content-navigation-block {
  width: 100%;
}


#content-navigation-block ul {
  display: -webkit-box; /*Android browser*/
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  margin: 10px 0;
  flex-wrap: nowrap;
  -webkit-justify-content: center;
  justify-content: center;
}

#content-navigation-block ul li {
  text-align: center;
  flex-grow: 1;
  position: relative;
}


#content-navigation-block ul li .pickup {
  position: absolute;
  top: 2px;
  left: -1px;
}


@media screen and (max-width: 1050px) {

  #content-navigation-block ul li .pickup {
    position: absolute;
    top: 2px;
    left: 0;
  }

}


#content-navigation-block ul li a, #content-navigation-block .content-menu-more {
  padding: 10px 0;
  font-size: 14px;
  font-weight: bold;
  color: #252525;
  border-right: 1px solid #a0a0a0;
  display: block;
}

#content-navigation-block ul li:first-child {
  border-left: 1px solid #a0a0a0;
}

#content-navigation-block ul li:last-child {
  border-right: none;
}

#content-navigation-block .content-menu-more:hover {
  color: #df6105 !important;
  text-decoration: none !important;
  cursor: pointer;
}

#content-navigation-block .more-navigation {
  margin-top: 10px;
}


/* ===============================================================================

          COLUMN

=============================================================================== */
#column-content-block {
  display: -webkit-box; /*Android browser*/
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  padding: 0 0 25px 0;
}


#leftside-column {
  width: 170px;
  -webkit-box-ordinal-group: 1; /*Android browser*/
  -ms-flex-order: 1;
  -webkit-order: 1;
  order: 1;
  margin-right: 35px;
  margin-left: 20px;
}

#center-column {
  /*width:640px;*/
  width: 580px;
  -webkit-box-ordinal-group: 2; /*Android browser*/
  -ms-flex-order: 2;
  -webkit-order: 2;
  order: 2;
}


#rightside-column {
  /*width:400px;*/
  width: 380px;
  -webkit-box-ordinal-group: 3; /*Android browser*/
  -ms-flex-order: 3;
  -webkit-order: 3;
  order: 3;
  margin-right: 20px;
  margin-left: 35px;
}

#content-top-block {
  width: 100%;
  margin: 0 auto;
  padding: 20px 0;
  text-align: center;
}

#content-top-block .ad {
  line-height: 0 !important;
}

#content-bottom-block {
  clear: both;
  width: 100%;
  min-width: 1240px;
  margin: 0 auto;
  padding: 30px 0;
  text-align: center;
  border-top: 1px solid #cccccc;
}

#content-bottom-block .ad_large_footer_wrapper {
  line-height: 0 !important;
}

#content-top-block .item, #content-bottom-block .item {
  text-align: center;
}

#center-column .inner-bg, #center-column .inner-pr {
  margin-top: 15px;
}


#column-content-flat {
  width: 100%;
  display: block;
}


/* ===============================================================================

 CONTENT & LAYOUT

=============================================================================== */

.content-ttl {
  border-top: 3px solid #E0e0e0;
  border-bottom: 1px solid #E0e0e0;
  padding: 10px 0 10px 3px;
  color: #aa1801;
  font-size: 16px;
}

.content-ttl-s {
  border-bottom: 1px solid #E0e0e0;
  padding: 5px 0 5px 3px;
  color: #444;
  font-size: 16px;
}

.content-ttl .pr {
  text-align: right;
  float: right;
}


.c-white {
  color: #fff;
}

.c-black {
  color: #000;
}


.page-layer {
  padding-top: 30px;
}

.content-inner {
  margin: 25px 0;
}


.list-inner li {
  border-bottom: 1px dotted #999;
  padding-bottom: 5px;
}


/*ニュース記事一覧*/

.content-article-inner {
  margin-bottom: 40px;
}


.content-article-pr {
  border-top: 1px solid #cccccc;
  border-bottom: 1px solid #cccccc;
  padding: 10px 0;
}

.content-article-pr .special-ttl {
  text-align: center;
}

.content-article-pr .pr {
  display: block;
  color: #a0a0a0;
  text-align: center;
  font-size: 14px;
  font-weight: bold;
}

.content-article-pr .leaf_pr {
  display: block;
  color: #252525;
  text-align: left;
  padding: 5px 10px;
  font-size: 14px;
  font-weight: bold;
  background-color: #e4e4e4;
}

.content-article-pr .leaf_pr p {
  font-size: 18px !important;
}

.content-article-inner:after {
  clear: both;
  content: " ";
  display: block;
}

.content-article-inner .content-article-full {
  width: 100%;
  /*margin:15px 0;*/
  margin: 15px 0 30px;
  position: relative;
}

.content-article-inner .content-article-left {
  width: 270px;
  float: left;
  margin-top: 15px;
  position: relative;
}

.content-article-inner .content-article-right {
  width: 270px;
  float: right;
  margin-top: 15px;
  position: relative;
}

.content-article-inner .content-article-center {
  width: 270px;
  text-align: center;
  float: none !important;
  margin: 10px auto;
}


.content-article-full .content-article-img {
  /*width:640px;
  height:360px;*/
  width: 580px;
  height: 326px;
  overflow: hidden;
  position: relative;
}

.content-article-full .content-article-img a:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.0) 20%, rgba(0, 0, 0, 0.9) 100%); /*safari Android*/
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.0) 20%), to(rgba(0, 0, 0, 0.9) 100%)); /*safari Android*/
  background: linear-gradient(rgba(0, 0, 0, 0.0) 20%, rgba(0, 0, 0, 0.9) 100%);
  width: 100%;
  height: 100%;
  display: block;
}


.content-article-left .content-article-img, .content-article-right .content-article-img, .content-article-center .content-article-img {
  /*width:310px;
  height:174px;*/
  width: 270px;
  height: 152px;
  overflow: hidden;
  position: relative;
}

.content-article-img img {
  position: relative;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 100%;
  height: auto;
}


.content-article-full .content-article-text {
  width: 100%;
  position: absolute;
  /*bottom:0;*/
  bottom: -20px;
  /*background:rgba(0,0,0,0.6);*/
  color: #ffffff;
}

.content-article-left .content-article-text, .content-article-right .content-article-text, .content-article-center .content-article-text {
  position: relative;
  padding: 5px 0 0 0;
  /*background-color:#ffffff;*/
  width: 100%;
}

.content-article-center .content-article-text {
  text-align: left !important;
}

.content-article-full .content-article-text span.pr, .content-article-center .content-article-text span.pr, .content-article-left .content-article-text span.pr, .content-article-right .content-article-text span.pr {
  text-align: center !important;
  display: block;
  color: #a0a0a0;
}

.content-article-full .content-article-text span.pr { /*202406*/
  text-align: left !important;
  padding: 0 20px;
  color: #fff;
}

.content-article-full .content-article-text .text-main {
  font-size: 28px;
  margin: 0 0 20px 0;
  padding: 20px;
  line-height: 1.2;
  color: #ffffff;
  letter-spacing: 0.05em;
}


.content-article-full .content-article-text .text-summary {
  font-size: 18px;
  /*margin-bottom:10px;*/
  line-height: 1.4;
  font-weight: normal;
  color: #252525;
}

.content-article-left .content-article-text .text-main, .content-article-right .content-article-text .text-main, .content-article-center .content-article-text .text-main {
  font-size: 18px;
  /*margin-bottom:5px;*/
  line-height: 1.4;
  color: #252525;
  letter-spacing: 0.05em;
}

.content-article-left .content-article-text .text-summary, .content-article-right .content-article-text .text-summary, .content-article-center .content-article-text .text-summary {
  font-size: 14px;
  line-height: 1.4;
  font-weight: normal;
  color: #252525;
}


.content-article-text span.date {
  display: block;
  color: #a0a0a0 !important;
  font-size: 12px;
  text-align: right;
  margin-right: 0 !important;
}

.content-article-full .content-article-text span.date {
  display: block;
  position: absolute;
  right: 0;
  bottom: 0;
  /*bottom:-20px;*/
}

.content-more a,
.content-article-more a {
  border-radius: 8px;
  text-align: center;
  background-color: #ffffff;
  /*background-image:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ffffff), color-stop(100%, #eeeeee));
  background-image:-webkit-linear-gradient(#ffffff,#eeeeee);
  background-image:-moz-linear-gradient(#ffffff,#eeeeee);
  background-image:-o-linear-gradient(#ffffff,#eeeeee);
  background-image:linear-gradient(#ffffff,#eeeeee);*/
  /*text-shadow:0 1px rgba(255,255,255,0.9);*/
  border: 1px solid #cccccc;
  box-shadow: 0 0 1px rgba(0, 0, 0, 0.1);
  color: #444444;
  font-size: 18px;
  font-weight: bold;
  cursor: pointer;
  margin-bottom: 50px;
  padding: 25px 0;
  display: block;
}

.content-more a:hover,
.content-article-more a:hover {
  background-color: #efefef;
}


span.date {
  color: #a0a0a0 !important;
}


/*グループメディア・Yahoo*/
.content-media-inner:after {
  clear: both;
  content: " ";
  display: block;
}

.content-media-inner {
  background-color: #ffffff;
  margin: 15px 0;
  padding: 15px;
  /*box-shadow: 0 0 5px #ccc;*/
  border: 1px solid #d7d7d7;
}

.content-media-inner .media-ttl {
  border-bottom: 1px dotted #cccccc;
  padding-bottom: 3px;
}


.content-media-inner .icon-zdnet {
  background: url(/media/c/2012/images/responsive/spritesheet.png) no-repeat;
  background-position: -95px -80px;
  width: 70px;
  height: 25px;
  display: block;
}


.content-media-inner .icon-techrepublic {
  background: url(/media/c/2012/images/responsive/spritesheet.png) no-repeat;
  background-position: -81px -45px;
  width: 80px;
  height: 25px;
  display: block;
}


.content-media-inner .icon-builder {
  background: url(/media/c/2012/images/responsive/spritesheet.png) no-repeat;
  background-position: -117px -5px;
  width: 75px;
  height: 30px;
  display: block;
}


.content-media-inner .icon-asahi {
  background: url(/media/c/2012/images/responsive/spritesheet.png) no-repeat;
  background-position: -5px -81px;
  width: 80px;
  height: 25px;
  display: block;
}


.content-media-inner ul li {
  /*background:url(/media/c/2012/images/responsive/icon_arrow_gray.png) 0 center no-repeat transparent;*/
  margin: 10px 0 0 0;
  padding: 0 0 0 22px;
  position: relative;
  font-size: 14px;
}

.content-media-inner ul li::before {
  content: "";
  position: absolute;
  top: 3px;
  left: 0;
  box-sizing: border-box;
  width: 16px;
  height: 16px;
  border: 1px solid #b8b8b8;
  -webkit-border-radius: 50%;
  border-radius: 50%;
}

.content-media-inner ul li::after {
  content: "";
  position: absolute;
  top: 8px;
  left: 5px;
  width: 4px;
  height: 4px;
  border-top: 1px solid #b8b8b8;
  border-right: 1px solid #b8b8b8;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.content-media-inner ul li a {
  color: #252525;
}

.content-media-inner .ad_interestmatch {
  border: none !important;
}

/*グループメディア・Yahoo end*/


.left-article-block {
  margin-bottom: 20px;
}


.left-article-block ul li a {
  margin: 20px 0 0 0;
  position: relative;
  font-size: 14px;
  color: #444444;
  display: block;
}


.left-article-block ul li span {
  /*background:url(/media/c/2012/images/responsive/icon_arrow_time.png) 0 center no-repeat transparent;*/
  color: #a0a0a0;
  display: block;
  font-size: 12px;
  position: relative;
}


.left-article-block .icon-time {
  color: #a0a0a0;
  width: 15px;
  height: 15px;
  border: solid 1px currentColor;
  border-radius: 8px;
  float: left;
  margin-top: 2px;
  margin-right: 5px;
}


.left-article-block .icon-time::before {
  content: '';
  position: absolute;
  top: 7px;
  left: 3px;
  width: 5px;
  height: 1px;
  background-color: currentColor;
  -webkit-transform-origin: 0% 0%;
  transform-origin: 0% 0%;
}

.left-article-block .icon-time::after {
  content: '';
  position: absolute;
  top: 2px;
  left: 7px;
  width: 1px;
  height: 6px;
  background-color: currentColor;
  -webkit-transform-origin: 0% 0%;
  transform-origin: 0% 0%;
}


.left-article-block ul li.story-rank span.rank {
  border-radius: 20%;
  width: 20px;
  height: 20px;
  color: #ffffff;
  background: none;
  display: block;
  float: left;
  text-align: center;
  line-height: 19px;
  margin-right: 5px;
}


.left-article-block ul li.story-rank span.rank1 {
  background-color: #b3ad0e;
}

.left-article-block ul li.story-rank span.rank2 {
  background-color: #6f9193;
}

.left-article-block ul li.story-rank span.rank3 {
  background-color: #a45545;
}

.left-article-block ul li.story-rank span.rankall {
  background-color: #999;
}


/*ad banner*/
.right-ad-block {
  margin-bottom: 5px;
  text-align: center;
  width: 380px;
}

.right-ad-block div {
  margin-bottom: 15px;
}


/*企画広告*/
.right-tieup-block {

}

@media screen and (max-width: 960px) {/*960px以下で非表示*/
  .responsive_hidden{
    display: none;
  }
}

@media screen and (min-width: 960px) {/*960px以上で非表示*/
  .fullsize_hidden{
    display: none;
  }
}

.tieup-inner {
  margin: 15px 0;
}

.tieup-inner img {
  float: left;
  margin: 3px 10px 0 0;
}

.tieup-inner li {
  padding: 15px 0;
}

.tieup-inner li:last-child {
  border-bottom: none;
}

.tieup-inner li a {
  color: #444444;
  font-size: 16px;
}

.tieup-inner li a:hover {
  color: #860000
}

.tieup-inner li p {
  font-size: 14px;
  padding-left: 90px;
}

}


.right-tieup-block .view-more {
  clear: both;
  float: right;
  text-align: right;
  margin-bottom: 10px;
  padding-left: 15px;
  /*background: url(/media/c/2012/images/responsive/icon_arrow_red.png) no-repeat left center;*/
  white-space: nowrap;
  position: relative;
}

.right-tieup-block .view-more::before {
  content: "";
  position: absolute;
  top: 2px;
  left: 0;
  box-sizing: border-box;
  width: 16px;
  height: 16px;
  border: 1px solid #aa1801;
  -webkit-border-radius: 50%;
  border-radius: 50%;
}

.right-tieup-block .view-more::after {
  content: "";
  position: absolute;
  top: 7px;
  left: 5px;
  width: 4px;
  height: 4px;
  border-top: 1px solid #aa1801;
  border-right: 1px solid #aa1801;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}


/*企画広告 end*/


/*ホワイトペーパー*/
.right-wp-block {
}

.right-wp-block ul {
  padding: 15px 0;
}

.right-wp-block ul li {
  float: left;
  display: block;
  width: auto;
  line-height: 1em;
  margin: 0 20px 7px 0;
  padding-left: 5px;
  border-left: 4px solid #e4e4e4;
  white-space: nowrap;
  font-size: 14px;
}

/*ホワイトペーパー end*/


/*お知らせ*/
.right-info-block {
}

.right-info-block ul, .right-info-block .item {
  padding: 15px 0;
}

.right-info-block ul li {
  font-size: 14px;
}

.right-info-block .item a img {
  text-align: center;
  display: block;
  margin: 0 auto;
}


/* -----------------------------------------------------------------------
  category page
--------------------------------------------------------------------------*/


.content-category-inner {
  margin: 25px 0;
}

.content-category-inner ul li {
  margin: 10px 0;
  padding-bottom: 2px;
  border-bottom: 1px dotted #cccccc;
  /*background:url(/media/c/2012/images/responsive/icon_arrow_red.png) no-repeat left 10%;*/
  position: relative;
  font-size: 14px;
}

.content-category-inner ul li::before {
  content: "";
  position: absolute;
  top: 3px;
  left: 0;
  box-sizing: border-box;
  width: 16px;
  height: 16px;
  border: 1px solid #aa1801;
  -webkit-border-radius: 50%;
  border-radius: 50%;
}

.content-category-inner ul li::after {
  content: "";
  position: absolute;
  top: 8px;
  left: 5px;
  width: 4px;
  height: 4px;
  border-top: 1px solid #aa1801;
  border-right: 1px solid #aa1801;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.content-category-inner ul li a {
  /*background:url(/media/c/2012/images/responsive/spritesheet.png) no-repeat -5px -65px;*/
  padding-left: 22px;
  color: #252525;
}

.content-category-inner li span {
  display: block;
  text-align: right;
}

.content-category-inner li:last-child {
  border-bottom: none;
  margin-bottom: 20px;
}

.inner-bg, .inner-pr {
  /*background-color: #f4f4f4;*/
  margin-bottom: 20px;
  padding: 0 15px;
}

.inner-zdnet {
  /*background-color:#e7eef6;*/
  background-color: #f4f4f4;
  padding:15px;
}

.inner-zdnet .content-ttl {
  border-top: 3px solid #c9d7e4;
  border-bottom: 1px solid #c9d7e4;
  padding: 10px 0;
  color: #1E3C5B;
  font-size: 16px;
}

.more-s a {
  border-radius: 5px;
  padding: 12px 0;
  font-size: 14px;
  font-weight: bold;
}

.inner-pr .pr {
  margin-bottom: 5px;
}

.inner-pr .pr:last-child {
  margin-bottom: 0;
}

.inner-pr .pr a {
  color: #444444;
}

.inner-pr a {
  color: #0f0f0f !important;
}

.inner-pr a:hover {
  color: #df6105 !important;
  text-decoration: none !important;
}

.inner-pr span {
  margin-right: 5px;
  text-align: left;
  border-right: 1px solid #cccccc;
  color: #cccccc;
  padding-right: 10px
}

/*ad text*/
#center-column .ad_text_top, #center-column .ad_text_bottom {
  font-size: 12px !important;
}


.left-navigation-block li a {
  border-bottom: 1px solid #e0e0e0;
  height: 48px;
  line-height: 48px;
  /*font-weight:bold;*/
  display: block;
  padding-left: 3px;
}

.left-navigation-block li img {
  float: left;
  margin-right: 5px;
}

.left-navigation-block li:last-child {
  border-bottom: none;
}


.right-pickup-block .pickup-inner {
  margin: 15px 0 30px;
}

.right-pickup-block .pickup-inner li {
  border-bottom: 1px dotted #cccccc;
  margin-bottom: 15px;
  padding-bottom: 20px;
  padding-left: 0;
  position: relative;
  font-size: 14px;
  overflow: hidden;
}

.right-pickup-block .pickup-inner li::before {
  content: "";
  position: absolute;
  top: 3px;
  left: 0;
  box-sizing: border-box;
  width: 16px;
  height: 16px;
  border: 1px solid #a0a0a0;
  -webkit-border-radius: 50%;
  border-radius: 50%;
}


.right-pickup-block .pickup-inner li::after {
  content: "";
  position: absolute;
  top: 8px;
  left: 5px;
  width: 4px;
  height: 4px;
  border-top: 1px solid #a0a0a0;
  border-right: 1px solid #a0a0a0;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.right-pickup-block .pickup-inner li::before,
.right-pickup-block .pickup-inner li::after {
  display: none;
}

.right-pickup-block .pickup-inner li a img {
  width: 80px;
  float: left;
  margin-right: 10px;
}


.right-pickup-block .pickup-inner li.story-rank {
  background: none;
  padding-left: 0;
}

.right-pickup-block .pickup-inner li.story-rank a {
  padding-left: 0;
}

.right-pickup-block .pickup-inner li.story-rank::before,
.right-pickup-block .pickup-inner li.story-rank::after {
  display: none;
}


.right-pickup-block .pickup-inner li.story-rank span.rank {
  border-radius: 50%;
  width: 26px;
  height: 26px;
  color: #ffffff;
  background: none;
  display: block;
  float: left;
  text-align: center;
  line-height: 26px;
  margin-right: 10px;
}

.right-pickup-block .pickup-inner li.story-rank span.rank1 {
  background-color: #b3ad0e;
}

.right-pickup-block .pickup-inner li.story-rank span.rank2 {
  background-color: #6f9193;
}

.right-pickup-block .pickup-inner li.story-rank span.rank3 {
  background-color: #a45545;
}

.right-pickup-block .pickup-inner li.story-rank span.rankall {
  background-color: #e0e0e0;
  color: #444;
}


/*-----------------------------------------------------------------------------
  ranking style add 202006
-----------------------------------------------------------------------------*/


.right-pickup-block .pickup-inner li.story-rank .access-rank-box {
  display: block;
  float: left;
  padding: 5px 10px 25px 0;
}


.right-pickup-block .pickup-inner li.story-rank .access-rank1,
.right-pickup-block .pickup-inner li.story-rank .access-rank2,
.right-pickup-block .pickup-inner li.story-rank .access-rank3 {
  font-family: 'OCRB';
  font-size: 26px;
  display: block;
}

.right-pickup-block .pickup-inner li.story-rank .access-rank1 {
  color: #df9b02;
}

.right-pickup-block .pickup-inner li.story-rank .access-rank2 {
  color: #4f8b8f;
}

.right-pickup-block .pickup-inner li.story-rank .access-rank3 {
  color: #bc452d;
}

.right-pickup-block .pickup-inner li.story-rank .access-rank-box a {
  margin-left: 25px;
}


/* -----------------------------------------------------------------------
 archive page
--------------------------------------------------------------------------*/


#archive_top_navi {
  background-color: #fff;
  border: 1px solid #ccc;
  font-size: 100%;
  margin: 0 auto 20px;
  padding: 2%;
  width: 95%;
}

.archive_year, .archive_month, .archive_year, .archive_day {
  border-bottom: 2px dotted #b0b0b0;
  margin-bottom: 10px;
}


.archive_year span {
  background-color: #f4f4f4;
  padding: 5px;
}


.archive_month span {
  background-color: #eaeaea;
  padding: 5px;
}

.archive_day {
  border-bottom: none;
  padding-top: 15px;
}

.archive_day span {
  background-color: #ccc;
  padding: 5px;
}


#archive_top_navi span {
  display: inline-block;
  margin: 0 0 15px 10px;
}

#archive_top_navi span b {
  color: #aa1801;
  font-size: 120%;
}


a.nav-archive {
  display: block;
  color: #aa1801;
  position: relative;
  margin-bottom: 20px;
}


a.nav-archive::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  box-sizing: border-box;
  width: 18px;
  height: 18px;
}


a.nav-archive::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 170px;
  width: 10px;
  height: 10px;
  border-top: 2px solid #aa1801;
  border-right: 2px solid #aa1801;
  -webkit-transform: rotate(135deg);
  transform: rotate(135deg);
}


/* -----------------------------------------------------------------------
  story article leaf page
--------------------------------------------------------------------------*/

#page-wrap .ad-item {
  text-align: center;
}

.breadcrumbs-block {
  overflow: hidden;
  margin: 0 0 15px 0;
}

.breadcrumbs-block span {
  margin-right: 5px;
}

.breadcrumbs-block .point {
  color: #aa1801;
}

#leaf-column {
  width: 785px;
  order: 1;
  margin-left: 20px;
}


#leaf-column .leaf-headline-block {
  margin-bottom: 25px;
  border-bottom: 3px solid #e0e0e0;
}


#leaf-column .leaf-headline-top{
  display:flex;
}

#leaf-column .leaf-headline-ttl {
  font-size: 2.25rem;
  line-height: 1.3;
  color: #252525;
  letter-spacing: 0.03em;
  /*padding-left:200px;*/
}


#leaf-column .leaf-headline-thumb {
  float: left;
  width: 184px;
  height: 138px;
  overflow: hidden;
  display: block;
  position: relative;
  margin-right: 15px;
  flex-shrink:0;
}


.leaf-headline-thumb-sp { /*480px以下で表示*/
  display: none;
}

.leaf-headline-thumb img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: auto;
}

#leaf-column .leaf-icon-tags { /*tagbadge*/
  background-color: #aa1801;
  border-radius: 2px;
  font-size: 12px;
  font-weight: bold;
}

#leaf-column .leaf-icon-tags span { /*tagbadge*/
  vertical-align: top;
  text-align: center;
  color: #ffffff;
  padding: 3px 10px;
}


#leaf-column .leaf-icon-tags a span { /*tagbadge*/
  color: #ffffff !important;
  margin-right: 3px !important;
}

#leaf-column .leaf-icon-tags a:hover { /*tagbadge*/
  background-color: #d55201;
  border-radius: 2px;
  color: #ffffff !important;
}


#leaf-column .leaf-headline-inner {
  clear: both;
  padding: 5px 0 15px;
  color: #a0a0a0;
  font-size: 14px;
  font-weight: bold;
}

#leaf-column .leaf-headline-inner .writer {
  margin-right: 10px;
  color: #808080;
  font-size: 12px;
  font-weight: normal !important;
}

#leaf-column .leaf-headline-inner .date {
  color: #808080 !important;
  font-size: 12px;
  font-weight: normal !important;
}

#leaf-column .leaf-headline-inner .date a {
  color: #808080 !important;
  font-size: 12px;
}

#leaf-column .leaf-headline-inner .date a:hover {
  color: #df6105 !important;
}

#leaf-column .leaf-social-inner {
  margin-bottom: 25px;
  border-top: 1px dotted #dddddd;
}

#leaf-column .leaf-social-inner .social-item,
#leaf-column .leaf-social-inner .social-item-bottom,
#center-column .leaf-social-inner .social-item {
  display: -webkit-box; /*Android browser*/
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  flex-wrap: wrap;
  text-align: left;
  margin: 10px 0 0 0;
  z-index: 100;
}

#leaf-column .leaf-social-inner .social-item li {
  color: #ffffff;
  /*margin-right: 7px;*/
  margin: 0 4px !important;
  font-size: 12px;
  color: #ffffff;
  display: block;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  /*width:60px;*/
  width: auto;
  height: 20px;
  position: relative;
}

#leaf-column .leaf-social-inner .social-item-bottom li {
  margin-right: 7px;
  display: block;
  padding: 0 7px 0 2px;
  position: relative;
}

#leaf-column .social-item li:hover {
  color: #ffffff !important;
  opacity: 1.0;
}

#leaf-column .leaf-social-inner .social-item .css-icon {
  display: block;
}

#leaf-column .leaf-social-inner .social-item span.link {
  cursor: pointer;
}

#leaf-column .leaf-social-inner .social-item span.list {
  color: #0f0f0f;
  cursor: pointer;
}

#leaf-column .leaf-social-inner .social-item span.list:hover {
  color: #d55201;
}


/*social-item atode add 202202*/
/*social-item atode add 202406 変更*/
#leaf-column .social-item li.icon-print,
#leaf-column .social-item li.icon-mail,
#leaf-column .social-item li.icon-save,
#leaf-column .social-item li.icon-clip {
  /*width: 50px;*/
width:60px;
  padding: 2px 5px;
  background: #444;
  border: none !important;
  position: relative;
}

@media screen and (max-width: 480px) {
  #leaf-column .social-item li.icon-print {
    display: none !important;
  }
}


/*icon-print*/
#leaf-column .social-item li.icon-print .text {
  padding-left: 24px;
  display: none;
}

#leaf-column .social-item li.icon-print {
  border: none !important;
  /*background-color: #256fad;*/
  background: #444 url(/media/c/2012/images/responsive/icon_media_print.svg) center top no-repeat;
}


/*icon-mail*/
#leaf-column .social-item li.icon-mail .text {
  padding-left: 24px;
  display: none;
}

#leaf-column .social-item li.icon-mail {
  /*background-color: #368e10 !important;*/
  background: #444 url(/media/c/2012/images/responsive/icon_media_mail.svg) center top no-repeat;
}


/*icon-save*/
#leaf-column .social-item li.icon-save .text {
  padding-left: 22px;
  display: none;
}

#leaf-column .social-item li.icon-save {
  /*background-color: #17a185;*/
  background: #444 url(/media/c/2012/images/responsive/icon_media_save.svg) center top no-repeat;
}


/*icon-clip*/
#leaf-column .social-item li.icon-clip .text {
  padding-left: 24px;
  font-size: 12px;
  display: none;
}

#leaf-column .social-item li.icon-clip {
  /*background-color: #f67f30 !important;*/
  background: #444 url(/media/c/2012/images/responsive/icon_media_clip.svg) center top no-repeat;
}


#leaf-column #atode_action {
  /*background: #f67f30 !important;*/
  /*border: 1px solid #f67f30 !important;*/
  color: #ffffff !important;
}

#leaf-column #atode_action a, #leaf-column #atode_action a:hover {
  color: #ffffff;
  box-shadow: none !important;
}

#leaf-column #atode_action:hover {
  box-shadow: none !important;
}


#leaf-column .social-item li span a:hover {
  color: #ffffff !important;
}

#leaf-column .social-item li span.text::before, #leaf-column .social-item li span.text::after {
  display: none;
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  selector:not(:target) {
    #leaf-column .social-item li span.text:padding-top:

    2px;
  }
}

#atode_print, #atode_print a {
  background: none;
  border: none !important;
  margin-right: 0 !important;
  color: #ffffff !important;
}


#leaf-column .leaf-social-inner li ul {
  visibility: hidden;
  opacity: 0;
  transition: 0.3s ease-in-out;
  box-shadow: 0px 0px 5px #cccccc;
  background-color: #ffffff;
}


/*メニュー入れ子*/
#leaf-column .leaf-social-inner li:hover > ul {
  visibility: visible;
  opacity: 1;
}

#leaf-column .leaf-social-inner ul {
  position: relative;
}

#leaf-column .leaf-social-inner ul ul.pull {
  display: block;
  position: absolute;
  top: 20px;
  left: 0;
  background: #ffffff !important;
}

#leaf-column .leaf-social-inner ul ul.pull li {
  border-bottom: 1px solid #cccccc;
  margin: 0 !important;
  padding: 2px;
  width: 90px;
  border-radius: 0px;
  background-color: #f5f5f5; /*202406色変更*/
}

/*メニュー入れ子 end*/


#leaf-column .leaf-article-inner {
  margin-bottom: 20px;
}

#leaf-column .leaf-article-inner:after {
  content: "";
  display: block;
  clear: both;
}

#leaf-column .leaf-article-inner .leaf-article-ttl {
  font-size: 24px;
  color: #252525;
  margin: 50px 0 25px 0;
  padding-bottom: 10px;
  text-align: left;
  border-bottom: 1px solid #ccc;
}

#leaf-column .leaf-article-inner h2 {
  font-size: 24px;
  margin: 30px 0 20px;
  /*clear:both;*/
}

#leaf-column .leaf-article-inner h2.sp {
  border-bottom: 1px solid #444444;
}

#leaf-column .leaf-article-inner em {
  font-weight: bold;
}

#leaf-column .leaf-article-inner h4 {
  margin: 0 0 15px 0;
}

#leaf-column .leaf-article-inner p {
  margin-bottom: 20px;
  font-size: 18px;
  color: #252525;
  line-height: 1.6;
  letter-spacing: 0.08em;
}

#leaf-column .leaf-article-inner div a,
#leaf-column .leaf-article-inner p a,
#leaf-column .leaf-article-inner ul li a,
#leaf-column .leaf-article-inner ol li a,
#leaf-column .leaf-article-inner span a {
  color: #0b8ebf;
  text-decoration: underline;
  font-weight: bold;
}

#leaf-column .leaf-article-inner .leaf-caption, #leaf-column .leaf-article-inner .caption {
  color: #505050;
  font-size: 14px;
  font-weight: normal;
  margin-bottom: 5px;
  line-height: 1.2;
}

#leaf-column .leaf-article-inner .credit {
  color: #a0a0a0;
  font-size: 12px;
  font-weight: normal;
  margin-bottom: 5px;
  line-height: 1.2;
}

/*img setting*/
#leaf-column .leaf-article-inner .left, #leaf-column .leaf-article-inner .right, #leaf-column .leaf-article-inner .center, #leaf-column .leaf-article-inner .left a, #leaf-column .leaf-article-inner .right a, #leaf-column .leaf-article-inner .center a {
  line-height: 1.2;
  color: #666666;
  margin-top: 10px;
  margin-bottom: 10px;
  font-size: 14px !important;
  text-align: left;
}


#leaf-column .leaf-article-inner .left {
  margin: 10px 10px 10px 0;
  clear: left;
  float: left;
}

#leaf-column .leaf-article-inner .right {
  margin: 10px 0 10px 10px;
  clear: right;
  float: right;
}

#leaf-column .leaf-article-inner .center {
  margin: 0 auto 25px;
  text-align: center;
}


#leaf-column .leaf-article-inner .img-l {
  max-width: 184px;
}

#leaf-column .leaf-article-inner .img-l img {
  max-width: 100%;
}

#leaf-column .leaf-article-inner .img-xl {
  max-width: 240px;
}

#leaf-column .leaf-article-inner .img-xl img {
  max-width: 100%;
}

#leaf-column .leaf-article-inner .img-xxxl {
  max-width: 640px;
}

#leaf-column .leaf-article-inner .img-xxxl img {
  max-width: 100%;
}

#leaf-column .leaf-article-inner .img-xxxl {
  line-height: 1.2;
  color: #666666;
  font-size: 14px !important;
}

/*img setting end*/

#leaf-column .leaf-article-inner .leaf_body_foot p { /*注釈*/
  clear: both;
  color: #8C8C8C;
  text-align: right;
  display: block;
  font-size: 12px;
}

#leaf-column .leaf-article-inner ol li { /*list setting*/
  list-style-type: decimal;
  margin: 10px 0 10px 40px;
  padding: 0;
}

#leaf-column .leaf-article-inner .note {
  text-align: right;
  color: #a0a0a0;
  font-size: 14px;
  font-weight: bold;
}

#leaf-column .leaf-article-inner .note a {
  color: #a0a0a0;
  font-weight: bold;
}

#leaf-column .leaf-article-inner .note a:hover {
  text-decoration: underline;
}


#leaf-column .leaf-article-inner .leaf-article-related {
  border-top: 1px solid #e0e0e0;
  border-bottom: 3px solid #e0e0e0;
  padding: 10px;
}

.leaf-article-related a {
  display: block;
  text-align: center;
}


.leaf-item-inner {
  margin: 15px 0;
}

.leaf-item-inner ul li {
  margin: 10px 0;
  padding-bottom: 5px;
  border-bottom: 1px dotted #cccccc;
  position: relative;
  font-size: 14px;
}

.leaf-item-inner ul li a {
  color: #252525;
}

.leaf-item-inner ul li::before {
  content: "";
  position: absolute;
  top: 4px;
  left: 0;
  box-sizing: border-box;
  width: 16px;
  height: 16px;
  border: 1px solid #b8b8b8;
  -webkit-border-radius: 50%;
  border-radius: 50%;
}

.leaf-item-inner ul li::after {
  content: "";
  position: absolute;
  top: 9px;
  left: 5px;
  width: 4px;
  height: 4px;
  border-top: 1px solid #b8b8b8;
  border-right: 1px solid #b8b8b8;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.leaf-item-inner ul li a {
  padding-left: 20px;
}

.leaf-item-inner ul li span {
  display: block;
  text-align: right;
  font-size: 12px;
  color: #a0a0a0;
  /*float:right;*/
  text-align: right;
}

.leaf-item-inner ul li:last-child {
  border-bottom: none;
  margin-bottom: 5px;
}


.leaf-item-inner .item-word {
  display: -webkit-box; /*Android browser*/
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
  flex-direction: row;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  background: #f5f5f5;
  margin: 0 0 10px 0;
  padding: 10px;
}

.leaf-item-inner .item-word li {
  color: #aa1801;
  background: none;
  border-bottom: none;
  margin: 0;
  padding: 0 20px 0 0;
}

.leaf-item-inner .item-word li a {
  color: #666666 !important;
  padding-left: 0 !important;
}

.item-word li::before, .item-word li::after {
  display: none;
}


.leaf-keyword-block .keyword-inner {
  margin: 15px auto;
  display: -webkit-box; /*Android browser*/
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.leaf-keyword-block .keyword-inner li {
  margin-right: 5px;
}

.leaf-keyword-block .keyword-inner li span {
  display: block;
  background-color: #e0e0e0;
  color: #252525;
}


.leaf_splist_navi {
  position: relative;
  padding: 15px 10px 8px;
  margin: 30px 0 15px;
  background-color: #e4e4e4;
}

.leaf_splist_navi span {
  position: absolute;
  top: -10px;
  padding: 0 5px;
  background-color: #333333;
  color: #ffffff;
  font-size: 85%;
  line-height: 1.6;
}

#contents_l .leaf_splist_navi p {
  margin: 0;
}

#contents_l .leaf_splist_navi p a {
  color: #830000;
}

.leaf_pagenavi a {
  background-color: #505050;
  padding: 8px;
  margin-bottom: 40px;
  text-align: center;
  color: white;
  display: block;
  font-weight: normal;
  font-size: 16px;
}

#layout1media #layoutmedia_wrap ul#layoutmedia {
  width: 150px;
}

.leaf-article-inner .article_body .t_link {
  position: relative;
  margin-bottom: 5px !important;
  padding-left: 25px;
  display: inline-block;
}

.leaf-article-inner .article_body .t_link:before {
  content: "";
  position: absolute;
  top: 4px;
  left: 0;
  box-sizing: border-box;
  width: 16px;
  height: 16px;
  border: 1px solid #aa1801;
  -webkit-border-radius: 50%;
  border-radius: 50%;
}

.leaf-article-inner .article_body .t_link:after {
  content: "";
  position: absolute;
  top: 9px;
  left: 5px;
  width: 4px;
  height: 4px;
  border-top: 1px solid #aa1801;
  border-right: 1px solid #aa1801;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}


#leaf-column .leaf-article-inner .box_gray { /*記事中囲み枠*/
  clear: both;
  margin: 0 0 20px 0;
  padding: 15px;
  border-radius: 10px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  background-color: #f0f0f0;
}

.bock-btn-default {
  clear: both;
  padding: 20px 0;
  text-align: center;
  font-size: 120%;
}

.btn-default-red {
  display: block;
  background-color: #AA1801;
  border-radius: 10px;
  margin: 0 auto;
  padding: 20px;
  width: 80%;
  text-align: center;
  text-decoration: none !important;
  color: #fff !important;
}

.btn-default-red:hover {
  color: #fff !important;
  background: #D55202;
}


/*サムネイル*/

#layout1media, #layout2media, #layout3media {
  clear: both;
  display: block;
  margin: 0;
  padding: 0;
  text-align: center;
}

#layout2media ul#layoutmedia li,
#layout2media ul#layoutmedia li img {
  width: 227px;
}

#layout3media {
  margin: 0 auto;
  width: 462px;
  text-align: center;
}

#layoutmedia_wrap {
  clear: both;
  display: block;
  float: none;
  margin: 0 auto 10px !important;
  padding: 0 !important;
  position: relative;
  text-align: left;
}

#layoutmedia_wrap ul#layoutmedia {
  margin: 0 auto !important;
  text-align: center;
  width: auto;
  clear: both;
  display: block;
  float: none;
  list-style: none outside none;
  margin: 0 auto 10px !important;
  padding: 0 !important;
  text-align: center;
  overflow: hidden;
}

#layoutmedia_wrap ul#layoutmedia li {
  background: none repeat scroll 0 0 transparent !important;
  border: 2px solid #FFFFFF;
  clear: none;
  display: block;
  float: left;
  list-style: none outside none;
  margin: 0 !important;
  padding: 0 0 10px !important;
  text-align: left;
  vertical-align: top;
  width: 25%;
}


#layoutmedia_wrap ul#layoutmedia li a.media_l {
  margin: 0;
  padding: 0;
  border: none;
  display: block;
  clear: none;
  position: relative;
}


#layoutmedia_wrap ul#layoutmedia li img {
  clear: none;
  display: inline-block !important;
  margin: 0;
  padding: 0;
}

#layout1media ul#layoutmedia li, #layout1media ul#layoutmedia li img, #layout3media ul#layoutmedia li, #layout3media ul#layoutmedia li img {
  width: 150px;
}

#layoutmedia_wrap ul#layoutmedia li img.glass {
  width: 18px;
  height: 18px;
  margin: -18px 0 0 0 ! important;
  padding: 0 ! important;
  display: inline-block ! important;
  position: absolute;
  right: 0;
  bottom: 9px;
  _bottom: 6px;
  visibility: hidden;
  opacity: 0.7;
  filter: progid:DXImageTransform.Microsoft.Alpha(Enabled=1, Style=0, Opacity=70);
  visibility: visible;
}

#layoutmedia_wrap ul#layoutmedia li a img.glass {
  visibility: visible;
}


#layoutmedia_wrap ul#layoutmedia li a:hover img {
  opacity: 0.7;
  filter: progid:DXImageTransform.Microsoft.Alpha(Enabled=1, Style=0, Opacity=70);
}


#layoutmedia_wrap ul#layoutmedia li p.credit,
#layoutmedia_wrap ul#layoutmedia li p.credit a {
  color: #999999;
  font-size: 10px;
  line-height: 1.1em;
}

#layoutmedia_wrap ul#layoutmedia li p {
  clear: both;
  display: block;
  font-size: 12px;
  line-height: 1.5em;
  margin: 0;
  padding: 5px 5px 0;
  text-align: left;
}


blockquote {
  border-left: 4px solid #CCC8B8;
  margin-bottom: 1em;
  margin-left: 30px;
  padding-left: 6px;
}


/*-----------------------------------------------------------------------------
  story index add 202308
-----------------------------------------------------------------------------*/


.inner-story-index {
  background-color: #f5f5f5;
  border-radius: 5px;
  padding: 24px;
}

.inner-story-index:before {
  content: "目次";
  padding-bottom: 4px;
  border-bottom: 1px solid #ccc;
}

.inner-story-index ol {
  counter-reset: counter;
  list-style-type: none;
}

.inner-story-index ol li {
  list-style-type: none !important;
  margin: 5px 0 !important;
  font-weight: bold;
}

.inner-story-index ol li a {
  color: #000 !important;
}

.inner-story-index ol li:before {
  counter-increment: counter;
  content: counters(counter, '-') '. ';
}

.inner-story-index ol ol {
  padding: 10px 0 !important;
}

.inner-story-index ol ol li {
  margin-left: 24px !important;
  font-weight: normal !important;
  color: #757575 !important;
}

.inner-story-index ol ol li a {
  font-weight: normal !important;
  color: #757575 !important;
}


/*-------------------------------------------------------------------------
 PHOTOBOX フォトレポ
 --------------------------------------------------------------------------*/

.story_photoreport {
  clear: both;
}

#shareBarHolder {
  /*width: 620px;*/
  width: 100%;
  margin: 0 auto 50px;
}

#slideShowMain {
  clear: left;
  margin: 10px 0 0 0;
  position: relative;
  z-index: 0;
  background-color: #000;
}

/*#slideShowMain:after {
  -webkit-box-shadow: 0 0 30px rgba(0,0,0,0.4) inset;
  -moz-box-shadow: 0 0 30px rgba(0,0,0,0.4) inset;
  box-shadow: 0 0 30px rgba(0,0,0,0.4) inset;
  content: "";
  display: block;
  height: 100%;
  left: 0;
  overflow: hidden;
  position: absolute;
  top: 0;
  width: 620px;
  z-index: 0;
}*/
#slideShowMain .galleryImage {
  position: relative;
  text-align: center;
}

#article_image_slider .slider{
  margin:0 !important;
}
#article_image_slider .slider_caption{
  width:95% !important;
}
#article_image_slider .slider_image{
  max-height: 400px;
}

#article_image_slider .slider_link_top{
  margin-bottom: 20px;
}

#article_image_slider .slider_link_top a,
#article_image_slider .slider_link a{

    border: 1px #E8E8E8 solid;
    padding: 10px;
    font-weight: normal;
    font-size: 18px;
    text-decoration: none;
    margin: 10px;
}

#slideShowMain .galleryImage img {
  max-width: 620px;
  background: #fff;
  display: block;
  margin: 0 auto;
}

#slideShowMain .galleryImage .media-prev, #slideShowMain .galleryImage .media-next, #slideShowMain .galleryImage .media-more {
  position: absolute;
  top: 0;
  width: 50%;
  height: 100%;
  cursor: pointer;
  display: block;
  z-index: 100;
}

#slideShowMain .galleryImage .media-prev .media-prev-item, #slideShowMain .galleryImage .media-next .media-prev-item, #slideShowMain .galleryImage .media-more .media-prev-item, #slideShowMain .galleryImage .media-prev .media-next-item, #slideShowMain .galleryImage .media-next .media-next-item, #slideShowMain .galleryImage .media-more .media-next-item {
  width: 90px;
  height: 90px;
  position: absolute;
  top: 39%;
  left: 0;
}

#slideShowMain .galleryImage .media-next .media-next-item, #slideShowMain .galleryImage .media-more .media-next-item {
  right: 0;
  left: auto;
}

#slideShowMain .galleryImage .media-next .media-next-item:hover, #slideShowMain .galleryImage .media-more .media-next-item:hover {
  background: url("/media/c/2012/images/icon/fdScrollerShadow4.png") no-repeat 13px -720px transparent !important;
}

#slideShowMain .galleryImage .media-prev .media-prev-item:hover {
  background: url("/media/c/2012/images/icon/fdScrollerShadow4.png") no-repeat -3px -720px transparent !important;
}

#slideShowMain .galleryImage a.mediaPrev, #slideShowMain .galleryImage a.mediaNext {
  background: url('/media/c/2012/images/icon/fdScrollerArrows3.png') no-repeat;
  float: left;
  height: 56px;
  width: 55px;
  margin-left: 10px;
  margin-top: 10px;
}

#slideShowMain .galleryImage a.mediaNext {
  background-position: -56px 0;
  float: right;
  margin-right: 10px;
}

#slideShowMain .galleryImage .media-prev {
  left: 0;
}

#slideShowMain .galleryImage .media-next, #slideShowMain .galleryImage .media-more {
  right: 0;
}

#scrollNav {
  float: left;
  margin: 0;
  /*width: 618px;*/
  width: 100%;
  padding: 15px 0;
  background-color: #666;
  color: #fff;

  /*background: none,-khtml-gradient(linear,left top,left bottom,from(#717175),to(#3c3c3e));
  background: none,-moz-linear-gradient(top,#717175 0,#3c3c3e 100%);
  background: none,-webkit-gradient(linear,left top,left bottom,color-stop(0,#717175),color-stop(100%,#3c3c3e));
  background: none,-webkit-linear-gradient(top,#717175 0,#3c3c3e 100%);
  background: none,-o-linear-gradient(top,#717175 0,#3c3c3e 100%);
  background: none,-ms-linear-gradient(top,#717175 0,#3c3c3e 100%);
  background: none,linear-gradient(top,#717175 0,#3c3c3e 100%);*/

  /*-webkit-box-shadow: 0 1px 0 #212122,0 1px 0 0 rgba(255,255,255,0.4) inset;
  -moz-box-shadow: 0 1px 0 #212122,0 1px 0 0 rgba(255,255,255,0.4) inset;
  box-shadow: 0 1px 0 #212122,0 1px 0 0 rgba(255,255,255,0.4) inset;
  -moz-text-shadow: 0 -1px 0 rgba(0,0,0,0.8);
  -webkit-text-shadow: 0 -1px 0 rgba(0,0,0,0.8);
  -khtml-text-shadow: 0 -1px 0 rgba(0,0,0,0.8);
  text-shadow: 0 -1px 0 rgba(0,0,0,0.8);*/
}


.scrollingArrows span {
  cursor: pointer;
  display: block;
  float: left;
  height: 33px;
  text-indent: -9999px;
  width: 22px;
  margin: 4px 6px;
  _margin: 4px 3px;
  background: url("/media/c/2012/images/icon/icon-sprite.png") no-repeat;
}

.scrollingArrows .previous {
  background-position: 0 -405px;
  margin: 17px 20px 4px 20px;
}

.scrollingArrows .next {
  background-position: 0 -451px;
  float: right;
  margin: 17px 20px 4px 20px;
}

#thumbContainer {
  overflow: hidden;
  height: 58px;
  padding: 5px 0;
}

#thumbHousing {
  _white-space: nowrap;
  height: 62px;
}

.thum {
  float: left;
  padding: 0 20px 0 0;
  /*text-align: center;*/
  list-style: none !important;
}

.thum.fixed {
  width: 70px;
  height: 53px;
  margin: 4px 0 0 0;
  padding: 5px;
  overflow: hidden;
}

.thum.currentSlide {
  border-color: #87bfd6;
}

.thum.fixed.currentSlide {
  background: url("/media/c/2012/images/icon/currentSlide.png") no-repeat;
}

.block_story .thum a img, .block_story .thum a:hover img {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
}

#galleryCaption {
  background-color: #eee;
  border: solid #aaa 1px;
/ / float: left;
/ width: 618 px;
  */ width: 100%;
  padding: 10px;
}

#galleryCaption p {
  /*margin: 7px;*/
  font-size: 80%;
  text-align: left;
}

#galleryCaption .credit {
  #float: left;
  padding-right: 5px;
  margin-top: 0px;
  color: #768696;
  font-size: 0.7em;
  text-align: right;
}


/*フォトレポート*/
.right-photorepo-block {
}

.photorepo-inner {
  width: 270px;
  margin: 15px auto;
}

.photorepo-inner li {
  margin-bottom: 20px;
}

.photorepo-inner img {
  text-align: center;
  margin: 0 auto 3px;
  /*width:270px;*/
}

.photorepo-inner .photorepo-text {
  display: block;
  font-size: 14px;
}

/*フォトレポート end*/


/* -----------------------------------------------------------------------
  id info page
--------------------------------------------------------------------------*/

#id-inner {

}

.cnet_id_guide {
  max-width: 870px;
  margin: 30px auto;
}

h2.t_category {
  background: #151515;
  border-radius: 0px;
  margin: 30px auto;
  padding: 20px;
  border: none;
  font-size: 160%;
  font-weight: normal;
  box-shadow: none;
  text-shadow: none;
}

.cnet_id_guide .btn {
  display: block;
  padding: 25px 0;
  margin-bottom: 0;
  font-weight: bold;
  font-size: 120%;
  line-height: 20px;
  color: #333333;
  text-align: center;
  /*text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);*/
  vertical-align: middle;
  cursor: pointer;
  background-color: #f5f5f5;
  /*background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6));
  background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
  background-image: -o-linear-gradient(top, #ffffff, #e6e6e6);
  background-image: linear-gradient(to bottom, #ffffff, #e6e6e6);
  background-repeat: repeat-x;
  border: 1px solid #cccccc;
  border-color: #e6e6e6 #e6e6e6 #bfbfbf;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  border-bottom-color: #b3b3b3;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe6e6e6', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
  -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);*/
}

.cnet_id_guide .btn-red {
  color: #ffffff;
  /*text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);*/
  background-color: #aa1801;
  border: 1px solid #aa1801;
  /*background-color: #da4f49;
  background-image: -moz-linear-gradient(top, #ee5f5b, #bd362f);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ee5f5b), to(#bd362f));
  background-image: -webkit-linear-gradient(top, #ee5f5b, #bd362f);
  background-image: -o-linear-gradient(top, #ee5f5b, #bd362f);
  background-image: linear-gradient(to bottom, #ee5f5b, #bd362f);
  background-repeat: repeat-x;
  border-color: #bd362f #bd362f #802420;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffee5f5b', endColorstr='#ffbd362f', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);*/
}

.cnet_id_guide .btn-red:hover {
  background-color: #fff;
  border: 1px solid #ccc;
}

.cnet_id_guide .nav_point {
  display: -webkit-flex;
  display: -ms-flex;
  display: flex;
  background-color: #f5f5f5;
  padding: 15px 0;
  margin: 10px 0 25px 0;
}

.cnet_id_guide .nav_point li {
  display: -webkit-flex;
  display: -ms-flex;
  display: flex;
  -webkit-align-items: center;
  -ms-align-items: center;
  align-items: center;
}

.cnet_id_guide .nav_point a {
  font-size: 100%;
}

.cnet_id_guide .nav_point img {
  max-width: 80%;
}


.cnet_id_guide .box_point {
  margin: 10px 0;
  padding: 10px 0;
  border-top: 1px solid #cccccc;
}

.cnet_id_guide .box_point h3 {
  font-size: 120%;
}

.cnet_id_guide .box_point h4 {
  margin: 10px 0;
}

.cnet_id_guide .box_mail_lineup {
  margin: 15px 0;
}

.cnet_id_guide .viewmore, .cnet_id_guide .viewmore_close {
  float: none;
  background-image: none;
  background-color: #efefef;
  padding: 5px 10px;
  cursor: pointer;
}

.cnet_id_guide .viewmore_close::before {
  content: "- 　";
  color: rgb(255, 180, 0);
  font-weight: bold;
}

.mail_lineup {
  margin: 10px 0 0 30px;
}


.cnet_id_guide .area_cnetpoint {
  margin: 25px 0;
}

.cnet_id_guide dt {
  margin-bottom: 5px;
  padding: 10px;
  background-color: #efefef;
  font-size: 110%;
  color: #aa1801;
}

.cnet_id_guide dd {
  margin-bottom: 20px;
  padding: 5px;
}


/*newsletter*/
.block_nlinfo .header {
  margin: 15px auto;
  width: 100%;
  overflow: hidden;
}

.block_nlinfo .header h1 {
  width: 270px;
  height: 87px;
  text-indent: -9999px;
  background: url(/media/c/2012/images/bg/icon_nl.png) no-repeat;
  float: left;
}

.block_nlinfo .header h2 {
  width: 376px;
  height: 87px;
  text-indent: -9999px;
  background: url(/media/2007/info/newsletter/cnet_nl_headline.gif) no-repeat;
  float: left;
}


.block_nlinfo .sample pre {
  width: 90%;
  height: 450px;
  margin: 10px auto;
  padding: 10px;
  font-size: 13px;
  background: #fafafa;
  border: #ccc 1px solid;
  overflow: scroll;
}

.block_nlinfo .block_content {
  clear: both;
}

.block_nlinfo h3 {
  border-bottom: 1px dotted #ccc;
  padding-bottom: 5px;
}

.block_nlinfo .block_content .sample {
  margin: 15px 0 0;
}

.block_nlinfo .regist {
  margin: 30px 0 0;
  text-align: center;
}

.block_nlinfo .regist p {
  margin: 0 0 10px;
  font-size: 14px;
  line-height: 120%;
}

.block_nlinfo .regist .inner {
  width: 100%;
  padding: 10px 0;
  /*background: #aa1801;*/
}

.block_nlinfo .regist .inner .button_wrap {
  /*width: 526px;*/
  margin: 0 auto;
  display:flex;
  justify-content:center;
}

.block_nlinfo .login_button a {
  width: 90%;
  margin:10px;
  padding:12px;
  /*text-indent: -9999px;*/
  /*background: url("/media/2007/info/newsletter/cnet_nl_loginbutton.gif") no-repeat;*/
  background-color:#e71d1d;
  color:#fff;
  display: block;
  border-radius:10px;
}

.block_nlinfo .login_button a:hover {
  /*background-position: 0px -35px;*/
opacity:0.7;
color:#fff !important;
}

.block_nlinfo .regist_button a {
  width: 90%;
  margin:10px;
  padding:12px;
  /*text-indent: -9999px;*/
  /*background: url("/media/2007/info/newsletter/cnet_nl_registbutton.gif") no-repeat;*/
  background-color:#e71d1d;
  color:#fff;
  display: block;
  border-radius:10px;
}

.block_nlinfo .regist_button a:hover {
  /*background-position: 0px -35px;*/
opacity:0.7;
color:#fff !important;
}



.block_nlinfo .headline {
  padding: 0 0 5px;
  border-bottom: 1px solid #999;
}

.block_nlinfo .other_nl .arrow {
  /*height: 73px;
  text-indent: -9999px;
  background: url(/media/2007/info/newsletter/arrow.gif) no-repeat center bottom;*/
  text-align:center;
  margin:20px auto;
}

.block_nlinfo .other_nl a.zdnet {
  width: 650px;
  height: 57px;
  text-indent: -9999px;
  margin: 1em auto 0;
  background: url(/media/2007/info/newsletter/zdnet_nl_banner.gif) no-repeat center center;
  display: block;

}

.block_nlinfo .news_list li a {
  padding-left: 20px;
}


/*feed*/
.feed_main p {
  letter-spacing: 0.05em;
  line-height: 1.5em;
  margin: 10px 0 15px 0;
}

.feed_main p.rss_note {
  font-size: 90%;
  background-color: #EDEDED;
  padding: 10px;
  margin: 30px 0 30px 0;
  overflow: hidden;
}

.feed_main .main_l_headline {
  margin-bottom: 15px;
}

.feed_main ul.feed_list {
  margin: 0 auto 20px;
}

.feed_main ul.feed_list li {
  display: block;
  width: 47.5%;
  float: left;
  padding: 5px;
  margin: 2px;
  background-color: #f8f8f8;
  border: 1px solid #8C0000;
}

.feed_main ul.feed_list li a img {
  padding-right: 5px;
}

.feed_main ul.feed_list li:hover {
  background-color: #e0e0e0;
  transition: 0.5s;
}


/*sitemap*/
.sitemap_page_wrap {
  margin: 15px 0;
  padding: 0;
  display: block;
  clear: both;
  width: 100%;
}

.sitemap_page_wrap .sitemap_page_left, .sitemap_page_wrap .sitemap_page_middle, .sitemap_page_wrap .sitemap_page_right {
  width: 30%;
  margin: 5px 0 0;
  padding: 0 0 0 10px;
  float: left;
}


.sitemap_page_wrap dl dt,
.sitemap_page_wrap dl dd {
  margin-bottom: 15px;
}


.sitemap_page_wrap dt a {
  color: #aa1801;
  font-size: 140%;
}

.sitemap_page_wrap dd {
  font-size: 100%;
  border-bottom: 1px dotted #999;
  display: block;
  padding-bottom: 3px;
}

.sitemap_page_wrap dl.contact dt {
  margin: 10px 0;
  background-color: #f5f5f5;
  padding: 15px;
  font-size: 140%;
}

.sitemap_page_wrap dl.contact dd {
  border-bottom: none;
}


/* -----------------------------------------------------------------------
 tieup page
--------------------------------------------------------------------------*/


#block_story, html > body .article_body {
  font-size: 18px !important;
  line-height: 1.6 !important;
}

.adspecial_type1 .frame_col_left #block_story p {
  font-size: 18px !important;
}


.adspecial_type1 .article_body .left, .adspecial_type1 .article_body .right, .adspecial_type1 .article_body .center {
  font-size: 14px !important;
  color: #505050;
}

.adspecial_type1 h5.adspecial {
  font-size: 14px !important;
}

.adspecial_type1 .block_right_info .info a .txt {
  font-size: 14px !important;
}

.adspecial_type1 .block_right_wp .wp a h6.title {
  font-size: 14px !important;
}

.adspecial_type1 .bottomwp h4 {
  font-size: 14px !important;
}


.adspecial_type1 .block_right_plink ul li a {
  transition: none !important;
}

/*transition delete*/


#ad_interestmatch {
  border: 1px solid #CCC;
  padding: 5px;
}


/* -----------------------------------------------------------------------
  production.css
--------------------------------------------------------------------------*/

#leaf-column .leaf-article-inner h5 {
  font-weight: bold;
  margin: 15px 0 5px 0;
  padding-bottom: 1px;
  padding-right: 6px;
  text-align: left;
  border-bottom: 1px solid #666666;
}

#leaf-column .leaf-article-inner h6 {
  font-size: 14px;
  margin: 15px 0 5px 0;
  font-weight: bold;
  line-height: 1.2em;
}

#leaf-column .leaf-article-inner .cornerfoot08 .title08 {
  font-size: 16px !important;
  margin-bottom: 10px;
}

#leaf-column .leaf-article-inner .cornerfoot08 p {
  font-size: 14px !important;
  margin-bottom: 10px;
}

#leaf-column .leaf-article-inner .cornerfoot08 a {
  color: #0b8ebf !important;
}

#leaf-column .leaf-article-inner .profile08 p {
  font-size: 14px !important;
  margin-bottom: 5px !important;
}

#leaf-column .leaf-article-inner .profile08 {
  min-height: 170px !important;
}

#leaf-column .leaf-article-inner .profile09 p {
  font-size: 14px !important;
  margin-bottom: 5px !important;
}

#leaf-column .leaf-article-inner .profile09 p.name {
  font-size: 18px !important;
  margin-bottom: 5px !important;
}

.profile09,
.profile10 {
  background-color: #F3F7F8;
  border: 1px solid #CCCCCC;
  clear: both;
  margin: 0 0 20px;
  padding: 10px;
  font-size: 12px;
  line-height: 1.5;
  overflow: hidden;
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -moz-box-shadow: inset 0px 0px 2px #ccc;
  -webkit-box-shadow: inset 0px 0px 2px #ccc;
  box-shadow: inset 0px 0px 2px #ccc;
}

.profile09 .authorarea {
  margin-bottom: 10px;
  border-bottom: 1px solid #cccccc;
  -moz-box-shadow: 0px 1px 0 #ffffff;
  -webkit-box-shadow: 0px 1px 0 #ffffff;
  box-shadow: 0px 1px 0 #ffffff;
}


.profile09 .name,
.profile10 .name {
  margin-bottom: 10px;
  font-size: 140%;
  font-weight: bold;
  width: 100% !important;
  float: none !important;
}

.profile09 .company,
.profile10 .company {
  margin-bottom: 5px;
}

.profile09 .position,
.profile10 .position {
  marign-bottom: 10px;
}

.profile09 dl,
.profile10 dl {
  clear: both;
  padding: 10px 0;
}

.profile09 dt,
.profile10 dt {
  margin-bottom: 5px;
  padding-left: 5px;
  font-size: 120%;
  border-left: 3px solid #cccccc;
}

.profile09 dd,
.profile10 dd {
  margin: 0 0 5px 8px;
  list-style: disc;
}

.profile09 .center,
.profile10 .center {
  text-align: center !important;
}

.profile09 .center img,
.profile10 .center img {
  margin: 0 5px 10px;
}

.profile09 table,
.profile10 table {
  width: 100%;
  clear: both;
  margin: 10px 0 !important;
  border: none !important;
  table-layout: fixed;
}

.profile09 td,
.profile10 td {
  margin: 0 5px !important;
  border: none !important;
  text-align: center !important;
}

.profile09 .left div,
.profile09 .right div,
.profile10 .left div,
.profile10 .right div {
  margin-bottom: 5px;
}

.profile10 {
  padding: 0;
  box-shadow: none;
  border: none;
}

.profile10 .authorarea {
  height: 130px;
  background-repeat: no-repeat !important;
  background-position: top right !important;
  background-size: cover !important;
}

.profile10 .authorarea img {
  position: relative;
  top: 15px;
  left: 5%;
  width: 150px;
  height: 150px;
  border-radius: 50%;
  border: 5px solid #ffffff;
}

.profile10 .profile_contents {
  margin-top: 60px;
  padding: 20px;
}


#leaf-column .leaf-article-inner table th {
  background: #808080;
  color: #FFFFFF !important;
  font-weight: bold;
  line-height: 1.2em;
  text-align: center;
  border: 1px solid #999999;
  padding: 5px;
  font-size: 12px !important;
}

#leaf-column .leaf-article-inner table td {
  border: 1px solid #999999;
  padding: 5px;
  font-size: 12px !important;
}

#leaf-column .leaf-article-inner pre {
  background: #E7F0F4;
  border: 1px solid #C7DAE2;
  font-size: 12px;
  line-height: 1.4em;
  margin: 0 auto 1em;
  overflow: scroll;
  padding: 5px;
  width: 460px;
}

#leaf-column .leaf-article-inner .company, #leaf-column .leaf-article-inner .position {
  font-size: 14px !important;
  margin-bottom: 10px;
}

#leaf-column .leaf-article-inner .profile10 .profile_contents p {
  font-size: 14px !important;
  margin-bottom: 10px;
}

.block_story .person1, .block_story .person2, .block_story .person3, .block_story .person4, .block_story .person5, .block_story .person6, .block_story .person7,
.block_story .person8, .block_story .person9, .block_story .person10, .block_story .person11, .block_story .person12, .block_story .person13, .block_story .person14 {
  border-left: 1px solid #b33030;
  color: #b33030;
  padding-left: 10px;
  font-weight: bold;
}

.block_story .person2 {
  border-left: 1px solid #306ab2;
  color: #306ab2;
}

.block_story .person3 {
  border-left: 1px solid #45b230;
  color: #45b230;
}

.block_story .person4 {
  border-left: 1px solid #D3671E;
  color: #D3671E;
}

.block_story .person5 {
  border-left: 1px solid #434CB3;
  color: #434CB3;
}

.block_story .person6 {
  border-left: 1px solid #449090;
  color: #449090;
}

.block_story .person7 {
  border-left: 1px solid #7b10ad;
  color: #7b10ad;
}

.block_story .person8 {
  border-left: 1px solid #ca285e;
  color: #ca285e;
}

.block_story .person9 {
  border-left: 1px solid #fe9700;
  color: #fe9700;
}

.block_story .person10 {
  border-left: 1px solid #8ac249;
  color: #8ac249;
}

.block_story .person11 {
  border-left: 1px solid #03a8f3;
  color: #03a8f3;
}

.block_story .person12 {
  border-left: 1px solid #785447;
  color: #785447;
}

.block_story .person13 {
  border-left: 1px solid #5f7c8a;
  color: #5f7c8a;
}

.block_story .person14 {
  border-left: 1px solid #9d9d9d;
  color: #9d9d9d;
}


#tieup_control_sp {
  display: none;
}


.column_rwweb .cornerfoot08,
.column_rwweb .cornerfoot08 .title08 {
  border-color: #ECE5D4;
}

.column_rwweb .cornerfoot08 {
  background: none repeat scroll 0 0 #FDF9F0;
}

.column_rwweb .cornerfoot08 span {
  background: url("/media/2006/rwweb/logo.gif") no-repeat scroll 0 0 transparent;
}


.column_rwweb .profile08,
.column_rwweb .profile08 .border08 {
  margin-top: 20px;
  border-color: #ECE5D4;
}

.column_rwweb .profile08 {
  background: url("/media/2006/rwweb/prof.jpg") no-repeat top right #FEFBF6;
}

.column_rwweb .profile08 h2.name08 {
  color: #7B0A00 !important;
}


.profile08 {
  background: none repeat scroll 0 0 #EEEEEE;
  border: 1px solid #CCCCCC;
  clear: both;
  display: block;
  height: auto;
  margin: 0 0 20px;
  min-height: 140px;
  padding: 0;
}

.profile08 .name08,
.profile08 .companyname08,
.profile08 .position08,
.profile08 p {
  background: none repeat scroll 0 0 transparent;
  border: medium none;
  clear: both;
  color: #333333 !important;
  display: block;
  font-size: 12px;
  font-weight: normal;
  line-height: 120%;
  margin: 0 0 5px;
  padding: 0 10px;
}

.profile08 .name08 {
  font-size: 14px;
  font-weight: bold;
  padding-top: 15px;
}

.profile08 .companyname08 {
  background: none repeat scroll 0 0 transparent;
  border: medium none;
  clear: both;
  color: #333333 !important;
  display: block;
  font-size: 12px;
  font-weight: normal;
  line-height: 120%;
  margin: 0 0 5px;
  padding: 0 10px;
}


/* -----------------------------------------------------------------------
  listings.css
--------------------------------------------------------------------------*/

.box_mail_lineup .viewmore::before, .box_mail_lineup .viewmore::after {
  display: none !important;
}


/* --------------------------------------------------------------------------------
  Old News List page Style
---------------------------------------------------------------------------------- */
ul.news_list_2011 li p.summary {
  font-size: 14px !important;
}

#marketers_header {
  background: #FFFFFF;
  background: -moz-linear-gradient(top, #FFFFFF, #FFFFFF);
  background: -ms-linear-gradient(top, #FFFFFF, #FFFFFF);
  background: -o-linear-gradient(top, #FFFFFF, #FFFFFF);
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FFFFFF), to(#FFFFFF));
  background: -webkit-linear-gradient(top, #FFFFFF, #FFFFFF);
  background: linear-gradient(top, #FFFFFF, #FFFFFF);
  box-shadow: 0 -6px 10px #FFFFFF inset;
  -moz-box-shadow: 0 -6px 10px #FFFFFF inset;
  -webkit-box-shadow: 0 -6px 10px #FFFFFF inset;
}

#rightside-column .right-digital-apple-block,
#rightside-column .right-digital-news-block {
  width: 300px;
  margin: auto;
}

.opinion_main .l_headline {
  padding-bottom: 5px;
}

.news-sub-story .column-4 {
  width: 275px;
}


/* -----------------------------------------------------------------------
 release event page
--------------------------------------------------------------------------*/

.content-list-date,
.event-date,
.relase-date {
  color: #aa1801;
  margin-bottom: 25px;
  padding-bottom: 5px;
  font-size: 110%;
  border-bottom: 1px dotted #aa1801;
}

.content-list h3,
.event-list h3,
.relase-list h3 {
  font-size: 110%;
  color: #303030;
}

.content-list li,
.event-list li,
.relase-list li {
  margin-bottom: 20px;
  padding-bottom: 5px;
  border-bottom: 1px dotted #ccc;
}

.content-list p,
.event-list p,
.relase-list p {
  color: #505050;
  word-break: break-all;
}

.event-alert {
  color: #aa1801 !important
}


/* -----------------------------------------------------------------------
 marketers page
--------------------------------------------------------------------------*/


.content-marketers-inner {
  border-top: 5px solid #662d91;
  border-bottom: 2px solid #662d91;
  padding: 3% 0 10% 0;
  width: 100%;
  position: relative;
  /*overflow:hidden;*/
}

.content-marketers-inner:before {
  content: "";
  position: absolute;
  border-top: solid 5px #a642b4;
  top: -5px;
  width: 35%;
}


.content-marketers-inner img {
  float: left;
  margin-right: 10px;
}

.content-marketers-inner p {
  font-size: 120%;
  line-height: 1.4;
}


/* -----------------------------------------------------------------------
 sp page
--------------------------------------------------------------------------*/


.content-sp-inner {
  background-color: #efefef;
  width: 96%;
  padding: 2%;
  overflow: hidden;
}


.content-sp-inner h3 {
  font-size: 140%;
  margin-bottom: 10px;
}

.content-sp-inner img {
  float: left;
  margin-right: 10px;
  margin-bottom: 10px;
  max-width: 184px;
}

.content-sp-inner p {

}

.sp-inner-new {
  background-color: #303030;
  border-radius: 4px;
}

.sp-inner-new h3,
.sp-inner-new p {
  color: #fff;
}


.sp-relation {
  background-color: #fff;
  clear: both;
  margin-top: 20px;
  padding: 10px;
}

.sp-relation li {
  border-bottom: 1px dotted #aaa;
  margin-bottom: 5px;
  padding: 0 0 3px 20px;
}


.content-sp-list {
  margin: 30px auto;
  width: 100%;
}


/* -----------------------------------------------------------------------
 opinion page
--------------------------------------------------------------------------*/


.content-inner ul {
}

.content-inner li {
  margin: 0 0 20px 0;
}


.content-inner li h3 {
  position: relative;
  /*padding-left:20px;*/
}

.content-inner .block_detail { /*padding-left:20px;*/
}

.content-inner .block_detail span.date {
  display: block;
}


/*blog*/

.content-inner .box-blogger {
  overflow: hidden;
}

.content-inner .box-blogger li {
  float: left;
  width: 50%;
  border-bottom: 1px dotted #999;
  padding-bottom: 3px;
}

.content-inner .box-blogger li img {
  float: left;
  margin-right: 5px;
}

#blog_profile_title {
  overflow: hidden;
}

.content-inner .panel_top_fukidashi {
  border: 1px solid #ccc;
  padding: 1%;
  width: 97.5%;
}


.content-inner .panel_top_fukidashi img {
  float: left;
  dispplay: block;
  margin-right: 10px;
}

.more-s a {
  float: right;
  display: block;
  position: relative;
}

.more-s a::after {
  content: "";
  position: absolute;
  top: 20px;
  left: -15px;
  width: 4px;
  height: 4px;
  border-top: 1px solid #aa1801;
  border-right: 1px solid #aa1801;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}


.blogger-profile {
  border: 1px solid #ccc;
  margin: 0 auto 20px;
  padding: 15px;
}


.blogger-profile > div {
  margin-left: 10%;
}

.blogger-profile img {
  float: left;
}


.blogger-profile .panelist_name {
  font-size: 120%;
  font-weight: bold;
  background-color: #f0f0f0;
  margin: 0 0 10px 0;
  padding: 10px;
}

#latest_blogposts dt {
  margin: 15px 0;
  padding: 10px;
  font-size: 120%;
  background-color: #f0f0f0;
}


dd#blogpost_list ul li {
  padding-left: 20px;
}


/*blog leaf*/

.author_blogname_date {
  font-size: 85%;
  margin: 15px 0;
}

.leaf-headline-ttl {
  font-size: 180%;
  line-height: 1.2;
  margin-bottom: 15px;
}


.leaf-blog-inner p {
  margin-bottom: 20px;
  font-size: 18px;
  color: #252525;
  line-height: 1.6;
  letter-spacing: 0.08em;
}

.leaf-blog-inner p a {
  word-wrap: break-word;
}

.leaf-blog-inner img {
  text-align: center;
  margin: 0 auto;
  display: block;
}

.leaf-blog-inner li h3 {
  padding-left: 0;
}


/*panel*/


.panel_question a {
  padding-left: 20px;
}

.panelist_name {
  font-size: 120%;
  font-weight: bold;
  background-color: #f0f0f0;
  margin: 0 0 10px 70px;
  padding: 10px;
}

.panel_top_list {
  margin-bottom: 25px;
}

.panel_top_list li {
  margin: 15px 0;
  padding: 15px;
  overflow: hidden;
}


.panel_question {
  font-size: 110%;
  padding: 0 15px;
  background-color: #f0f0f0;
}

.panel_question .more a {
  float: right;
  padding: 10px;
  background-color: #d0d0d0;
}


.panelist_fukidashi {
  padding: 15px;
}

.panelist_fukidashi .date {
  font-size: 80%;
  color: #999;
}


.paneler h3 {
  font-size: 130%;
  margin: 10px 0;
  padding-left: 0;
  color: #aa1801;
}

.paneler img {
  float: left;
  width: 60px;
}

.paneler > div {
  margin-left: 80px;
}

.paneler .paneler-name {
  font-size: 110%;
  font-weight: bold;
}


.paneler .date {
  color: #999;
}

.panel-more {
  float: right;
  overflow: hidden;
  padding-left: 20px;
}


/*panel leaf*/


.panel_relationlink {
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  margin-bottom: 25px;
  padding: 10px 0;
}

.panel_relationlink_ttl {
  font-size: 120%;
  background-color: #f0f0f0;
  margin-bottom: 10px;
  padding: 10px;
  display: inline-block;
}

.panel_relationlink ul li {
  position: relative;
  padding-left: 20px;
}

.panel_relationlink ul li::after {
  content: "";
  position: absolute;
  top: 8px;
  left: 5px;
  width: 4px;
  height: 4px;
  border-top: 1px solid #aa1801;
  border-right: 1px solid #aa1801;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.paneler-block {
  margin-bottom: 15px;
  border: 1px solid #ccc;
  width: 100%;
}

.paneler-box {
  margin: 15px;
  background-color: #f0f0f0;
  overflow: hidden;
}

.paneler-box > div {
  padding: 15px;
}

.paneler-box img {
  float: left;
  padding: 10px;
}

.paneler-box .paneler-name {
  font-size: 120%;
  font-weight: bold;
  margin-bottom: 10px;
}

.paneler-box .more a {
  padding-left: 20px;
}

.paneler-box .date a {
  color: #999;
}

.panel_bottom_navi a {
  margin: 10px 20px 20px 0;
  padding-left: 20px;
  display: inline-block;
  position: relative;
}

.panel_bottom_navi a::after {
  content: "";
  position: absolute;
  top: 8px;
  left: 5px;
  width: 4px;
  height: 4px;
  border-top: 1px solid #aa1801;
  border-right: 1px solid #aa1801;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}


.container .container-fluid {
  padding: 20px;
  margin: 0;
  background-color: #f4f4f4;
}


.container-fluid h3 {
  font-size: 180%;
  text-align: center;
  border-bottom: 1px solid #999;
  padding-bottom: 10px;
line-height:1.6;/*2行になった時の行間 202501*/
}


.dialog_inner {
  background: #fff;
  padding: 5px;
  border: 2px solid #c6c6c6;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -moz-box-shadow: 0 0 15px #bbb;
  -webkit-box-shadow: 0 0 15px #bbb;
  box-shadow: 0 0 15px #bbb;
  height: 1000px;
}


.span3 {
  width: 80%;
  overflow: hidden;
  margin: 30px auto;
  clear: both;
}

.span3 h4 {
  font-size: 140%;
  text-align: center;
  padding: 20px 0;
}

.sns_link {
  margin: 0 0 10px 0;
}

.sns_link a {
  width: 25%;
  margin: 0 auto;
  padding: 10px 0;
  display: block;
}

.span3 .sns_link img {
  float: left;
  margin: 5px;
}


.span3 h5 {
  float: left;
  clear: both;
  margin-right: 5px;
  width: 15%;
}

.span3 form input {
  border: 1px solid #ccc;
  border-radius: 5px;
  padding: 2% 4%;
  width: 91%;
  margin-bottom: 25px;
  font-size: 120%;
}


.span3 button, .btn {
  clear: both;
  background-color: #e5e5e5;
  border-radius: 10px;
  padding: 20px;
  width: 100%;
  text-align: center;
  font-size: 120%;
}

.span3 p {
  text-align: left;
  margin: 10px 0 0 0;
}


/*digital*/


.content-digital-inner {
  background-color: #efefef;
  width: 96%;
  margin: 2% 0;
  padding: 2%;
  overflow: hidden;
}

.content-digital-inner img {
  float: left;
}


.content-digital-inner p, .content-digital-inner dl {
  margin-left: 20%;
}

.content-digital-inner .prod_com {
  font-size: 120%;
  margin-bottom: 5px;
}

.content-digital-inner .prod_name {
  font-size: 180%;
  font-weight: bold;
  margin-bottom: 5px;
}

.shop_ad {
  margin-bottom: 5%;
  overflow: hidden;
}

.review-box {
  border: 1px solid #ccc;
  padding: 3%;
  line-height: 1.8;
  font-size: 110%;
}

.review-box .review-date {
  color: #999;
}


.content-search-inner {
  width: 100%;
}

.search-ttl {
  font-size: 120%;
  font-weight: bold;
  margin-bottom: 10px;
}

.search-box {
  background-color: #EEE;
  border: 1px solid #CCC;
  padding: 3%;
  margin-bottom: 20px;
}

.case-box {
  float: left;
  border: 1px solid #CCC;
  padding: 10px;
  margin: 0 10px 10px 0 !important;
  width: 20%;
  height: 250px;
  overflow: hidden;
}

.case-box img {
  text-align: center;
  margin: 0 auto;
  display: block;
}

.case-box .case-maker {
  font-size: 120%;
  color: #151515;
  margin: 10px 0 0 0;
}

.case-box .case-name {
  font-size: 80%;
  color: #666;
  margin: 10px 0 0 0;
  line-height: 1.2;
}

.case-box .case-release {
  font-size: 80%;
  color: #aaa;
}


/*stream*/

.header_stream {
  width: 98%;
  margin-bottom: 15px;
  padding: 1%;
  background-color: #f0f0f0;
}


.header_stream .left_area {
  float: left;
  width: 77%;
}

.header_stream .left_area img, .header_stream .left_area p {
  float: left;
  padding-right: 10px;
}

.header_stream .left_area a {
  display: block;
  float: left;
  margin-right: 5px;
}

.header_stream .tumnb a {
  float: left;
  margin-right: 10px;
}


.header_stream .link_fb,
.header_stream .link_twitter {
  color: #fff;
  font-weight: bold;
  width: 30%;
  padding: 0.5%;
  text-align: center;
}

.header_stream .img-top {
}

.header_stream .img-top img {
  padding: 0 3px;
  float: left;
}


.link_fb {
  background-color: #2f5195;
}

.link_twitter {
  background-color: #009ece;
}


.list_streamnews .icon-tags {
  background-color: #eee;
  color: #454545;
  padding: 2%;
  font-weight: bold;
}

.list_streamnews p {
  font-size: 100%;
}

.list_streamnews img {
  max-width: 100%;
  margin: 15px auto;
  tect-align: center;
  display: block;
}

.galleryImage img {
  max-width: 100% !important;
}


/* -----------------------------------------------------------------------
 app review page
--------------------------------------------------------------------------*/
.app_info_temp,
.app_info_area {
  margin: 20px 0;
  padding: 15px 20px;
  letter-spacing: 0.05em;
  line-height: 1.5em;
  border-radius: 10px;
  background-color: #f8f8f8;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border: 1px solid #dddddd;
  /*filter: progid:DXImageTransform.Microsoft.Gradient(Enabled=1,GradientType=0,StartColorStr=#ffffff,EndColorStr=#eeeeee);
  background: -moz-linear-gradient(top, #ffffff, #ffffff 80%, #eeeeee);
  background: -webkit-gradient(linear, left top, left bottom, from(#ffffff),color-stop(0.80,#ffffff),to(#eeeeee));*/
  -moz-box-shadow: 0px 0px 6px #ccc;
  -webkit-box-shadow: 0px 0px 6px #ccc;
  position: relative;
  overflow: hidden;
}

.app_info_area dt {
  line-height: 1.5;
}

.app_info_area dd {
  font-size: 85%;
  font-weight: bold;
}

.app_info_area dd.profile {
  font-size: 85%;
  font-weight: normal;
}

.app_info_area .app_review {
  width: 75px;
  height: 16px;
  margin: 3px 0 0;
!important;
  background: url(/media/c/2012/images/app/app_review_star.gif) repeat-x bottom left;
}

.app_info_area .app_review .star0_5,
.app_info_area .app_review .star1,
.app_info_area .app_review .star1_5,
.app_info_area .app_review .star2,
.app_info_area .app_review .star2_5,
.app_info_area .app_review .star3,
.app_info_area .app_review .star3_5,
.app_info_area .app_review .star4,
.app_info_area .app_review .star4_5,
.app_info_area .app_review .star5 {
  display: block;
  height: 16px;
  background: url(/media/c/2012/images/app/app_review_star.gif) repeat-x top left;
  text-indent: -9999px;
}

.app_info_area .app_review .star0_5 {
  width: 8px;
}

.app_info_area .app_review .star1 {
  width: 15px;
}

.app_info_area .app_review .star1_5 {
  width: 22px;
}

.app_info_area .app_review .star2 {
  width: 30px;
}

.app_info_area .app_review .star2_5 {
  width: 37px;
}

.app_info_area .app_review .star3 {
  width: 45px;
}

.app_info_area .app_review .star3_5 {
  width: 52px;
}

.app_info_area .app_review .star4 {
  width: 60px;
}

.app_info_area .app_review .star4_5 {
  width: 67px;
}

.app_info_area .app_review .star5 {
  width: 75px;
}

.app_info_area ul {
  clear: both;
  padding-top: 10px;
}

.app_info_area li {
  display: inline;
  white-space: nowrap;
  margin-left: 0 !important;
  list-style: none !important;
  font-size: 85%;
}

.app_info_area li span {
  font-weight: bold;
}

.app_info_area .download_btn {
  position: absolute;
  top: 20px;
  right: 20px;
  float: right;

}

.app_info_area .download_btn img {
  border-bottom: none !important;
}

.app_rank_tab_on {
  font-weight: bold;
}

.app_rank_tab {
  cursor: pointer;
}


/* -----------------------------------------------------------------------
 cnet id member etc page
--------------------------------------------------------------------------*/


/*メンバーログインポップアップ*/
#profile_form {
  width: 80%;
  overflow: hidden;
  margin: 30px auto;
  clear: both;
}


#profile_form form {
  margin-top: 20px;
}

.member fieldset dl {
  width: 100%;
  margin: 0 auto;
}

.member fieldset dt,
.member fieldset dd {
  clear: both;
}


.member fieldset.login dd input {
  width: 92%;
  padding: 2% 4%;
  /*height:20px;*/
  border-radius: 5px;
  font-size: 120%;
  border: 1px solid #ccc;
}

.member fieldset button.long {
  width: 100%;
  height: 70px;
  text-align: center;
  /*background: url(/media/2006/member/button.gif) repeat-x scroll right top transparent;*/
  background-color: #e5e5e5;
  border: 1px solid #B0B0B0;
  color: #333333;
  font-size: 14px;
  font-weight: bold;
  /*height: 35px;
  line-height: 35px;*/
  margin: 15px auto;
  padding: 20px 0;
  border-radius: 5px;
  font-size: 120%;
  cursor: pointer;
}


.member fieldset.join .regist {
  display: block;
  width: 100%;
  padding: 20px 0;
  text-align: center;
  color: #fff;
  background-color: #aa1801;
  border-radius: 5px;
  font-size: 120%;
}

.container-fluid form {
  margin: 20px 0;
}


#profile_form h4 {
  font-size: 140%;
  text-align: center;
  padding: 20px 0;
}

#profile_form h5 {
  float: left;
  clear: both;
  margin: 10px 5px 5px 10px;
  /*width: 40%;*/
}

#profile_form .passwordcaution {
  float: left;
  clear: both;
  margin: 10px 5px 5px 10px;
}

#profile_form form input,
#profile_form input[type=text],
#profile_form input[type=password],
#profile_form input[type=textarea],
#profile_form select {
  border: 1px solid #ccc;
  border-radius: 5px;
  padding: 2% 4%;
  width: 50%;
  margin-bottom: 10px;
  font-size: 120%;
}
#profile_form input[type=text],
#profile_form input[type=password]{/*長さ調整 202501*/
  width: 80%;
}


#profile_form input.arrow-next { /*次へボタン*/
  border: none !important;
  width: 150px;
  height: 44px;
  margin: 10px auto;
}

#profile_form input#field_contract_agree {
  width: auto;
}


#profile_form .error {
  color: #ff0000;
  margin-bottom: 15px;
}

#profile_form button,
#profile_form .btn,
#profile_form a.btn {
  clear: both;
  background-color: #e5e5e5;
  border-radius: 5px;
  margin: 0 auto;
  padding: 25px;
  /*width:100%;*/
  width: 50%;
  text-align: center;
  font-size: 120%;
  border: 1px solid #999;
  display: block;
}


#profile_form a.btn {
  display: block;
  padding: 10% 0;
  width: 100%;
  margin: 15px auto;
  /*box-shadow:0 0 10px #666;*/
  background-color: #aa1801;
  color: #fff;
  font-size: 160%;
}

#profile_form p {
  text-align: left;
  margin: 10px 10px 0;
}


#profile_form .form_table {
  background-color: #f4f4f4;
}


#profile_form .form_table th {
  width: 30%;
  padding: 15px;
  background-color: #e0e0e0;
  border-bottom: 1px solid #ccc;
}

#profile_form .form_table td {
  background-color #eee;
  padding: 15px;
  border-bottom: 1px solid #ccc;
}


.row-fluid {
  margin: 0 auto;
  overflow: hidden;
}

.row-fluid h2 {
  font-size: 180%;
  text-align: center;
  margin-bottom: 15px;
}

.btn-red {
  background-color: #aa1801 !important;
  color: #fff !important;
  border: none;
}


/*ログイン*/

.id-login-box {
  width: 100%;
  max-width: 100%;
}

.id-login-headline {
  margin: 25px 0;
  width: 100%;
}

.id-login-summary {
  background-color: #f4f4f4;
  border: 2px solid #ccc;
  border-radius: 8px;
  margin-bottom: 15px;
  padding: 20px;
  font-size: 120%;
}

.id-menber-box {
  width: 100%;
}

.id-login-left, .id-login-right {
  border: 8px solid #ccc;
  padding: 20px;
  width: 45%;
  height: 350px;
}

.id-login-left {
  float: left;
}

.id-login-right {
  float: right;
}

legend {
  margin: 0 auto;
  padding: 0 15px;
  font-size: 140%;
  font-weight: bold;
}


.id-login-right .login dd input {
  width: 90%;
}


.id-menber-box dt, .id-menber-box dd {
  margin: 10px 0;
  line-height: 1.4;
}

.id-menber-box dd.regist {
  text-align: center;
  margin: 0 auto 10px;
}


.id-menber-box button {
  /*background: url(/media/2006/member/button.gif) repeat-x scroll right top transparent;*/
  background-color: #e5e5e5;
  border: 1px solid #B0B0B0;
  color: #333333;
  font-size: 14px;
  font-weight: bold;
  height: 35px;
  line-height: 35px;
  margin: 10px 0 3px;
  padding: 0 40px 2px;
}


.id-menber-box button.regist {
  color: #FFF;
  background: #8c0000 url(/media/c/2010/image/bg/button2.gif) repeat-x scroll right top;
  //width: 220px;
  height: 40px;
  font-size: 16px;
  border: none;
  border: 1px solid;
  line-height: 1em;
  padding: 0 10px;
}


.btn-id-regist {
  width: 50%;
  margin: 0 auto;
  text-align: center;
  background-color: #aa1801;
  padding: 3%;
  color: #fff;
  display: block;
  font-size: 180%;
  font-weight: bold;
  border-radius: 10px;
}


.btn-id-regist:hover {
  opacity: 0.8;
}


.id-menber-box input {
  border: 1px solid #ccc;
  border-radius: 5px;
  padding: 2% 4%;
  width: 91%;
  margin-bottom: 10px;
  font-size: 120%;
}


/*登録画面*/
.sitemap_page_wrap > #profile_form {
  width: 100%;
}

.sitemap_page_wrap h4 {
  font-size: 140%;
  background-color: #f4f4f4;
  margin: 30px 0 10px;
  padding: 20px;
  text-align: center;
}

.sitemap_page_wrap .resister_flow {
  background-color: #f4f4f4;
  padding: 2%;
  overflow: hidden;
}

.sitemap_page_wrap .resister_flow li {
  float: left;
  width: 11%;
  position: relative;
  margin-right: 10px;
  padding: 5px 10px;
  text-align: center;
}

.sitemap_page_wrap .resister_flow li::after {
  content: "";
  position: absolute;
  top: 13px;
  left: 2px;
  width: 6px;
  height: 6px;
  border-top: 1px solid #aa1801;
  border-right: 1px solid #aa1801;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.sitemap_page_wrap .resister_flow li.on {
  font-weight: bold;
  background-color: #d55201;
  border-radius: 3px;
  color: #fff;
}

.sitemap_page_wrap .resister_flow li.on::after {
  border-top: 1px solid #fff;
  border-right: 1px solid #fff;
}


.sitemap_page_wrap .form_table {
  width: 100%;
}

.form_table .req, .error {
  color: #ff0000;
}

.sitemap_page_wrap .private_info p {
  text-align: left !important;
}

.sitemap_page_wrap > #profile_form h5,
.private_info h5 {
  float: none !important;
  width: 100% !important;
}

.sitemap_page_wrap > #profile_form input.btn_next,
.member > #profile_form input.btn_next,
input.btn_next {
  /*width:25% !important;*/
  width: 150px !important;
  border: none !important;
}


.sitemap_page_wrap > #profile_form input.btn_back,
.member > #profile_form input.btn_back,
input.btn_back {
  /*width:25% !important;*/
  width: 150px !important;
  border: none !important;
}

.member .contract pre {
  border: 1px solid #CCCCCC;
  font-size: 100%;
  height: 160px;
  overflow: scroll;
  padding: 1.5%;
  margin: 10px auto;
  max-width: 96% !important;
  width: 96% !important;
  overflow: auto !important;
}


/*マイページ*/


#mypage_top h2, #mypage_sub h2 {
  text-align: center;
  margin: 20px auto 15px;
  padding: 15px;
  background-color: #333;
  color: #fff;
  clear: both;
}

.account {
  padding: 15px;
}

.account p {
  margin: 0 0 10px 0;
}

/*.account dl{
margin:0 0 20px 0;
padding:2% 5%;
width:90% !important;
}*/


.account input {
  border: 1px solid #ccc;
  border-radius: 5px;
  padding: 2% 4%;
  width: 95%;
  margin-bottom: 25px;
  font-size: 120%;
}

.account textarea {
  padding: 2% 4%;
  width: 95%;
}


.button_regist {
  margin: 25px auto;
  text-align: center;
}


.button_regist button {
  clear: both;
  background-color: #e5e5e5;
  border-radius: 10px;
  margin: 0 auto;
  padding: 20px;
  /*width:100%;*/
  width: 50%;
  text-align: center;
  font-size: 120%;
}


.sub_nav {
  /*height: 75px;*/
  height: 101px;
  margin-bottom: 20px;
  border-bottom: 1px solid #cccccc;
  width: 100%;
  clear: both;
}

.sub_nav li {
  float: left;
  width: 105px;
  /* height: 75px; */
  height: 102px;
  margin-right: 5px;
  padding: 0;
}


/*.sub_nav li{
text-align:center;
background-color:#e5e5e5;
margin:5px auto;
padding:5px;
}*/

.sub_nav {
  /*height: 75px;*/
  height: 101px;
  margin-bottom: 20px;
  border-bottom: 1px solid #cccccc;
}

.sub_nav li {
  float: left;
  width: 105px;
  /*height: 75px;*/
  height: 102px;
  margin: 0 5px 0 0 !important;
  padding: 0;
}

.sub_nav li a {
  display: block;
  width: 105px;
  /*height: 74px;*/
  /*text-indent: -9999px;*/
  border: 1px solid #cccccc;
  border-bottom: none;
  -moz-border-radius: 5px 5px 0 0;
  -webkit-border-radius: 5px 5px 0 0;
  border-radius: 5px 5px 0 0;
  padding-top: 80px;
  font-size: 12px;
  text-align: center;
}

.sub_nav li.home a {
  background: #efefef url(/media/c/2012/images/membership/icon_home_s_off.png) no-repeat center top;
}

.sub_nav li.setting a {
  background: #efefef url(/media/c/2012/images/membership/icon_setting_s_off.png) no-repeat center top;
}

.sub_nav li.wp a {
  background: #efefef url(/media/2014/cnet/membership/icon_wp_s_off.png) no-repeat center top;
}

.sub_nav li.mail a {
  background: #efefef url(/media/c/2012/images/membership/icon_mail_s_off.png) no-repeat center top;
}

.sub_nav li.event a {
  background: #efefef url(/media/c/2012/images/membership/icon_event_s_off.png) no-repeat center top;
}

.sub_nav li.atode a {
  background: #efefef url(/media/2014/cnet/membership/icon_atode_s_off.png) no-repeat center top;
}

.sub_nav li.poll a {
  background: #efefef url(/media/c/2012/images/membership/icon_poll_s_off.png) no-repeat center top;
}

.sub_nav li.docchi a {
  background: #efefef url(/media/2014/cnet/membership/icon_docchi_s_off.png) no-repeat center top;
  margin-bottom: 0;
}

.sub_nav li.serial a {
  background: #efefef url(/media/2014/cnet/membership/icon_serial_s_off.png) no-repeat center top;
  margin-bottom: 0;
}

.sub_nav li.home a:hover, .sub_nav li.home a.on,
.sub_nav li.setting a:hover, .sub_nav li.setting a.on,
.sub_nav li.wp a:hover, .sub_nav li.wp a.on,
.sub_nav li.mail a:hover, .sub_nav li.mail a.on,
.sub_nav li.event a:hover, .sub_nav li.event a.on,
.sub_nav li.atode a:hover, .sub_nav li.atode a.on,
.sub_nav li.poll a:hover, .sub_nav li.poll a.on,
.sub_nav li.docchi a:hover, .sub_nav li.docchi a.on,
.sub_nav li.serial a:hover, .sub_nav li.serial a.on {
  /*height: 75px;*/
  background-color: #ffffff;
}

.sub_nav li.home a:hover, .sub_nav li.home a.on {
  background: #ffffff url(/media/c/2012/images/membership/icon_home_s.png) no-repeat center top;
}

.sub_nav li.setting a:hover, .sub_nav li.setting a.on {
  background: #ffffff url(/media/c/2012/images/membership/icon_setting_s.png) no-repeat center top;
}

.sub_nav li.wp a:hover, .sub_nav li.wp a.on {
  background: #ffffff url(/media/2014/cnet/membership/icon_wp_s.png) no-repeat center top;
}

.sub_nav li.mail a:hover, .sub_nav li.mail a.on {
  background: #ffffff url(/media/c/2012/images/membership/icon_mail_s.png) no-repeat center top;
}

.sub_nav li.event a:hover, .sub_nav li.event a.on {
  background: #ffffff url(/media/c/2012/images/membership/icon_event_s.png) no-repeat center top;
}

.sub_nav li.atode a:hover, .sub_nav li.atode a.on {
  background: #ffffff url(/media/2014/cnet/membership/icon_atode_s.png) no-repeat center top;
}

.sub_nav li.poll a:hover, .sub_nav li.poll a.on {
  background: #ffffff url(/media/c/2012/images/membership/icon_poll_s.png) no-repeat center top;
}

.sub_nav li.docchi a:hover, .sub_nav li.docchi a.on {
  background: #ffffff url(/media/2014/cnet/membership/icon_docchi_s.png) no-repeat center top;
  margin-bottom: 0;
}

.sub_nav li.serial a:hover, .sub_nav li.serial a.on {
  background: #ffffff url(/media/2014/cnet/membership/icon_serial_s.png) no-repeat center top;
  margin-bottom: 0;
}

.box_service2,
.box_service {
  float: left;
  width: 184px;
  margin: 10px;
  background-color: #999;
  color: #fff;
}

.box_service2 h3,
.box_service2 p,
.box_service h3,
.box_service p {
  padding: 0 15px 10px;
}

.box_service2 h3,
.box_service h3 {
  text-align: center;
}


.private_info p a {
  color: #0b8ebf;
}

.member p {
  font-size: 100%;
  line-height: 1.6;
  margin-bottom: 10px;
}


#mypage_top form,
#mypage_top #profile_form {
  width: 100%;
}

#mypage_top .form_table input.radio {
  width: auto;
}

#mypage_top .form_table select {
  width: 50%;
  margin-left: 10px;
}

#mypage_top .form_table a {
  color: #0b8ebf;
}


#mypage_top input img {
  max-width: 10%;
}

.profile-submenu {
  display: flex;
  max-width: 70%;
  justify-content: center;
  margin: 0 auto;
  padding: 10px 0 20px;
}

.profile-submenu a {
  min-width: 10em;
  margin: 0 2px;
  padding: 4px 16px;
  font-weight: bold;
  text-align: center;
  border: 1px solid #000;
  border-radius: 5px;
  background: #E9EEF1;

}

@media screen and (max-width: 960px) {
  .profile-submenu {
    max-width: none;
  }

  .profile-submenu a {
    min-width: 0;
  }
}

@media screen and (max-width: 640px) {
  .profile-submenu a {
    padding: 4px;
    font-size: .85rem;
  }
}

#profile_form .table_mail {
  background-color: #f4f4f4;
  margin-bottom: 25px;
  width: 100%;
}


#profile_form .table_mail th {
  width: 30%;
  padding: 15px;
  background-color: #e0e0e0;
  border-bottom: 1px solid #ccc;
}

#profile_form .table_mail td {
  background-color #eee;
  padding: 15px;
  border-bottom: 1px solid #ccc;
}


#mypage_sub form,
#mypage_sub #profile_form {
  width: 100%;
}

#mypage_sub .table_mail input.radio {
  width: auto;
}

#mypage_sub .table_mail select {
  width: 50%;
  margin-left: 10px;
}

#mypage_sub .table_mail a {
  color: #0b8ebf;
}


#mypage_sub input img {
  max-width: 10%;
}


/*マイページ wp & clip*/

#wp_list,
#atode_list {
  background-color: #f4f4f4;
  padding: 2%;
}

#wp_list li,
#atode_list li {
  border-bottom: 1px dotted #ccc;
  padding: 15px;
}

#wp_list li img,
#atode_list li img {
  float: left;
  margin-right: 15px;
}

#wp_list li h3,
#atode_list li h3 {
  font-size: 120%;
}

#atode_list .news_type {
  color: #999;
}

.btn_mini_area {
  width: 325px;
  clear: both;
  float: right;
  text-align: right;
}

.btn_mini_area a {
  height: 20px;
  display: block;
  color: #fff;
  font-weight: normal;
  font-size: 0.9em;
  vertical-align: top;
  padding-left: 28px;
}

.btn_mini_area li {
  float: right;
  display: block;
  margin: 0 0 0 10px !important;
  padding: 0 10px 0 0;
  cursor: pointer;
  border-radius: 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
}

.btn_mini_area a.adobe {
  background: url(/media/c/2012/images/atode/ato_sprite.png) no-repeat 0 -140px;
}

.btn_mini_area a.epub {
  background: url(/media/c/2012/images/atode/ato_sprite.png) no-repeat 0 -160px;
}

.btn_mini_area a.print {
  background: url(/media/c/2012/images/atode/ato_sprite.png) no-repeat 0 -20px;
}

.btn_mini_area a.delete {
  background: url(/media/c/2012/images/icon/icon_delete.gif) no-repeat left 50%;
}

.btn_mini_area a:hover {
  text-decoration: none
}

.btn_mini_area li.gray {
  background: #ccc;
  filter: progid:DXImageTransform.Microsoft.Gradient(Enabled=1, GradientType=0, StartColorStr=#e2e2e2, EndColorStr=#a2a2a2);
  background: -moz-linear-gradient(top, #e2e2e2, #a2a2a2);
  background: -webkit-gradient(linear, left top, left bottom, from(#e2e2e2), to(#a2a2a2));
  border: 1px solid #666666;
  -moz-box-shadow: inset 0px 1px 0px #ffffff;
  -webkit-box-shadow: inset 0px 1px 0px #ffffff;
  box-shadow: inset 0px 1px 0px #ffffff;
  -moz-text-shadow: 0 -1px 0 #cccccc;
  -webkit-text-shadow: 0 -1px 0 #cccccc;
  text-shadow: 0 -1px 0 #cccccc;
}

.btn_mini_area li.gray a {
  color: #333;
}

.btn_mini_area li.gray:hover {
  background: #ddd;
  filter: progid:DXImageTransform.Microsoft.Gradient(Enabled=1, GradientType=0, StartColorStr=#e2e2e2, EndColorStr=#cccccc);
  background: -moz-linear-gradient(top, #e2e2e2, #cccccc);
  background: -webkit-gradient(linear, left top, left bottom, from(#e2e2e2), to(#cccccc));
  border: 1px solid #000;
}

.btn_mini_area li.black {
  background: #3a3a3d;
  filter: progid:DXImageTransform.Microsoft.Gradient(Enabled=1, GradientType=0, StartColorStr=#666666, EndColorStr=#333333);
  background: -moz-linear-gradient(top, #666666, #333333);
  background: -webkit-gradient(linear, left top, left bottom, from(#666666), to(#333333));
  border: 1px solid #333333;
  -moz-box-shadow: inset 0px 1px 0px #999999;
  -webkit-box-shadow: inset 0px 1px 0px #999999;
  box-shadow: inset 0px 1px 0px #999999;
  -moz-text-shadow: 0 -1px 0 #333;
  -webkit-text-shadow: 0 -1px 0 #333;
  text-shadow: 0 -1px 0 #333;
}

.btn_mini_area li.black:hover {
  background: #666;
}


#atode_list .btn_mini_area li.black,
#atode_list .btn_mini_area li.gray {
  padding: 5px !important;
}


#atode_list p.summary {
  margin-bottom: 15px;
}


/*マイページ　クイックポール*/

.poll_list {
  padding: 5px;
  margin-bottom: 10px;
  background-color: #e5e5e5;
  border: 1px solid #ccc;
}

.poll_list h3 {
  position: relative;
  padding-left: 20px;
}

.poll_list h3::after {
  content: "";
  position: absolute;
  top: 8px;
  left: 5px;
  width: 4px;
  height: 4px;
  border-top: 1px solid #aa1801;
  border-right: 1px solid #aa1801;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.poll_result .percent {
  float: left !important;
  margin-left: 5px !important;
}

/*マイページ　公開プロフィール*/


.member fieldset legend {
  font-size: 16px;
  color: #cc0000;
  font-weight: bold;
  margin-bottom: 25px;
  padding: 0 5px 0 5px;
}

.member fieldset {
  border: 1px solid #CCCCCC;
  margin: 15px 0 0 0;
  padding: 10px;
}

.member fieldset.account dl {
  padding: 0 5%;
  width: 90%;
}

.member fieldset.account dt, .member fieldset.nickname dt, .member fieldset.profile dt, .member fieldset.login dt {
  float: left;
  font-size: 12px;
  font-weight: bold;
  width: 120px;
  margin-bottom: 10px;
  margin-top: 5px;
  font-size: 120%;
}

.account input {
  width: auto;
  clear: both;
}

.account input#file_btn {
  border: 1px solid #ccc;
  border-radius: 5px;
  padding: 1.5%;
  width: 25%;
  margin-bottom: 25px;
  font-size: 120%;
}


#field_author {
  width: 80%;
}

#field_blog_bio {
  width: 85%;
  height: 12em;
  line-height: 1em;
}


/*マイページ　登録解除*/

.member fieldset.account {
  width: 90%;
  margin: 0 auto 25px;
}

.member .resign_info {
  width: 90%;
  margin: 0 auto;
  text-align: left;
  padding: 5%;
}

.resign_info textarea {
  width: 70%;
  height: 150px;
  line-height: 1em;
}

/*マイページ　パスワード再設定*/

.member .menu2 .account .itemvalue input {
  width: 80% !important;
}


/* -----------------------------------------------------------------------
 company page
--------------------------------------------------------------------------*/


.company_summary {
  background-color: #f4f4f4;
  margin: 15px auto;
  padding: 25px;
  border-radius: 8px;
}

.feedback li {
  margin: 10px;
}

.leaf_ttl_link {
  padding: 3% 0 0;
}


/* ===============================================================================

 Parts

=============================================================================== */


/*pagination*/

#pagination {
  /*clear: both;*/
  font-size: 14px;
  margin-bottom: 20px;
  position: static;
  width: 100%;
  text-align: center;
}

#pagination ul {
  position: static;
  /*left:0;*/
  float: none;
  background: none;
  display: inline-block;
  margin: 0 auto !important;
  /*width: 100%;*/
  text-align: center;
}

#pagination li {
  height: 22px;
  line-height: 16px;
  float: left;
  margin: 0 3px !important;
  padding: 0;
  text-align: center;
  position: static;
  background: none;
  border: none;
  list-style: none
}

#pagination li a {
  border: 1px solid #CCC;
  display: block;
  padding: 5px;
  font-weight: bold;
  text-decoration: none;
  color: black;
}

#pagination li.thispage {
  height: auto;
  border: 1px solid #151515;
  color: #fff;
  display: block;
  font-weight: bold;
  padding: 5px;
  text-decoration: none;
  background-color: #151515;
}

#pagination li.thispage a {
  border: 1px solid #CCC;
  color: black;
  display: block;
  font-weight: bold;
  padding: 2px 5px;
  text-decoration: none;
  background-color: #A4AEB7;
}

#pagination .pre, #pagination .next {
  border: none;
}

#pagination .pre a, #pagination .next a {
  background: #909090;
  padding: 6px 15px;
  border: none;
  color: #fff;
  position: relative;
}

#pagination .pre a, #pagination .next a::after {
  content: "";
  position: absolute;
  top: 0;
  right: -9px;
  border-left: 14px solid #909090;
  border-top: 14px solid transparent;
  border-bottom: 14px solid transparent;
  transform-origin: right top;
  transform: scaleX(.7);
}


/*arrow*/

.arrow-gray,
.arrow-gray-s,
.arrow-red,
.arrow-red-s {
  position: relative;
  padding-left: 20px;
}

.arrow-gray::before {
  content: "";
  position: absolute;
  top: 3px;
  left: 0;
  box-sizing: border-box;
  width: 16px;
  height: 16px;
  border: 1px solid #a0a0a0;
  -webkit-border-radius: 50%;
  border-radius: 50%;
}

.arrow-gray::after {
  content: "";
  position: absolute;
  top: 8px;
  left: 5px;
  width: 4px;
  height: 4px;
  border-top: 1px solid #a0a0a0;
  border-right: 1px solid #a0a0a0;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}


.arrow-red,
.arrow-red-s {
  position: relative;
}

.arrow-red::before {
  content: "";
  position: absolute;
  top: 3px;
  left: 0;
  box-sizing: border-box;
  width: 16px;
  height: 16px;
  border: 1px solid #aa1801;
  -webkit-border-radius: 50%;
  border-radius: 50%;
}

.arrow-red::after {
  content: "";
  position: absolute;
  top: 8px;
  left: 5px;
  width: 4px;
  height: 4px;
  border-top: 1px solid #aa1801;
  border-right: 1px solid #aa1801;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}


.arrow-gray-s::after {
  content: "";
  position: absolute;
  top: 8px;
  left: 5px;
  width: 4px;
  height: 4px;
  border-top: 1px solid #a0a0a0;
  border-right: 1px solid #a0a0a0;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}


.arrow-red-s::after {
  content: "";
  position: absolute;
  top: 8px;
  left: 5px;
  width: 4px;
  height: 4px;
  border-top: 1px solid #aa1801;
  border-right: 1px solid #aa1801;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.arrow-pl-20 {
  padding-left: 20px;
}


/*tag*/

.tag_list {
  display: flex;
  display: -webkit-box; /*Android browser*/
  display: -webkit-flex;
  display: -ms-flexbox;
  -ms-flex-direction: row;
  flex-direction: row;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin: 10px auto;
  width: 100%;
}

.tag_list li {
  width: 28%;
  margin: 0 5px 10px 5px;
  padding: 10px;
  background-color: #f5f5f5;
  border-bottom: none;
}

/*list*/

.news_list {
  margin: 15px 0;
}

.news_list li {
  margin-bottom: 15px;
  padding-bottom: 5px;
  border-bottom: 1px dotted #999;
}


.feedback {
  border: 1px solid #909090;
  margin-bottom: 20px;
}

.feedback #feedback_title {
  margin: 0;
  padding: 5px;
  color: white;
  font-weight: bold;
  background-color: #909090;
}

.feedback p {
  margin: 10px;
  font-size: 14px;
  line-height: 1.4em;
}

.feedback ul {
  margin: 5px;
  font-size: 14px;
}


/*box*//*一覧系ページ用*/

.box-window {
  width: 100%;
  margin: 15px 0;
  overflow: hidden;
}

.box-window img, .box-window a img {
  float: left;
  margin-right: 10px;
  display: block;
}

.box-window h3,
.box-window h3 a {
  font-size: 110%;
  padding-left: 20px;
}


.box-window .summary {
  font-size: 100%;
}


.digital_prodinfo {
  overflow: hidden;
  margin-bottom: 15px;
  padding: 10px;
  background-color: #f4f4f4;
}


.digital_prodinfo a {
  display: inline-block;
  overflow: hidden;
  width: 100%;
}

.digital_prodinfo img {
  float: left;
  margin-right: 10px;
}


/*story list-mark*/

.article_body ul li {
  line-height: 1.5em;
  list-style-image: url(/media/c/2006/img/list_style_image_c.gif);
  list-style-type: disc;
  margin: 10px 18px;
  padding: 0;
}


/*
.article_body ul li{
position:relative;
padding-left:20px;
font-size:16px;
}


.article_body ul li::before{
  content:"";
  position:absolute;
  top:5px;
  left:0;
  box-sizing: border-box;
  width: 16px;
  height: 16px;
  border: 1px solid #a0a0a0;
  -webkit-border-radius: 50%;
  border-radius: 50%;
}


.article_body ul li::after{
  content:"";
  position:absolute;
  top:10px;
  left: 5px;
  width: 4px;
  height: 4px;
  border-top: 1px solid #a0a0a0;
  border-right: 1px solid #a0a0a0;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
*/


/*tumbnail*/

.pic_184 {
  width: 184px;
  max-width: 100%;
}


/* ===============================================================================

 Form

=============================================================================== */


/*form_wrap
---------------------------------------------------*/
.form_wrap {
  border: 1px solid #CCCCCC;
  background-color: #EEEEEE;
  padding: 10px 10px 0 10px;
  margin-bottom: 20px;
/ / margin-bottom: - 3 px;
  overflow: hidden;
}

.form_wrap h3 {
  border: 1px solid #CCCCCC;
  background-color: #999999;
  color: #FFFFFF;
  padding: 5px;
  font-weight: bold;
  letter-spacing: 0.04em;
  margin-bottom: 15px;
}

.form_wrap h4 {
  font-weight: bold;
  font-size: 14px;
  margin: 10px 0;
}

.form_wrap h4 span {
  color: #CC0000;
  font-weight: bold;
}


/*permission_wrap
---------------------------------------------------*/
.permission_wrap {
  border: 1px solid #CCCCCC;
  background-color: #EEEEEE;
  padding: 10px;
  margin: 15px 0;
}

.permission_wrap p.btn_wpdl {
  text-indent: -9999px;
  width: 424px;
  height: 47px;
  margin-left: 100px;
}

.permission_wrap p.btn_wpdl a {
  display: block;
  background: url('/media/z/2011/btn_wpdl.gif') no-repeat transparent;
  width: 424px;
  height: 47px;
  overflow: hidden;
}

.permission_wrap p.btn_wpdl a:hover {
  background-position: 0 -47px;
}

/*btn_wrap
---------------------------------------------------*/
.btn_wrap {
  width: 530px;
  margin-left: 47px;
  margin-bottom: 15px;
}

.form_wrap .btn_wrap p.btn_login {
  float: left;
}

.form_wrap .btn_wrap p.btn_cnetid {
  float: right;
}

/*btn_login
---------------------------------------------------*/
.form_wrap p.btn_login {
  text-indent: -9999px;
  width: 230px;
  height: 35px;
}

.form_wrap p.btn_login a {
  display: block;
  background: url('/media/z/2011/btn_login.gif') no-repeat transparent;
  width: 230px;
  height: 35px;
  overflow: hidden;
}


/*btn_cnetid
---------------------------------------------------*/
.form_wrap p.btn_cnetid {
  text-indent: -9999px;
  width: 230px;
  height: 35px;
}

.form_wrap p.btn_cnetid a {
  display: block;
  background: url('/media/z/2011/btn_cnetid.gif') no-repeat transparent;
  width: 230px;
  height: 35px;
  overflow: hidden;
}


/*btn_kl
---------------------------------------------------*/
p.btn_kl {
  text-indent: -9999px;
  width: 424px;
  height: 47px;
  margin-left: 100px;
}

p.btn_kl a {
  display: block;
  background: url('/media/z/2011/btn_wpdl02.gif') no-repeat transparent;
  width: 424px;
  height: 47px;
  overflow: hidden;
}

p.btn_kl a:hover {
  background-position: 0 -47px;
}

/*p.login_info/p.kl_info
---------------------------------------------------*/
p.login_info,
p.kl_info {
  font-size: 12px;
}


p.kl_info {
  margin-bottom: 15px;
}

p.kl_info span {
  color: #CC0000;
  font-weight: bold;
}

p.kl_info span {
  font-weight: bold;
}


/*form_q
---------------------------------------------------*/
.form_q {
  border-bottom: 1px dotted #CCCCCC;
  padding: 0 25px 15px 25px;
  margin-bottom: -1px;
}

.form_q input {
  margin-right: 5px;
  margin-bottom: 6px;
  _margin-bottom: 0; /* for IE6 */
}


/*btn_wpdl
---------------------------------------------------*/
.wp_download p.btn_wpdl {
  text-indent: -9999px;
  width: 424px;
  height: 47px;
  margin: 20px 0;
  margin-left: 100px;
}

.wp_download p.btn_wpdl a {
  display: block;
  background: url('/media/z/2011/btn_wpdl.gif') no-repeat transparent;
  width: 424px;
  height: 47px;
  overflow: hidden;
}

a.wp_dl_start_button {
  background: transparent url(/media/z/2008/img/base/paper/dl_button.gif) repeat-x;
  border: none;
  color: white;
  font-size: 14px;
  font-weight: bold;
  height: 35px;
  margin: 10px 0 3px;
  padding: 0;
  display: table-cell;
  vertical-align: middle;
  text-align: center;
  width: 195px;
}


.key_chain_disable {
  padding: 0px;
}


.key_chain_disable .nextpage_link p {
  padding: 5px 40px;
  background-color: #efefef;
  border: 1px solid #cccccc;
  color: #999999;
  font-weight: bold;
  font-size: 16px;
  display: inline;
}


.key_chain_disable #dl_start {
  padding-bottom: 25px;
  background-image: none;
  /* border-bottom: 1px solid #dddddd; */
  text-align: center;
  font-size: 14px;
}


.key_chain_disable .msg_login {

  padding: 10px;
  background-color: #EFEFEF;
  color: #999999;
  font-size: 12px;
  line-height: 1.3;
}


/* common
--------------------------------------------------*/
.hidden {
  display: none;
}


/*
  responsive
--------------------------------------------------*/
#page-wrap-resp,
#header-wrap-resp,
#nav-wrap-resp,
#footer-wrap-resp {
  display: none;
}

/* leaf-photo */
#leaf-column .leaf-item-inner .leaf_layout_3box {
  width: 100%;
  overflow: hidden;
  margin: 2% 0;
}

#leaf-column .leaf-item-inner .leaf_layout_3box .photo_box {
  width: 30%;
  padding: 0 1.5%;
  float: left;
  font-size: 100%;
  border-bottom: none;
  font-weight: bold;
}

#leaf-column .leaf-item-inner .leaf_layout_3box .photo_box:before, #leaf-column .leaf-item-inner .leaf_layout_3box .photo_box:after {
  display: none;
}

#leaf-column .leaf-item-inner .leaf_layout_3box .photo_box a {
  padding: 0;
}

#leaf-column .leaf-item-inner .leaf_layout_3box .photo_box a:hover {
  transition: 0.4s;
  opacity: 0.8;
}

#leaf-column .leaf-item-inner .leaf_layout_3box img {
  max-width: 100%;
}


/* GDPR
--------------------------------------------------*/
#gdpr_area {
  display: none;
  position: fixed;
  z-index: 9999;
  bottom: 0;
  width: 100%;
  box-sizing: border-box;
  background-color: rgba(0, 0, 0, 0.85);
  color: white;
  line-height: 1.5;
}

#gdpr_area a {
  text-decoration: underline;
}

#gdpr_area .gdpr_area_inner {
  position: relative;
  width: 900px;
  margin: 0 auto;
  padding: 10px 40px 10px 0;
  font-size: 12px !important;
}

#gdpr_area .gdpr_area_inner a {
  color: #fff;
}

#gdpr_area .gdpr_area_inner a:hover {
  text-decoration: underline;
}

#gdpr_area .gdpr_area_inner span.break {
  display: block;
}

#gdpr_area .gdpr_btn_agree {
  cursor: pointer;
  position: absolute;
  top: 10px;
  right: 0;
  display: block;
  width: 18px;
  height: 18px;
  text-indent: -9999px;
  background-color: #999;
}

#gdpr_area .gdpr_btn_agree::after,
#gdpr_area .gdpr_btn_agree::before {
  content: "";
  position: absolute;
  top: 2px;
  left: 8px;
  display: block;
  width: 2px;
  height: 15px;
  background-color: #f5f5f5;
  transform: rotate(45deg);
}

#gdpr_area .gdpr_btn_agree::before {
  transform: rotate(-45deg);
}

@media screen and (max-width: 960px) {
  #gdpr_area .gdpr_area_inner {
    width: auto;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 10px 40px 10px 10px;
  }

  #gdpr_area .gdpr_area_inner span.break {
    display: inline;
  }

  #gdpr_area .gdpr_btn_agree {
    right: 10px;
  }
}

/* ラウンドアップ記事
--------------------------------------------------*/

#leaf-column .leaf-article-inner .description08 {
  margin-bottom: 20px;
  display: block;
}


#leaf-column .leaf-article-inner li h3.title08 {
  font-size: 18px;
  margin-bottom: 5px;
}

#leaf-column .leaf-article-inner li p.summary08 {
  font-size: 14px;
  line-height: 1.4;
  margin-bottom: 5px;
}

#leaf-column .leaf-article-inner li p.date08 {
  margin: 0 0 20px 0;
  padding: 0;
  font-size: 12px;
  font-weight: normal;
  line-height: 120%;
  display: block;
  clear: none;
}


/* Splash
--------------------------------------------------*/
#splash-container {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  background: #b5b5b5;
}

#splash-header {
  background-color: #efefef;
  height: 25px;
  width: auto;
  text-align: right;
  line-height: 25px;
  color: #000;
  font-size: 10px;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  padding: 3px 10px;
}

#splash-header a {
  color: #000;
  font-weight: bold;
  font-size: 11px;
  height: 32px;
}

#splash {
  height: 100%;
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  background: #b5b5b5;
  z-index: 9999999999;
  overflow-y: auto;
}

/*
  browser Control
--------------------------------------------------*/
html {
  overflow-y: scroll;
}


/* ===============================================================================

add contents

=============================================================================== */


/*
  podcast 202108
--------------------------------------------------*/


@import url('https://fonts.googleapis.com/css2?family=Ubuntu&display=swap');

.podcast-header {
  width: 100%;
  margin-bottom: 10px;
}

.podcast-header img {
  max-width: 100%;
}

.podcast-header .lead {
  font-size: 18px;
  color: #252525;
  margin: 15px auto;
  padding: 20px;
  text-align: left;
  line-height: 1.6;
}

.podcast-link {
  margin: 45px auto;
  padding: 30px 25px;
  box-shadow: 0 0 15px #ccc;
  border-radius: 15px;
  text-align: center;
  letter-spacing: -0.01em;
  font-family: 'Ubuntu', sans-serif;
  font-weight: bold;
  font-size: 26px;
  display: block;
  position: relative;
}

.podcast-link:hover {
  background-color: #e0e0e0;
  box-shadow: none;
}

.podcast-link:before {
  content: "";
  position: absolute;
  top: 25px;
  left: 20px;
  width: 100%;
  height: 100%;
}

.podcast-link:after {
  content: "";
  position: absolute;
  top: 25px;
  right: 20px;
  width: 100%;
  height: 100%;
}

.podcast-apple,
.podcast-apple:hover {
  color: #405053 !important;
}

.podcast-apple:before {
  background: url(/media/c/2021/images/podcast/icon_apple_microphone.png) left top no-repeat;
}

.podcast-apple:after {
  background: url(/media/c/2021/images/podcast/icon_apple_microphone.png) right top no-repeat;
}

.podcast-spotify,
.podcast-spotify:hover {
  color: #26a053 !important;
}

.podcast-spotify:before {
  background: url(/media/c/2021/images/podcast/icon_spotify_microphone.png) left top no-repeat;
}

.podcast-spotify:after {
  background: url(/media/c/2021/images/podcast/icon_spotify_microphone.png) right top no-repeat;
}

.podcast-google,
.podcast-google:hover {
  color: #4285f4 !important;
}

.podcast-google:before {
  background: url(/media/c/2021/images/podcast/icon_google_microphone.png) left top no-repeat;
}

.podcast-google:after {
  background: url(/media/c/2021/images/podcast/icon_google_microphone.png) right top no-repeat;
}

.podcast-amazon,
.podcast-amazon:hover {
  color: #ffa000 !important;
}

.podcast-amazon:before {
  background: url(/media/c/2021/images/podcast/icon_amazon_microphone.png) left top no-repeat;
}

.podcast-amazon:after {
  background: url(/media/c/2021/images/podcast/icon_amazon_microphone.png) right top no-repeat;
}

.podcast-voicy,
.podcast-voicy:hover {
  color: #dd6d12;
!important;
}

.podcast-voicy:before {
  background: url(/media/c/2021/images/podcast/icon_voicy_microphone.png) left top no-repeat;
}

.podcast-voicy:after {
  background: url(/media/c/2021/images/podcast/icon_voicy_microphone.png) right top no-repeat;
}


@media screen and (max-width: 640px) {
  .podcast-link {
    font-size: 22px;
  }
}


/*
　workcation channel setting 2021
----------------------------------------------------------------------------*/


#workcation_slider .swiper-wrapper .item-01 {
  width: 60%;
}

#workcation_slider .swiper-wrapper .item-03 {
  width: 40%;
}

#workcation_slider .swiper-button-next,
#workcation_slider .swiper-pagination {
  display: none;
}


#workcation_slider .item-01 .topics-img img,
#workcation_slider .item-03 .topics-img img {
  margin-top: -10%;
}


.sub_logo {
  position: relative;
}

.sub_logo .logo_workcation {
  position: absolute;
  top: 0;
  left: 0;
  width: 200px;
  height: 60px;
  line-height: 60px;
  background-color: #ccc;
  margin: 20px 0;
  text-align: center;
}

.workcation-right-inner {
  margin: 15px 0 60px;
}

.workcation-right-inner li {
  padding: 0 40px 30px;
  font-size: 16px;
}

.workcation-right-inner .beginner {
  background: url(/media/c/2012/images/responsive/right_icon_beginner.png) 0 0 no-repeat;
}

.workcation-right-inner .media {
  background: url(/media/c/2012/images/responsive/right_icon_insight.png) 0 0 no-repeat;
}

.workcation-right-inner .report {
  background: url(/media/c/2012/images/responsive/right_icon_report.png) 0 0 no-repeat;
}

.workcation-right-inner .area {
  background: url(/media/c/2012/images/responsive/right_icon_area.png) 0 0 no-repeat;
}

.workcation-right-inner .related {
  background: url(/media/c/2012/images/responsive/right_icon_related.png) 0 0 no-repeat;
}


.workcation-main-block,
.workcation-category-block,
.workcation-area-block {
  width: 100%;
}

.workcation-main-block {
  margin: 40px 0 0 0;
}

.workcation-main-block h2,
.workcation-category-block h2,
.workcation-area-block h2 {
  font-size: 36px !important;
  font-weight: normal;
}

.workcation-category-block h2,
.workcation-area-block h2 {
  text-align: left;
  padding: 65px 0 50px;
}

.workcation-main-block .new,
.workcation-main-block .beginner,
.workcation-main-block .insight,
.workcation-main-block .report,
.workcation-main-block .related {
  height: 53px;
  padding: 15px 0 0 60px;
}

.workcation-main-block .new {
  background: url(/media/c/2012/images/responsive/icon_new.png) 0 0 no-repeat;
}

.workcation-main-block .beginner {
  background: url(/media/c/2012/images/responsive/icon_beginner.png) 0 0 no-repeat;
}

.workcation-main-block .insight {
  background: url(/media/c/2012/images/responsive/icon_insight.png) 0 0 no-repeat;
}

.workcation-main-block .report {
  background: url(/media/c/2012/images/responsive/icon_report.png) 0 0 no-repeat;
}

.workcation-main-block .related {
  background: url(/media/c/2012/images/responsive/icon_related.png) 0 0 no-repeat;
}

.workcation-main-block a.more_list {
  text-align: right;
  font-size: 16px;
  font-weight: normal !important;
  color: #333 !important;
  text-decoration: none !important;
  margin-right: 15px;
  display: block;
  position: relative;
}

.workcation-main-block a.more_list:hover {
  color: #666 !important;
}

.workcation-main-block a.more_list:after {
  content: "";
  position: absolute;
  top: 8px;
  right: -10px;
  width: 8px;
  height: 8px;
  border-top: 1px solid #151515;
  border-right: 1px solid #151515;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.workcation-main-block ul,
.workcation-area-block ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 0 0 40px !important;
}


.workcation-main-block ul:after,
.workcation-area-block ul:after {
  display: block;
  content: "";
  width: 250px;
}


.workcation-main-block li,
.workcation-area-block li {
  /*width: 250px;*/
  /*height: 140px;*/
  position: relative;
}

.workcation-main-block li a{
  display:block;
  width: 250px;
  /*height: 140px;*/
  aspect-ratio: 16 / 9;
  position: relative;
  overflow: hidden;
}


.workcation-main-block li a:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  background: linear-gradient(rgba(0, 0, 0, 0.0) 20%, rgba(0, 0, 0, 0.8) 70%);
  width: 100%;
  height: 100%;
  display: block;
  z-index: 1;
}

.workcation-main-block li a:hover img,
.workcation-area-block li a:hover img {
  transform: scale(1.05, 1.05);
  transition: .3s;
}

.workcation-main-block li a:hover span {
  color: #ea7505;
  transition: .3s;
}



.workcation-main-block li .article_title {
  position: absolute;
  left: 0;
  bottom: 0;
  font-size: 16px;
  font-weight: normal;
  padding: 10px;
  line-height: 1.4;
  color: #ffffff;
  letter-spacing: 0.05em;
  z-index: 1;
}

.workcation-category-block .beginner,
.workcation-category-block .insight,
.workcation-category-block .report,
.workcation-category-block .related {
  height: 53px;
  padding: 15px 0 0 60px;
  line-height: 1.1;
}


.workcation-category-block .beginner {
  background: url(/media/c/2012/images/responsive/icon_beginner.png) 0 0 no-repeat;
}

.workcation-category-block .insight {
  background: url(/media/c/2012/images/responsive/icon_insight.png) 0 0 no-repeat;
}

.workcation-category-block .report {
  background: url(/media/c/2012/images/responsive/icon_report.png) 0 0 no-repeat;
}

.workcation-category-block .related {
  background: url(/media/c/2012/images/responsive/icon_related.png) 0 0 no-repeat;
}

.workcation-category-block li.article_list {
  overflow: hidden;
  margin-bottom:0;
  padding-bottom: 40px;
}

.workcation-category-block li.article_list div {
  display: flex;
}

.workcation-category-block li.article_list .list_thumb {
  /*width: 400px;
  height: 225px;*/
  width: 300px;
  height: 169px;
  margin-right: 20px;
  overflow: hidden;
  float: left;
  vertical-align: top;
  display: block;
}

.workcation-category-block li.article_list .list_thumb a:hover {
  opacity: 0.7;
  transition: .3s
}


.workcation-category-block li.article_list .list_main {
  position: relative;
  display: block;
  /*height: 225px;*/
}

.workcation-category-block li.article_list .list_main .title {
  font-size: 24px;
  font-weight: bold;
  margin-bottom: 5px;
  line-height: 1.3;
  display: block;
}

.workcation-category-block li.article_list .list_main .title a {
  color: #333 !important;
  text-decoration: none !important;
  transition: .3s;
}

.workcation-category-block li.article_list .list_main .title a:hover {
  color: #999 !important;
}

.workcation-category-block li.article_list .list_main .summary {
  font-size: 14px;
}


.workcation-area-block .area {
  background: url(/media/c/2012/images/responsive/icon_area.png) center 0 no-repeat;
}

.workcation-area-block .area_category {
  width: 100%;
  font-size: 24px;
  font-weight: normal;
  color: #333;
  padding: 5px 0 30px 40px;
  background: url(/media/c/2012/images/responsive/icon_area_gray.png) 0 0 no-repeat;
}


/*.workcation-area-block ul:after{
display: block;
content:"";
width: 250px;
}*/


.workcation-area-block {
  margin: 50px auto 0;
}

.workcation-area-block ul {
  display: flex;
}

.workcation-area-block li {
  width: 48%;
  height: auto !important;
  margin-bottom: 15px;
  list-style: none;
}

.workcation-area-block li.area-btn a {
  width: 100%;
  height: 80px;
  line-height: 80px;
  color: #fff;
  margin: 0 auto 25px;
  text-align: center;
  font-size: 24px;
  border-radius: 15px;
  display: block;
}


.workcation-area-block li.area-btn a.hokkaido {
  background: #aac660 url(/media/c/2012/images/responsive/parts_hokkaido.png) 15px 0 no-repeat;
}

.workcation-area-block li.area-btn a.tohoku {
  background: #aac660 url(/media/c/2012/images/responsive/parts_tohoku.png) 15px 0 no-repeat;
}

.workcation-area-block li.area-btn a.kanto {
  background: #aac660 url(/media/c/2012/images/responsive/parts_kanto.png) 15px 0 no-repeat;
}

.workcation-area-block li.area-btn a.chubu {
  background: #aac660 url(/media/c/2012/images/responsive/parts_chubu.png) 15px 0 no-repeat;
}

.workcation-area-block li.area-btn a.kinki {
  background: #aac660 url(/media/c/2012/images/responsive/parts_kinki.png) 15px 0 no-repeat;
}

.workcation-area-block li.area-btn a.chugoku {
  background: #aac660 url(/media/c/2012/images/responsive/parts_chugoku.png) 15px 0 no-repeat;
}

.workcation-area-block li.area-btn a.shikoku {
  background: #aac660 url(/media/c/2012/images/responsive/parts_shikoku.png) 15px 0 no-repeat;
}

.workcation-area-block li.area-btn a.kyushu {
  background: #aac660 url(/media/c/2012/images/responsive/parts_kyushu.png) 15px 0 no-repeat;
}

.workcation-area-block li.area-btn a.okinawa {
  background: #aac660 url(/media/c/2012/images/responsive/parts_okinawa.png) 15px 0 no-repeat;
}

.workcation-area-block li.area-btn a.hokkaido:hover,
.workcation-area-block li.area-btn a.tohoku:hover,
.workcation-area-block li.area-btn a.kanto:hover,
.workcation-area-block li.area-btn a.chubu:hover,
.workcation-area-block li.area-btn a.kinki:hover,
.workcation-area-block li.area-btn a.chugoku:hover,
.workcation-area-block li.area-btn a.shikoku:hover,
.workcation-area-block li.area-btn a.kyushu:hover,
.workcation-area-block li.area-btn a.okinawa:hover {
  background-color: #e8e8e8;
}


.workcation-area-block li a {
  text-decoration: none !important;
}

.workcation-area-block li a span {
  line-height: 140px;
  color: #fff;
  font-size: 20px;
  font-weight: normal;
  text-align: center;
  display: block;
  position: relative;
  z-index: 100;
}

.workcation-area-block li a:hover span {
  line-height: 140px;
  color: #ea7505;
  transition: .3s;
}


.workcation-area-block h2.facility-area {
  background: url(/media/c/2012/images/responsive/icon_area_gray.png) 0 0 no-repeat;
  margin-bottom: 30px;
  padding: 5px 0 30px 35px !important;
  font-size: 26px !important;
}


.workcation-area-block .facility_list {
  display: block;
  width: 100%;
}

.workcation-area-block .facility_list li {
  width: auto;
  font-size: 20px;
  margin-bottom: 40px;
  padding: 0 0 10px 80px;
  border-bottom: 1px dotted #ccc;
  background: url(/media/c/2012/images/responsive/icon_facility.png) 0 0 no-repeat;
}


.workcation-area-block .facility_list li .facility_name a {
  margin-top: 10px;
  padding-left: 18px;
  line-height: 1.5;
  display: block;
  text-decoration: underline;
  position: relative;
}

.workcation-area-block .facility_list li .facility_name a:before {
  content: "";
  position: absolute;
  top: 10px;
  left: 0;
  width: 8px;
  height: 8px;
  border-top: 2px solid #a0a0a0;
  border-right: 2px solid #a0a0a0;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.workcation-area-block .facility_list li .tag {
  font-size: 14px;
  margin: 15px 10px 0 0;
}


/*.workcation-area-block li:before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  height: 100%;
  width: 100%;
  background: rgba(0, 0, 0, 0.6);
}

.workcation-area-block li:hover:before{
  background: rgba(0, 0, 0, 0.3);
}*/


/*47 area*/
.workcation-area-block li.hokkaido {
  background: url(/media/c/2012/images/responsive/thumb_hokkaido.jpg) center 0 no-repeat;
}

.workcation-area-block li.aomori {
  background: url(/media/c/2012/images/responsive/thumb_aomori.jpg) center 0 no-repeat;
}

.workcation-area-block li.iwate {
  background: url(/media/c/2012/images/responsive/thumb_iwate.jpg) center 0 no-repeat;
}

.workcation-area-block li.akita {
  background: url(/media/c/2012/images/responsive/thumb_akita.jpg) center 0 no-repeat;
}

.workcation-area-block li.miyagi {
  background: url(/media/c/2012/images/responsive/thumb_miyagi.jpg) center 0 no-repeat;
}

.workcation-area-block li.yamagata {
  background: url(/media/c/2012/images/responsive/thumb_yamagata.jpg) center 0 no-repeat;
}

.workcation-area-block li.fukushima {
  background: url(/media/c/2012/images/responsive/thumb_fukushima.jpg) center 0 no-repeat;
}

.workcation-area-block li.ibaraki {
  background: url(/media/c/2012/images/responsive/thumb_ibaraki.jpg) center 0 no-repeat;
}

.workcation-area-block li.tochigi {
  background: url(/media/c/2012/images/responsive/thumb_tochigi.jpg) center 0 no-repeat;
}

.workcation-area-block li.gunma {
  background: url(/media/c/2012/images/responsive/thumb_gunma.jpg) center 0 no-repeat;
}

.workcation-area-block li.saitama {
  background: url(/media/c/2012/images/responsive/thumb_saitama.jpg) center 0 no-repeat;
}

.workcation-area-block li.chiba {
  background: url(/media/c/2012/images/responsive/thumb_chiba.jpg) center 0 no-repeat;
}

.workcation-area-block li.tokyo {
  background: url(/media/c/2012/images/responsive/thumb_tokyo.jpg) center 0 no-repeat;
}

.workcation-area-block li.kanagawa {
  background: url(/media/c/2012/images/responsive/thumb_kanagawa.jpg) center 0 no-repeat;
}

.workcation-area-block li.niigata {
  background: url(/media/c/2012/images/responsive/thumb_niigata.jpg) center 0 no-repeat;
}

.workcation-area-block li.toyama {
  background: url(/media/c/2012/images/responsive/thumb_toyama.jpg) center 0 no-repeat;
}

.workcation-area-block li.ishikawa {
  background: url(/media/c/2012/images/responsive/thumb_ishikawa.jpg) center 0 no-repeat;
}

.workcation-area-block li.fukui {
  background: url(/media/c/2012/images/responsive/thumb_fukui.jpg) center 0 no-repeat;
}

.workcation-area-block li.yamanashi {
  background: url(/media/c/2012/images/responsive/thumb_yamanashi.jpg) center 0 no-repeat;
}

.workcation-area-block li.nagano {
  background: url(/media/c/2012/images/responsive/thumb_nagano.jpg) center 0 no-repeat;
}

.workcation-area-block li.gifu {
  background: url(/media/c/2012/images/responsive/thumb_gifu.jpg) center 0 no-repeat;
}

.workcation-area-block li.shizuoka {
  background: url(/media/c/2012/images/responsive/thumb_shizuoka.jpg) center 0 no-repeat;
}

.workcation-area-block li.aichi {
  background: url(/media/c/2012/images/responsive/thumb_aichi.jpg) center 0 no-repeat;
}

.workcation-area-block li.mie {
  background: url(/media/c/2012/images/responsive/thumb_aichi.jpg) center 0 no-repeat;
}

.workcation-area-block li.shiga {
  background: url(/media/c/2012/images/responsive/thumb_shiga.jpg) center 0 no-repeat;
}

.workcation-area-block li.nara {
  background: url(/media/c/2012/images/responsive/thumb_nara.jpg) center 0 no-repeat;
}

.workcation-area-block li.wakayama {
  background: url(/media/c/2012/images/responsive/thumb_wakayama.jpg) center 0 no-repeat;
}

.workcation-area-block li.kyoto {
  background: url(/media/c/2012/images/responsive/thumb_kyoto.jpg) center 0 no-repeat;
}

.workcation-area-block li.oosaka {
  background: url(/media/c/2012/images/responsive/thumb_oosaka.jpg) center 0 no-repeat;
}

.workcation-area-block li.hyogo {
  background: url(/media/c/2012/images/responsive/thumb_hyogo.jpg) center 0 no-repeat;
}

.workcation-area-block li.okayama {
  background: url(/media/c/2012/images/responsive/thumb_okayama.jpg) center 0 no-repeat;
}

.workcation-area-block li.hiroshima {
  background: url(/media/c/2012/images/responsive/thumb_hiroshima.jpg) center 0 no-repeat;
}

.workcation-area-block li.tottori {
  background: url(/media/c/2012/images/responsive/thumb_tottori.jpg) center 0 no-repeat;
}

.workcation-area-block li.shimane {
  background: url(/media/c/2012/images/responsive/thumb_shimane.jpg) center 0 no-repeat;
}

.workcation-area-block li.yamaguchi {
  background: url(/media/c/2012/images/responsive/thumb_yamaguchi.jpg) center 0 no-repeat;
}

.workcation-area-block li.kagawa {
  background: url(/media/c/2012/images/responsive/thumb_kagawa.jpg) center 0 no-repeat;
}

.workcation-area-block li.tokushima {
  background: url(/media/c/2012/images/responsive/thumb_tokushima.jpg) center 0 no-repeat;
}

.workcation-area-block li.ehime {
  background: url(/media/c/2012/images/responsive/thumb_ehime.jpg) center 0 no-repeat;
}

.workcation-area-block li.kouchi {
  background: url(/media/c/2012/images/responsive/thumb_kouchi.jpg) center 0 no-repeat;
}

.workcation-area-block li.fukuoka {
  background: url(/media/c/2012/images/responsive/thumb_fukuoka.jpg) center 0 no-repeat;
}

.workcation-area-block li.saga {
  background: url(/media/c/2012/images/responsive/thumb_saga.jpg) center 0 no-repeat;
}

.workcation-area-block li.nagasaki {
  background: url(/media/c/2012/images/responsive/thumb_nagasaki.jpg) center 0 no-repeat;
}

.workcation-area-block li.ooita {
  background: url(/media/c/2012/images/responsive/thumb_ooita.jpg) center 0 no-repeat;
}

.workcation-area-block li.kumamoto {
  background: url(/media/c/2012/images/responsive/thumb_kumamoto.jpg) center 0 no-repeat;
}

.workcation-area-block li.miyazaki {
  background: url(/media/c/2012/images/responsive/thumb_miyazaki.jpg) center 0 no-repeat;
}

.workcation-area-block li.kagoshima {
  background: url(/media/c/2012/images/responsive/thumb_kagoshima.jpg) center 0 no-repeat;
}

.workcation-area-block li.okinawa {
  background: url(/media/c/2012/images/responsive/thumb_okinawa.jpg) center 0 no-repeat;
}


/*
　workcation channel setting 2021 end
----------------------------------------------------------------------------*/


/* floating banner setting 2022
----------------------------------------------------------------------------*/
#ad_float {
  display: none;
}
.floating_banner_area { /*タブレットスマホのみ*/
  display: none;
}

/* floating banner setting 2022 end
-----------------------------------------------------------------------------*/


/* PR add 2024
----------------------------------------------------------------------------*/

.block_sponsored_area {
  color: #000;
  font-size: 14px;
  border: 1px solid #000;
  margin: 35px 10px;
  padding: 20px 20px 10px;
  position: relative;
}

.block_sponsored_area span {
  margin: 5px 0;
  display: block;
}


.block_sponsored_area:before {
  display: block;
  content: "PR";
  position: absolute;
  top: -12px;
  left: 30px;
  width: 40px;
  height: 30px;
  text-align: center;
  background-color: #fff;
}


#corporate-ad-block {
  height: 50px;

}

#corporate-ad-line {
  display: flex;
  justify-content: flex-end;
  clear: both;
  color: #000;
  font-size: 12px;
  height: 18px;
}

#credit-line {
  /*display: flex;
  justify-content: flex-end;*/
  color: #a0a0a0 !important;
  font-size: 12px;
  text-align: right;
  margin-right: 0 !important;
  position: absolute;
  bottom: -17px;
  right: 0;
}

/* PR add workcation page */


.workcation-main-block span{
  display:block;
}

.workcation-main-block li span.pr{
    position: absolute;
    left: 0;
    bottom: 50%;
    font-size: 12px;
    font-weight: normal;
    padding: 10px;
    line-height: 1.2;
    color: #ffffff;
    z-index: 1;
}

.workcation-category-block li .list_main span.pr{
  font-size: 14px;
}

.workcation-main-block li span.credits{
    color:#a0a0a0;
    position:absolute;
    bottom:-20px;
    right:0;
    font-size:12px;
}

.workcation-category-block .list_main #credit-line{
  bottom: -40px;
}





@media screen and (max-width: 960px) {
  #credit-line {
    position: static;
    display: block;
  }


.workcation-main-block li span.pr{
    position: absolute;
    left: 0;
    bottom: 30%;
}

.workcation-category-block li .list_main span.pr{
  font-size: 12px;
}

}


@media screen and (max-width: 640px) {


.workcation-main-block li span.pr{
    position: absolute;
    left: calc(35% + 10px);
    bottom: 100% !important;
color:#333;
padding:0;
}

.workcation-main-block li span.credits{
    color:#a0a0a0;
    position:absolute;
    bottom:0;
    right:0;
    font-size:12px;
}


}







/* 人気記事ランキング add 202406
----------------------------------------------------------------------------*/
#leaf-column .popular-ranking-block {
  width: 100%;
  line-height: 1.5;
}

#leaf-column .popular-ranking-block ul li a {
  margin: 0;
}

#leaf-column .popular-ranking-block .article-ranking {
  display: flex;
  padding: 20px 0;
  border-bottom: 1px solid #e0e0e0;
}

#leaf-column .popular-ranking-block .article-ranking .icon-ranking {
  flex-basis: 50px;
  width: 50px;
  height: 50px;
  line-height: 50px;
  border-radius: 5px;
  background-color: #e5e5e5;
  color: #444;
  font-size: 1.5rem;
  font-weight: bold;
  font-family: "Arial", sans-serif;
  text-align: center;
}

#leaf-column .popular-ranking-block .article-ranking .rank1 {
  background-color: #e9d603;
  color: #fff;
}

#leaf-column .popular-ranking-block .article-ranking .rank2 {
  background-color: #2c9cbc;
  color: #fff;
}

#leaf-column .popular-ranking-block .article-ranking .rank3 {
  background-color: #e07236;
  color: #fff;
}


#leaf-column .popular-ranking-block .article-ranking .article-img {
  flex-basis: 20%;
  margin: 0 3%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

#leaf-column .popular-ranking-block .article-ranking .article-img img {
  max-width: 100%;
  height: auto;
}

#leaf-column .popular-ranking-block .article-ranking .article-text {
  flex-basis: 70%;
  position: relative;
}

#leaf-column .popular-ranking-block .article-ranking .article-text a {
  font-size: 1.4rem;
  font-weight: bold;
  /*font-size:24px;*/
  /*font-size:22px;*/
}

#leaf-column .popular-ranking-block .article-ranking span.date {
  position: absolute;
  bottom: 0;
  right: 0;
  font-size: 12px;
}


@media screen and (max-width: 960px) {

  #leaf-column .popular-ranking-block .article-ranking .icon-ranking {
    flex-basis: 40px;
    width: 40px;
    height: 40px;
    line-height: 40px;
    font-size: 1.25rem;
  }

  #leaf-column .popular-ranking-block .article-ranking .article-text a {
    font-size: 1.25rem;
  }

}

@media screen and (max-width: 480px) {

  #leaf-column .popular-ranking-block .article-ranking .icon-ranking {
    flex-basis: 25px;
    width: 25px;
    height: 25px;
    line-height: 25px;
    font-size: 1rem;
  }


  #leaf-column .popular-ranking-block .article-ranking .article-img {
    flex-basis: 25%;
  }

  #leaf-column .popular-ranking-block .article-ranking .article-text {
    flex-basis: 65%;
    position: relative;
  }


  #leaf-column .popular-ranking-block .article-ranking .article-text a {
    font-size: 14px;
  }

  #leaf-column .popular-ranking-block .article-ranking span.date {
    font-size: 11px;
  }
}

/* ===============================================================================

 以下 resp.css 移植 2024.5

=============================================================================== */


/* ===============================================================================

 CNET Japan responsive setteing

=============================================================================== */


@charset "UTF-8";

body {
  min-width: 100%;
}

img {
  max-width: 100%;
  height: auto;
}


#page-wrap-resp,
#header-wrap-resp,
#nav-wrap-resp,
#footer-wrap-resp {
  display: none;
}


/* ===============================================================================

 responsive setting 960px

=============================================================================== */


@media screen and (max-width: 960px) {

  /* common ----------------------------------------------------------------*/
  body {
    font-family: "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "游ゴシック Medium", Yu Gothic Medium, YuGothicM, "游ゴシック体", YuGothic, sans-serif !important;
  }

  #header-wrap,
  #footer-wrap {
    display: none;
  }


  #header-global-resp { /*202403 add*/
    position: sticky;
    width: 100%;
    height: 56px;
    top: 0;
    z-index: 10000;
  }

  /*#mini_slider {
    margin-top: 55px;
  }*/
  /*202403 add*/
  #header-wrap-resp,
  #header-wrap-resp .logo,
  #nav-wrap-resp,
  #footer-wrap-resp,
  #page-wrap,
  #column-content-block {
    width: 100%;
    display: block;
  }


  #pageTop a {
    display: none;
  }


  /* header ----------------------------------------------------------------*/
  #header-wrap-resp {
    position: fixed;
    top: 0;
    width: 100%;
    height: 56px;
    background-color: #050505; /*202403*/
    z-index: 10000;
  }


  #header-wrap-resp .header-logo-resp {
    position: absolute;
    top: 20px;
    left: 50px;
  }

  /*#header-wrap-resp .header-logo-resp img{
      text-align:left;
      float:left;
      margin:20px 0 0 50px;
  }*/
  #header-wrap-resp .header-nav-id,
  #header-wrap-resp .header-nav-search {
    float: right;
  }

  #header-wrap-resp .header-nav-search {
    display: inline-block;
    /*width: 50px;
    height: 50px;
    font-size:50px;
    position: relative;*/
    cursor: pointer;
  }

  #header-wrap-resp .header-nav-id span {
    display: block;
    /*background-color: #e71d1d;*/
    color: #fff !important;
    /*margin: 11px 0;*/
    /*padding: 6px 15px;*/
    /*border-radius: 5px;*/
    font-size: 12px;
    margin: 12px 10px;
    position: relative;
  }

  /*202404 add*/
  #header-wrap-resp .header-nav-search span {
    display: block;
    /*border: 1px solid #fff;
    border-radius: 5px;
    margin: 5px;
    padding: 5px;
    width: 30px;
    height: 30px;*/
    width: 50px;
    height: 50px;
    font-size: 50px;
    position: relative;
  }

  /*202404 add*/
  #header-wrap-resp .header-nav-search span:before {
    position: absolute;
    display: block;
    content: "";
    top: 15px;
    left: 25%;
    width: 30%;
    height: 30%;
    border-radius: 50%;
    border: 3px solid #ffffff;
  }

  /*202404 add*/
  #header-wrap-resp .header-nav-search span:after {
    position: absolute;
    display: block;
    content: "";
    top: 60%;
    left: 50%;
    width: 25%;
    height: 5%;
    background: #ffffff;
    margin: 5px 0 0 3px;
    transform: rotate(45deg);
  }

  /*202404 add*/
  #header-wrap-resp .header-nav-id span:hover,
  #header-wrap-resp .header-nav-search span:hover {
    cursor: pointer;
    opacity: 0.85;
  }

  /*202404 add*/
  #header-wrap-resp .header-nav-id span a,
  #header-wrap-resp .header-nav-search span a {
    color: #fff !important;
  }

  /*202404 add*/
  /*id*/
  #header-wrap-resp .header-nav-id .menu-id {
    width: 100%;
    background-color: #333;
    margin: 0 auto;
    text-align: center;
    z-index: 9999;
    position: absolute;
    top: 56px;
    left: 0;
  }

  #header-wrap-resp .header-nav-id .menu-id li {
    width: 100%;
    border-bottom: 1px solid #444;
    /*border-bottom:1px solid #666;*/
    /*box-shadow:0 1px 0 #d0d0d0;*/
    padding: 3% 0;
  }

  #header-wrap-resp .header-nav-id .menu-id li:last-child {
    border-bottom: none;
  }

  #header-wrap-resp .header-nav-id .menu-id li a {
    color: #fff;
  }

  #header-wrap-resp .header-nav-id .menu-id li a:hover {
    color: #bcd7df !important;
  }


  /* 202409 add */
  #header-wrap-resp .header-nav-id .dli-user {/*user icon*/
  display: inline-block;
  vertical-align: middle;
  color: #fff;
  line-height: 1;
}

  #header-wrap-resp .header-nav-id .dli-user::before, .dli-user::after {
  content: '';
  display: block;
  margin: 0 auto;
  border: 3px solid currentColor;
  box-sizing: border-box;
}

  #header-wrap-resp .header-nav-id .dli-user::before {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  margin-bottom: 0.05em;
}

  #header-wrap-resp .header-nav-id .dli-user::after {
  width: 32px;
  height: 13px;
  border-bottom: 0;
  border-radius: 50% / 100% 100% 0 0;
}


  #header-wrap-resp .header-nav-search .search-box-resp {
    width: 100%;
    background-color: #333;
    position: absolute;
    top: 56px;
    left: 0;
    z-index: 9999;
    text-align:center;
  }

  .search-box-resp .searchBtn {
    border-radius: 10px;
    -webkit-border-radius: 10px;
    background: #ffffff;
    border: none !important;
    /*margin:0 25px;*/
    padding: 15px;
    background: url(//www.google.com/cse/static/ja/google_custom_search_watermark.gif) 3px center no-repeat rgb(255, 255, 255);
    width: 90%;
  }


  .search-box-resp .hcd_btn_scope {
    background: url(/media/c/2012/images/responsive/spritesheet.png) no-repeat;
    background-position: -5px -5px;
    border: none;
    cursor: pointer;
    line-height: 0;
    text-indent: -9999px;
    position: absolute;
    top: 35%;
    right: 3%;
    width: 30px;
    height: 30px;
  }


  /* header-nav-menu responsive add 202403 ----------------------------------------------------------------*/

  #header-wrap-resp .header-menu-area {
    width: 100%;
    position: absolute;
    top: 10px;
    left: 0;
    padding: 0;
    z-index: -1;
  }

  #header-wrap-resp .header-menu-area .header-menu-hamburger {
    width: 100%;
    display: flex;
    justify-content: center;
    height: 100%;
    overflow-y: scroll;
  }


  #header-wrap-resp .header-menu-area .header-menu-hamburger li {
    width: 100%;
    margin: 10px auto;
    color: #fff;
    font-size: 12px;
    text-align: center;
    z-index: 100;
    position: absolute;
    top: 0;
    left: 0;
  }

  #header-wrap-resp .header-menu-area .header-menu-hamburger li:hover {
    cursor: pointer;
  }


  #header-wrap-resp .header-menu-area .header-menu-hamburger li span:first-child,
  #header-wrap-resp .header-menu-area .header-menu-hamburger li span:nth-child(2),
  #header-wrap-resp .header-menu-area .header-menu-hamburger li span:nth-child(3) {
    width: 20px;
    height: 2px;
    background-color: #fff;
    margin-bottom: 5px;
    margin-left: 10px;
    display: block;
  }


  #header-wrap-resp .header-menu-area .header-menu-hamburger .menu-primary {
    width: 100%;
    background-color: #050505;
    margin: 0;
    height: 100%;
    overflow-y: scroll;
    position: fixed;
    z-index: 9999;
  }


  #header-wrap-resp .header-menu-area .header-menu-hamburger .menu-primary .menu-primary-inner {
    padding: 15px 6%;
  }

  #header-wrap-resp .header-menu-area .header-menu-hamburger .menu-primary .menu-primary-inner:first-child {
    padding: 10% 6% 15px;
  }

  #header-wrap-resp .header-menu-area .header-menu-hamburger .menu-primary .menu-primary-inner:last-child {
    padding: 15px 6% 20%;
  }

  #header-wrap-resp .header-menu-area .header-menu-hamburger .menu-primary .menu-primary-inner.flex {
    display: flex;
    flex-wrap: wrap;
  }

  #header-wrap-resp .header-menu-area .header-menu-hamburger .menu-primary .menu-primary-inner.flex li{
  width:50%;
  }

  #header-wrap-resp .header-menu-area .header-menu-hamburger .menu-primary .menu-primary-inner.line-border {
    border-bottom: 1px dotted #444;
    margin-bottom: 10px;
  }

  #header-wrap-resp .header-menu-area .header-menu-hamburger .menu-primary li {
    margin: 0;
    padding: 5px 0;
    font-size: 140%;
    text-align: left;
    width: 100%;
    display: block;
  }

  #header-wrap-resp .header-menu-area .header-menu-hamburger .menu-primary li a {
    color: #fff;
  }

  #header-wrap-resp .header-menu-area .header-menu-hamburger .menu-primary li.parent-menu,
  #header-wrap-resp .header-menu-area .header-menu-hamburger .menu-primary li.child-menu {
    position: relative;
  }

  #header-wrap-resp .header-menu-area .header-menu-hamburger .menu-primary li.parent-menu {
    padding: 5px 0 10px;
    font-weight: bold;
    font-size: 170%;
    width: 100%;
  }

  #header-wrap-resp .header-menu-area .header-menu-hamburger .menu-primary li.parent-menu:hover {
    cursor: default;
  }


  /* header-nav-menu add 202403 end */


  /* navigation responsive　----------------------------------------------------------------*/

  #nav-wrap-resp {
    margin-top: 56px;
    position: relative;
    z-index: 1000;
  }

  #nav-wrap-resp .nav-content ul{
    width: 100%;
    position: relative;
    display: flex;
    justify-content: space-around;
    padding: 0;
    background-color: #050505;
    border-top:1px solid #333;
  }


  #nav-wrap-resp .nav-content ul li {
    width: 16%;
    margin: 0;
    font-size: 13px;
    text-align: center;
    background-color: #050505;
    z-index: 100;
  }

#nav-wrap-resp .nav-content ul li.menu-category-primary{/*category*/
    width: 27%;
}
#nav-wrap-resp .nav-content ul li.menu-deep-primary{/*deep*/
    width: 23%;
}


  #nav-wrap-resp .nav-content ul li:hover {
    cursor: pointer;
  }


  /*#nav-wrap-resp .nav-content ul li span {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    text-align: center;
    margin: 0 auto;
    height: 35px;
  }*/


  #nav-wrap-resp .nav-content ul li a,
  #nav-wrap-resp .nav-content ul li span {
    color: #fff;
    padding: 10px 0;
    display: block;
    position: relative;
    width:100%;
z-index:1000;
  }

  #nav-wrap-resp .nav-content ul li a:hover,
  #nav-wrap-resp .nav-content ul li span:hover {
    color: #e71d1d !important;
  }


  #nav-wrap-resp .nav-content ul ul{
    display: block;
    border-top:none;
    width:100%;
  }

  #nav-wrap-resp .nav-content ul ul li{
    width:100%;
    font-size: 12px;
    /*width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);*/
  }



  #nav-wrap-resp .nav-content ul ul li small{
    font-size:12px;
  }


  #nav-wrap-resp .nav-content ul ul.menu-primary,
  #nav-wrap-resp .nav-content ul li span a > ul.menu-primary,
  #nav-wrap-resp .nav-content ul ul.menu-category,
  #nav-wrap-resp .nav-content ul li span a > ul.menu-category,
  #nav-wrap-resp .nav-content ul ul.menu-share,
  #nav-wrap-resp .nav-content ul li span a > ul.menu-share {
    /*display: block;*/
    display: none;
  }


  #nav-wrap-resp .nav-content .menu-primary,
  #nav-wrap-resp .nav-content .menu-category,
  #nav-wrap-resp .nav-content .menu-share {
    width: 100%;
    height: auto;
    background-color: #fff;
    margin: 0 auto;
    text-align: center;
    position: absolute;
    top: 100%;
    left: 0;
    transition: all 0.3s;
    z-index: 9999;
  }

  #nav-wrap-resp .nav-content .menu-primary li,
  #nav-wrap-resp .nav-content .menu-category li,
  #nav-wrap-resp .nav-content .menu-share li {
    width: 100%;
    /*border-bottom:1px solid #666;*/
    border-bottom: 1px solid #e5e5e5;
    /*box-shadow:0 1px 0 #d0d0d0;*/
    padding: 20px 0;
  }

  #nav-wrap-resp .nav-content .menu-category li {
    width: 100%;
  }


  #nav-wrap-resp .nav-content .menu-share .menu-fb {
    background-color: #3564A2;
  }

  #nav-wrap-resp .nav-content .menu-share .menu-tw {
    background-color: #1DA1F2;
  }

  #nav-wrap-resp .nav-content .menu-share .menu-rss {
    background-color: #EB6207;
  }

  #nav-wrap-resp .nav-content .menu-share .menu-podcast {
    background-color: #aa1801;
  }

  #nav-wrap-resp .nav-content .menu-share a:hover {
    color: #000 !important;
  }

  /* expand navi */
  .menu-id,
  .search-box-resp,
  .menu-primary,
  .menu-category,
  .menu-share {
    max-height: 0px;
    transition: all 300ms 0s ease;
    overflow: hidden;
  }


  .active_search {
    max-height: 420px !important;
    padding: 3% 0 !important;
  }

  .active_id {
    max-height: 420px !important;
  }

  .active_primary {
    max-height: 1300px !important;
  }

  .active_category {
    max-height: 550px !important;
  }

  .active_share {
    max-height: 300px !important;
  }


/* expand navi category deep*/
#nav-wrap-resp .nav-content .menu_category,
#nav-wrap-resp .nav-content .menu_deep{
  max-height: 0px;
  transition: all 300ms 0s ease;
  overflow: hidden;
}


#nav-wrap-resp .nav-content .active_category_primary{
  max-height: 500px;
  padding-bottom:15px;
}

#nav-wrap-resp .nav-content .active_deep_primary{
  max-height: 150px;
  padding-bottom:15px;
}



  /* footer ----------------------------------------------------------------*/
  #footer-wrap-resp span {
    margin-bottom: 3%;
    display: block;
    font-size: 90%;
    text-align: left;
  }


  #footer-wrap-resp .footer-terms {
    background-color: #a4a4a4;
    color: #fff;
    padding: 5% 3%;
    line-height: 1.4;
  }

  #footer-wrap-resp .footer-terms a {
    display: block;
    text-align: center;
    color: #fff;
    border-top: 1px solid #ccc;
    padding: 3% 0 0 0;
    text-align: center !important;
  }

  #footer-wrap-resp .footer-copy {
    background-color: #000;
    color: #fff;
    padding: 3%;
  }


  /* contents ----------------------------------------------------------------*/
  /* parts */
  /*#content-top-block .ad {
    margin-top: 56px;
  }*/
  #content-bottom-block {
    min-width: 100%;
  }

  .content-ttl,
  .content-ttl-s,
  .content-list-date,
  .event-date,
  .relase-date {
    /*text-align: center;*/
    text-align: left;
    padding-left: 10px !important;
    position: relative;
  }


  .content-ttl,
  .content-ttl-s {
    text-align: center;
  }


  #content-navigation-block ul {
    display: block;
  }


  #content-navigation-block ul li a, #content-navigation-block .content-menu-more {
    display: block;
    width: 100%;
    margin: 0 auto;
    padding: 20px 0;
    text-align: center;
    border-bottom: 1px solid #ccc;
  }


  #pagination {
    display: inline-block;
  }

  #pagination ul {
    width: 100%;
    margin: 0 auto !important;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  #pagination li {
    width: 15%;
    height: 30px;
    line-height: 30px;
    font-size: 110%;
    float: none;
    padding: 5px 0 !important;
    border: 1px solid #ccc;
  }

  #pagination li a {
    padding: 0;
    border: none;
  }

  #pagination li.next {
    width: 30% !important;
    background-color: #999;
  }

  #pagination li.next a {
    padding: 0;
    background: none;
  }


  #pagination .pre a:after, #pagination .next a:after {
    display: none;
  }


  .content-more a, .content-article-more a {
    border-radius: 4px;
    text-align: center;
    background-color: #454545;
    border: 1px solid #454545;
    box-shadow: 0 0 1px rgba(0, 0, 0, 0.1);
    color: #fff;
    font-size: 18px;
    font-weight: bold;
    cursor: pointer;
    padding: 25px 0;
    display: block;
    width: 98%;
    margin: 0 auto 5%;
  }


  .content-ttl .pr {
    position: absolute;
    top: 10px;
    right: 2px;
  }


  /*layout*/
  #page-wrap .ad-item {
    width: 100%;
  }

  #content-top-block .item, #content-bottom-block .item {
    width: 100%;
  }

  #page-wrap .ad-item img {
    max-width: 100%;
  }

  #content-top-block .item img, #content-bottom-block .item img {
    max-width: 100%;
  }

  #leftside-column, #center-column, #rightside-column {
    width: 100%;
    order: 0 !important;
    margin: 0 auto;
  }


  #leftside-column ul, #center-column ul, #rightside-column ul {
    margin: 0 2%;
    padding: 15px 0;
  }


  .inner-bg, .inner-pr {
    margin: 0 0 2% 0;
  }


  .inner-bg {
    padding: 15px 0;
  }

  .inner-pr {
    padding: 2% 2% 0 2%;
    min-height: 94px;
  }


  #leftside-column .left-navigation-block li a {
    text-align: center;
    /*text-align:left;*/
    padding-left: 0;
  }


  #rightside-column .right-ad-block {
    width: 100%;
    margin: 3% auto;
  }

  #rightside-column .right-ad-block img {
    text-align: center;
  }


  #rightside-column iframe {
    /*width:100%;*/
    margin: 0 auto;
  }

  #rightside-column ul.photorepo-inner {
    margin: 0 auto !important;
    width: 70%;
  }

  #rightside-column ul.photorepo-inner img {
    width: 100%;
  }


  #column-content-block #leaf-column {
    width: 100%;
    order: 0;
    margin: 0 auto;
  }


  #leaf-column {
    width: 100%;
    order: 0;
    margin: 0 auto;
  }


#leaf-column .leaf-headline-top{
  display:block;
}

#leaf-column .leaf-headline-ttl {
  font-size: 1.75rem;
}


  #leaf-column ul {
    margin: 0 2%;
    padding: 0;
  }

  #leaf-column .leaf-article-inner {
    margin: 0 2% 20px;
  }


  .leaf-item-inner .item-word {
  / / width: 100 %;
    padding: 2% !important;
  }


  .content-article-inner .content-article-full, .content-article-inner .content-article-left, .content-article-inner .content-article-right {
    width: 100%;
    /*max-width: 580px;*/
    float: none;
    text-align: center;
    margin: 0 auto;
  }


  .content-article-left .content-article-img,
  .content-article-right .content-article-img,
  .content-article-center .content-article-img {
    margin: 0 auto;
  }

  /*.content-article-full .content-article-img,*/
  .sp_full .content-article-img {
    width: 100%;
    /* height: auto; */
    aspect-ratio: 16 / 9; /*202208*/
  }


  .content-article-inner {
    margin-bottom: 0;
  }

  .content-article-inner div:last-child {
    margin-bottom: 3%;
  }

  .content-article-full .content-article-img, .content-article-left .content-article-img, .content-article-right .content-article-img, .content-article-center .content-article-img {
    width: 100%;
    height: auto;
    margin: 0 auto;
  }

  .content-article-img img {
    position: relative;
    top: 0;
    left: 0;
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
    width: 100%;
    height: auto;
    margin-top: 20px;
  }

  .content-article-full .content-article-img a::after {
    display: none;
  }


  .content-article-full.sp_mini_list .content-article-text {
    bottom: 0;
  }

  .content-article-left .content-article-text,
  .content-article-right .content-article-text {
    width: 98%;
    padding: 0;
    position: relative;
  }


  .content-article-full .content-article-text {
    position: relative;
    /*background-color:#ffffff;*/
    width: 100%;
    bottom: 0;
  }


  .content-article-full .content-article-text .text-main {
    padding: 0;
    font-size: 18px;
    line-height: 1.4;
    color: #252525;
    letter-spacing: 0.05em;
    text-align: left;
    /*margin:0 2%;*/
  }

  .content-article-full .content-article-text span.date {
    position: static;
    margin-top: 0;
  }

  .content-article-left .content-article-text .text-main,
  .content-article-right .content-article-text .text-main,
  .content-article-center .content-article-text .text-main {
    text-align: left;
    margin: 0 2%;
  }


  .content-media-inner {
    padding: 0 2%;
  }


  #tieup_control_sp {
    display: block;
  }


  #l_img_main img {
    max-width: 100% !important;
  }


  #leaf-column .leaf-article-inner .leaf_body_foot p {
    text-align: left;
  }


  /* add tablet -----------------------------------------------------------*/
  #mini_slider {
    background-color: #FFFFFF;
    position: relative;
  }


  .content-ttl {
    padding: 3%;
    text-align: center;
  }

  .content-article-inner {
    padding: 0 3%;
    text-align: center;
  }

  .content-article-inner div:last-child {
    margin-bottom: 0;
  }

  .content-article-inner .content-article-full,
  .content-article-inner .sp_full, {
    position: relative;
    overflow: hidden;
  }

  .content-article-inner .content-article-center {
    width: 100%;
  }

  .content-article-inner .sp_full .content-article-img a:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.0) 40%, rgba(0, 0, 0, 0.9) 100%);
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.0) 40%), to(rgba(0, 0, 0, 0.9) 100%));
    background: linear-gradient(rgba(0, 0, 0, 0.0) 40%, rgba(0, 0, 0, 0.9) 100%);
    width: 100%;
    height: 100%;
    display: block;
  }


  .content-article-inner .sp_full {
    padding: 15px 0;
    border-bottom: 1px solid #ccc;
  }

  .content-article-inner .sp_mini_list {
    /*padding:15px 0 10px;*/
    padding: 15px 0 40px;
    border-bottom: 1px solid #ccc;
    display: flex; /*202208*/
  }


  .content-article-inner .sp_full .content-article-text .text-main a {
    position: absolute;
    left: 0;
    bottom: 100px;
    /*bottom:30px;*/
    color: #fff;
    padding: 0 45px;
  }


  .content-article-inner .sp_mini_list .content-article-img {
    max-width: 30%;
    /*float:left;*/
    margin-right: 10px;
    /*z-index:2;*/
  }

  .content-article-inner .sp_full .content-article-img img,
  .content-article-inner .sp_mini_list .content-article-img img {
    margin-top: 0;
  }

  .content-article-inner .sp_mini_list .content-article-text .text-main {
    font-size: 16px;
    height: 70%; /*202405*/
    margin: 0; /*202405*/
  }


  .content-article-inner .sp_mini_list .content-article-text .text-main a {
    position: static !important;
    color: inherit;
  }


  .content-article-more {
    margin: 10px auto 0;
    width: 95%;
  }


  .sp_full .content-article-text span.date {
    position: static;
    /*position:absolute;
    bottom:15px;
    right:0;
    bottom:-20px;
    right:3px;*/
  }

  .sp_mini_list .content-article-text span.date {
    position: static;
    /*position:absolute;
    bottom:0;
    right:3px;*/
  }


  .content-article-pr {
    background-color: #f0f0f0;
    margin: 15px auto 0;
    padding-bottom: 10px;
  }


  .content-article-full .content-article-text span.pr,
  .content-article-center .content-article-text span.pr,
  .content-article-left .content-article-text span.pr,
  .content-article-right .content-article-text span.pr {
    color: #aa1801;
    text-align: left !important;
    font-weight: normal;
  }


  .content-article-full .content-article-text span.pr { /*202406*/
    padding: 0;
  }


  /* add tablet end-----------------------------------------------------------*/
  /*index*/
  #content-navigation-block {
    display: none
  }


  #content-top-block {
    padding: 10px 0;
  }


  /*index slider*/
  #slider {
    display: none
  }

  #mini_slider {
    display: block !important
  }

  #mini_slider {
    /*background-color:#f0f0f0;*/
    padding-bottom: 10px;
  }


  /*leaf*/
  #leaf-column #social_bkm_wrap_top {
    padding: 10px 0;
  }

  #leaf-column .leaf-social-inner .social-item {
    margin: 0 2% 30px;
  }


  /*archive*/
  a.nav-archive {
    width: 100%;
    margin: 20px auto;
    text-align: center;
    background-color: #f4f4f4;
    padding: 30px 0;
  }


  a.nav-archive::after {
    top: 70%;
    left: 50%;
  }


  /*marketers*/
  #marketers_header .marketers_header_inner {
    width: 100%;
    width: 728px;
    margin: 0 auto;
  }

  #marketers_header .sub_logo {
    display: none;
  }

  #marketers_header #leaderboard-top {
    text-align: center;
  }

  .content-sp-inner .sp-relation {
    margin: 2% 0 !important;
    padding: 2% !important;
  }


  .content-sp-inner .sp-relation li {
    margin-bottom: 2% !important;
  }


  /*blog*/
  .leaf-blog-inner {
    margin: 0 2%;
  }

  #blogger_profile .author_img {
    display: block;
    text-align: center;
    margin: 0 auto;
  }

  #blogger_profile h4 {
    text-align: center;
  }

  #blogger_profile > div {
    margin: 0 2%;
  }

  /*panel*/
  .paneler-block {
    margin: 0 auto 15px !important;
  }

  .panel_top_list li {
    padding: 15px 0;
  }


  /*digital*/
  .content-digital-inner img {
    float: none;
    text-align: center;
    margin: 3% auto;
    display: block;
  }


  .content-digital-inner p, .content-digital-inner dl {
    margin-left: 0;
  }

  .content-digital-inner .prod_name {
    line-height: 1.4;
  }


  .case-box {
    width: 40%;
    margin: 0 5px 10px !important;
  }


  /*stream*/
  .header_stream .left_area {
    float: none;
    width: 100%;
    overflow: hidden;
  }

  .header_stream .left_area a {
    display: block;
    margin: 10px auto;
  }

  .header_stream .tumnb {
    margin: 10px auto;
  }

  .header_stream .tumnb a {
    float: none;
  }

  .header_stream .link_fb,
  .header_stream .link_twitter {
    width: 100%;
    padding: 2%;
    clear: both;
  }

  #shareBarHolder {
    width: 100%;
  }


  .video-container {
    position: relative;
    padding-bottom: 56.25%; /* ビデオの画面が16:9 */
    padding-top: 30px;
    height: 0;
    overflow: hidden;
  }

  .video-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }

  ul.tieup-inner {
    margin: 0 2%;
  }

  ul.tieup-inner li {
    width: 49%;
    margin-right: 1%;
    float: left;
  }

  ul.tieup-inner li b a {
    font-size: 14px;
  }

  ul.tieup-inner li p {
    font-size: 12px;
    padding-left: 0;
  }

  ul.tieup-inner li:nth-child(even) {
    margin: 0 0 21px 0;
  }


  /*cnet id member etc*/
  .cnet_id_guide .nav_point img {
    max-width: 40%;
  }

  .block_nlinfo {
    background-size: contain;
  }


  .block_nlinfo .regist .inner .button_wrap {
    width: 100%;
    display:block;
  }

  .block_nlinfo .login_button a,
  .block_nlinfo .regist_button a {
    float: none;
    margin: 10px auto;
    display: block;
  }

  .block_nlinfo .header h1 {
    width: 100%;
    height: 87px;
    float: none;
    background: url(/media/c/2012/images/bg/icon_nl.png) no-repeat center center;
    background-size: contain;
    margin: 10px auto;
  }

  .block_nlinfo .header h2 {
    width: 100%;
    height: 87px;
    float: none;
    background: url(/media/2007/info/newsletter/cnet_nl_headline.gif) no-repeat center center;
    background-size: contain;
    margin: 10px auto;
  }

  .block_nlinfo .other_nl .arrow {
    /*background-size: contain;*/
    margin: 10px auto;
  }

  .block_nlinfo .other_nl a.zdnet {
    width: 100%;
    background-size: contain;
    margin: 10px auto;
  }


  .feed_main ul.feed_list li {
    float: none;
    width: 95%;
  }


  /*登録*/
  .sitemap_page_wrap .resister_flow li {
    float: none;
    width: 95%;
  }

  .btn-id-regist {
    width: 90%;
    padding: 5% 3%;
  }


  /*ログイン*/
  .member fieldset {
    padding: 20px 5px;
  }

  .id-login-left, .id-login-right {
    width: 95%;
    margin: 0 auto;
    text-align: center;
    float: none;
  }


  /*マイページ*/
  @media screen and (max-width: 790px) {
    /*微調整*/
    .sub_nav {
      /*height: 75px;*/
      height: 200px;
    }

  }

  @media screen and (max-width: 380px) {
    /*微調整*/
    .sub_nav {
      /*height: 75px;*/
      height: 300px;
    }

  }


  .box_service {
    width: 30%;
  }


  .box_service img {
    text-align: center;
    display: block;
    margin: 10px auto;
  }

}

@media screen and (max-width: 640px) {
  /*微調整*/
  .box_service {
    width: 95%;
  }

  .box_service h3,
  .box_service p {
    text-align: center;
  }


}


/* ===============================================================================

 responsive setting 480px

=============================================================================== */


@media screen and (max-width: 480px) {


  /* header  ----------------------------------------------------------------*/
  /*#header-wrap-resp{
      height:40px;
  }*/
  #header-wrap-resp .header-logo-resp {
    top: 20px;
    left: 45px;
  }


  /* navigation ----------------------------------------------------------------*/
  #nav-wrap-resp {
    height: 40px;
  }

  #nav-wrap-resp .nav-content {
    padding: 0;
  }

  /*#nav-wrap-resp .nav-content li span{
       height:40px;
   }*/
  #nav-wrap-resp .nav-content li span a {
    /*top:22px;*/
    font-size: 85%;
  }

  /*#nav-wrap-resp .nav-content li.nav-menu span{
      background-position:center -460px;
  }
  #nav-wrap-resp .nav-content li.nav-category span{
      background-position:center -500px;
  }
  #nav-wrap-resp .nav-content li.nav-marketers span{
      background-position:center -540px;
  }
  #nav-wrap-resp .nav-content li.nav-share span{
      background-position:center -580px;
  }
  #nav-wrap-resp .nav-content li.nav-sp span{
      background-position:center -680px;
  }*/
  .search-box-resp .hcd_btn_scope {
    top: 30%
  }

  #nav-wrap-resp .menu-primary li a,
  #nav-wrap-resp .menu-category li a,
  #nav-wrap-resp .menu-share li a {
    font-size: 90% !important;
  }


  /*-----------------------------------------------------------------------------
    header logo style add 202006
  -----------------------------------------------------------------------------*/
  #header-wrap-resp .category_logo a {
    display: block;
    position: absolute;
    top: 5px;
    left: 140px;
    background-size: 90%;
  }


  /* contents ----------------------------------------------------------------*/
  #pagination li {
    width: 7.5%;
    font-size: 100%;
  }


  .content-category-inner {
    margin: 0;
  }


  /*leaf*/
  #leaf-column .leaf-headline-ttl {
    padding: 10px;
  }

  #leaf-column .leaf-headline-thumb {
    width: 100px;
    height: 56px;
    margin: 15px 10px 0 10px;
  }

  #leaf-column .leaf-icon-tags {
    padding: 3px;
  }


  #leaf-column .leaf-social-inner {
    display: block;
    position: relative;
    z-index: 1;
    margin-bottom: 0;
  }


  .leaf-social-inner #social_bkm_wrap_top,
  .leaf-social-inner .social-item {
    /*width:100%;*/
    width: auto;
  }

  #leaf-column .leaf-social-inner ul {
    /*width:100%;*/
    width: 96%;
    /*overflow: hidden;*/
  }

  #leaf-column #social_bkm_wrap_top {
    height: auto !important;
  }

  #leaf-column .leaf-social-inner .social-item {
    /*margin:2% 2% 0;*/
    margin: 0;
  }


  #leaf-column .leaf-social-inner .social-item-bottom {
    margin: 2% 2% 0;
    justify-content: flex-end;
  }


  #leaf-column .leaf-social-inner .social-item li {
    margin: 4px 2px !important;
    /*padding: 2px 0;*/
    height: 16px;
  }


  #leaf-column .leaf-article-inner .left,
  #leaf-column .leaf-article-inner .right {
    text-align: center;
    float: none;
    width: 100%;
    margin: 0 auto;
    display: block;
  }

  .profile10 .authorarea {
    background-size: auto !important;
  }


  /*Core Web Vital対応 202104*/
  .leaf_style .ad_large > div {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    min-height: 100px;
  }


  /*Core Web Vital対応 202104*/
  .leaf-headline-block .inner-pr {
    display: flex;
    flex-wrap: wrap;
    flex-direction:column;
  }


  .ad_text_top a:before, .ad_text_bottom a:before { /*pr*/
  / / border-right: none;
    text-align: center;
  / / display: block;
  }

  .ad_text_top, .ad_text_bottom {
    border-bottom: 1px solid #fff;
  }


  #slideShowThumbNav { /*フォトレポ*/
      /* display: none; */ 
  }

  #slideShowMain .galleryImage a.mediaPrev, #slideShowMain .galleryImage a.mediaNext {
    margin-top: 0;
  }


  #layout3media { /*サムネイル*/
    width: 98%;
    margin: 0 auto;
  }

  #layoutmedia_wrap ul#layoutmedia li {
    float: none;
    text-align: center;
    margin: 0 auto;
    width: 100%;
  }

  #layoutmedia_wrap ul#layoutmedia li a.media_l {
    width: 150px;
    margin: 0 auto;
  }


  ul.tieup-inner li {
    width: 100%;
    float: none;
  }

  ul.tieup-inner li:nth-child(even) {
    margin: 0;
  }


  /*marketers*/
  #marketers_header {
    width: 100%;
  }

  #marketers_header .marketers_header_inner {
    width: 100%;
    margin: 0 auto;
  }

  #marketers_header .sub_logo {
    text-align: center;
    margin: 0 auto;
    float: none;

  }

  #marketers_header #leaderboard-top {
    display: none;
  }


  /*sp*/
  .content-sp-inner img {
    max-width: 30%;
    margin-top: 1%;
  }


  /*tag*/
  .tag_list {
    margin: 0 !important;
  }

  .tag_list li {
    width: 40%;
  }


  /*blog*/
  .content-inner .box-blogger li {
    float: none;
    width: 100%;
    padding: 0 2%;
  }


  .leaf-blog-inner embed {
    width: 100% !important;
  }

  /*panel*/
  .paneler-box img {
    float: none;
    margin: 0 auto;
    text-align: center;
    display: block;
  }


  .panel_question .more a {
    float: none;
    display: block;
    width: 90%;
    margin: 0 auto;
    text-align: center;
    background-color: #d0d0d0;
  }

  .paneler-block {
    margin: 0 !important;
  }


  /*digital*/
  .product-box {
    text-align: center;
  }

  @media screen and (max-width: 320px) {
    /*微調整*/
    .case-box {
      width: 90%;
    }
  }


  /*app review*/
  .app_info_temp .download_btn,
  .app_info_area .download_btn {
    position: static;
    /*float:none;*/
    width: 100%;
    margin: 15px auto 0;
    text-align: center;
  }


  /*cnet id member etc*/
  h2.t_category {
    font-size: 120%;
  }

  .cnet_id_guide .nav_point {
    flex-direction: column;
  }

  .cnet_id_guide .nav_point li {
    border-bottom: 1px dotted #ccc;
    padding: 7px 0;
  }

  .cnet_id_guide .nav_point li:last-child {
    border-bottom: none;
  }

  .cnet_id_guide .nav_point li a {
    text-align: center;
    margin: 0 auto;
  }

  .cnet_id_guide .nav_point img {
    display: none;
  }


  #mypage_top,
  #mypage_sub {
    margin-bottom: 25px;
  }


  #profile_form .form_table th,
  #profile_form .form_table td,
  #profile_form .table_mail th,
  #profile_form .table_mail td {
    display: block;
  }

  #profile_form .form_table th,
  #profile_form .table_mail th {
    width: 95%;
    font-size: 120%;
  }

  #mypage_top .form_table select {
    width: 80%;
  }

  #profile_form form input,
  #profile_form input,
  #profile_form select {
    width: 90%;
  }


  .resign_info textarea {
    width: 100%;
  }


  /*sitemap*/
  .sitemap_page_wrap .sitemap_page_left,
  .sitemap_page_wrap .sitemap_page_middle,
  .sitemap_page_wrap .sitemap_page_right {
    float: none;
    width: 96%;
    padding: 0 2%;
  }

  .sitemap_page_wrap dl.contact dt {
    width: 90%;
  }

  /*company*/
  .leaf_ttl_link {
    padding: 3%;
    font-size: 120%;
    line-height: 1.8;
  }


  /* leaf-photo */
  #leaf-column .leaf-item-inner .leaf_layout_3box .photo_box {
    width: 95%;
    float: none;
    overflow: hidden;
    margin: 0 0 10px;
    font-size: 110%;
  }

  #leaf-column .leaf-item-inner .leaf_layout_3box img {
    max-width: 30%;
    float: left;
    margin-right: 15px;
  }


  /* 2018.11 sp renew -----------------------------------------------------------*/
  #mini_slider {
    background-color: #FFFFFF;
  }


  .content-ttl {
    padding: 3%;
    text-align: center;
  }

  .content-article-inner {
    padding: 0 3%;
    text-align: center;
  }

  .content-article-inner div:last-child {
    margin-bottom: 0;
  }

  .content-article-inner .content-article-full,
  .content-article-inner .sp_full, {
    position: relative;
    overflow: hidden;
  }

  .content-article-inner .content-article-center {
    width: 100%;
  }

  .content-article-inner .sp_full .content-article-img a:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.0) 40%, rgba(0, 0, 0, 0.9) 100%);
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.0) 40%), to(rgba(0, 0, 0, 0.9) 100%));
    background: linear-gradient(rgba(0, 0, 0, 0.0) 40%, rgba(0, 0, 0, 0.9) 100%);
    width: 100%;
    height: 100%;
    display: block;
  }


  /*.content-article-inner .sp_full,
  .content-article-inner .sp_mini_list{
  padding:15px 0 10px;
  border-bottom:1px solid #ccc;
  }*/
  .content-article-inner .sp_full .content-article-text .text-main a {
    position: absolute;
    left: 0;
    bottom: 80px;
    color: #fff;
    padding: 0 15px;
  }


  .content-article-inner .sp_full > .content-article-text > span {
    margin-top: 0 !important;
  }


  .content-article-inner .sp_mini_list .content-article-img {
    max-width: 35%;
    margin-right: 10px;
  }

  .content-article-inner .sp_full .content-article-img img,
  .content-article-inner .sp_mini_list .content-article-img img {
    margin-top: 0;
  }

  .content-article-inner .sp_mini_list .content-article-img {
    /*z-index:2;*/
  }

  .content-article-inner .sp_mini_list .content-article-text .text-main {
    font-size: 14px;
  }

  .content-article-more {
    margin: 10px auto 0;
    width: 95%;
  }


  .content-article-text span.date,
  .sp_mini_list .content-article-text span.date {
    margin-top: 10px;
  }

  .content-article-pr {
    background-color: #f0f0f0;
    margin: 15px auto 0;
    padding-bottom: 10px;
  }

  .content-article-full .content-article-text span.pr,
  .content-article-center .content-article-text span.pr,
  .content-article-left .content-article-text span.pr,
  .content-article-right .content-article-text span.pr {
    color: #aa1801;
    text-align: left !important;
    font-weight: normal;
  }


  /*leaf*/
  #leaf-column .breadcrumbs-block {
    padding: 0 15px;
  }

  
  #leaf-column .leaf-headline-block{
  padding:0;
  }
  
  #leaf-column .leaf-head-wrap {
    padding: 0 15px;
  }

  #leaf-column .leaf-headline-ttl {
    font-size: 1.4rem;
    padding: 0;
  }


  #leaf-column .leaf-headline-thumb {
    display: none;
  }


  #leaf-column .leaf-headline-thumb-sp {
    display: block;
  }


  #leaf-column .leaf-article-inner {
    padding: 0 3% 20px;
  }


  .content-article-inner .sp_full .content-article-text .text-main a { /*202306 add 調整*/
    font-size: 16px;
    line-height: 1.3;
  }

}


/* ===============================================================================

 responsive 320px

=============================================================================== */


@media screen and (max-width: 320px) {

  /*-----------------------------------------------------------------------------
    header logo style add 202006
  -----------------------------------------------------------------------------*/
  #header-wrap-resp .category_logo a {
    display: block;
    position: absolute;
    top: 5px;
    left: 110px;
    background-size: 90%;
  }


}


/*----------------------------------------------------------------------------------------------------------

 workcation setting 2021

----------------------------------------------------------------------------------------------------------*/

@media screen and (max-width: 960px) {


  #workcation_slider {
    display: none;
    position: relative;
  }

  .workcation_slider ul li { /*responsive*/
    position: relative;
    overflow: hidden;
    margin-bottom: 20px;
  }

  .workcation_slider ul li a:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    background: linear-gradient(rgba(0, 0, 0, 0.0) 20%, rgba(0, 0, 0, 0.8) 80%);
    width: 100%;
    height: 100%;
    display: block;
    z-index: 1;
  }


  .workcation_slider ul li .article_title {
    position: absolute;
    left: 0;
    bottom: 0;
    font-size: 20px;
    font-weight: normal;
    padding: 25px 20px;
    line-height: 1.2;
    color: #ffffff;
    letter-spacing: 0.05em;
    z-index: 1;
  }

  .workcation_slider ul li .artcle_thumb {
    width: 100%;
    display: block;
  }

  .workcation_slider ul li .artcle_thumb img {
    width: 100%;
    height: auto;
  }


  .sub_logo .logo_workcation {
    position: relative;
    margin: 20px auto;
  }


  .workcation-main-block,
  .workcation-category-block,
  .workcation-area-block {
    width: auto;
    padding: 0 15px;
    position: relative;
    z-index: 1;
  }

  .workcation-main-block {
    margin: 10px 0 0 0;
  }


  .workcation-main-block li,
  .workcation-area-block li {
    width: 48%;
    height: auto;
    aspect-ratio: 16 / 9;
    margin: 0 0 30px 0;
  }


  .workcation-area-block li {
    width: 100%;
  }

  .workcation-main-block li a{
  width: 100%;
  }


  #leaf-column .workcation-main-block ul,
  #leaf-column .workcation-area-block ul {
    margin: 0 0 40px;
  }

  .workcation-area-block {
    padding: 0 3%;
  }

  .workcation-category-block li.article_list { /*202209*/
    margin-bottom: 20px;
    padding-bottom:0;
  }

  .workcation-category-block li.article_list .list_main { /*202209*/
    height: auto;
  }


  .workcation-category-block li.article_list .list_thumb {
    vertical-align: top;
    width: 200px;
    height: auto;
  }


  /* workcation top swiper add 202208 */
  .swiper-container-horizontal > .swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction {
    text-align: center;
    position: absolute;
    bottom: 5px !important;
    left: 0;
    width: 100%;
    z-index: 1000;
  }

  .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 5px !important;
    background: #fff;
  }

  .swiper-pagination-bullet-active {
    background: #aa1801 !important;
  }


  .swiper-container-workcation {
    position: relative;
  }


  .swiper-container-workcation .swiper-slide {
    aspect-ratio: 16 / 9;
    height: auto !important;
    overflow: hidden;
  }


  .swiper-container-workcation .swiper-slide .artcle_thumb {
    width: 100%;
    height: auto;
    display: block;
    position: relative;
    overflow: hidden;
  }

  .swiper-container-workcation .swiper-slide .artcle_thumb img {
    width: 100vw;
    height: auto;
    position: relative;
    transform: translate(0, -10%);
  }


  .swiper-container-workcation .swiper-slide .artcle_thumb:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.0) 40%, rgba(0, 0, 0, 0.9) 100%);
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.0) 40%), to(rgba(0, 0, 0, 0.9) 100%));
    background: linear-gradient(rgba(0, 0, 0, 0.0) 40%, rgba(0, 0, 0, 0.9) 100%);
    width: 100%;
    height: 100%;
    display: block;
  }


  .swiper-container-workcation .article_title {
    position: absolute;
    left: 0;
    bottom: 0;
    font-size: 18px;
    font-weight: normal;
    padding: 25px 20px;
    line-height: 1.2;
    color: #ffffff;
    letter-spacing: 0.05em;
    z-index: 1;

  }


}


@media screen and (max-width: 640px) {


  .workcation-category-block,
  .workcation-area-block {
    padding: 0;
  }


  .workcation_slider ul li .article_title {
    font-size: 16px;
  }


  .workcation-main-block h2,
  .workcation-category-block h2,
  .workcation-area-block h2 {
    font-size: 22px !important;
  }


  .workcation-main-block ul,
  .workcation-area-block ul {
    display: block;
    margin: 0 0 10px 0 !important;
  }

  .workcation-main-block li,
  .workcation-area-block li {
    width: 100%;
    height: auto;
    margin: 0 0 45px 0;
  }

  .workcation-main-block ul li {
    border-bottom: 1px solid #ccc;
    margin: 0 0 15px 0;
    padding: 0 0 15px 0;
    aspect-ratio: auto;
    position:relative;
    overflow: visible;
  }

  .workcation-main-block ul li a {
    display: flex;
    /*display: block;
    overflow:hidden;*/
    aspect-ratio: auto;
    overflow: visible;
  }

  .workcation-main-block ul li a:before {
    display: none;
  }

  .workcation-main-block ul li .artcle_thumb {
    max-width: 35%;
    /*margin-right:10px;
    float:left;*/
  }

  .workcation-main-block li .article_title {
    position: relative;
    font-size: 14px;
    font-weight: bold;
    line-height: 1.3;
    margin: 0 0 0 10px;
    padding: 0;
    color: #333;
  }


  .workcation-main-block a.more_list {
    margin-bottom: 20px;
  }


  .workcation-category-block li.article_list .list_main {
    height: auto;
  }


  .workcation-category-block li.article_list .list_thumb {
    max-width: 40%;
    height: auto;
margin-right:10px;
  }


  .workcation-category-block li.article_list .list_main .title {
    font-size: 14px;
  }


  .workcation-category-block li.article_list .list_main .summary {
    position: relative;
    /*display: block;*/
    display: none;
  }


  /* workcation top swiper add 202208 */
  .swiper-container-horizontal > .swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction {
    text-align: center;
  }


  .swiper-container-workcation {
    position: relative;
  }


  .swiper-container-workcation .swiper-slide .artcle_thumb:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.0) 40%, rgba(0, 0, 0, 0.9) 100%);
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.0) 40%), to(rgba(0, 0, 0, 0.9) 100%));
    background: linear-gradient(rgba(0, 0, 0, 0.0) 40%, rgba(0, 0, 0, 0.9) 100%);
    width: 100%;
    height: 100%;
    display: block;
  }


}

.rop-wrapper{ padding-bottom:20px; } /* cmer ad*/

/*----------------------------------------------------------------------------------------------------------
 floating banner setting 2022
----------------------------------------------------------------------------------------------------------*/

@media screen and (max-width: 800px) {

  #ad_float {
    display: block;
  }

  .floating_banner_area {
    position: relative;
    display: block;
    transition: .5s;
    z-index: 100;
  }

  .floating_banner_a {
    position: fixed;
    bottom: 10%;
    right: 15px;
    z-index: 100 !important;
  }

  .floating_banner_a .floating_box {
    width: 300px;
    height: auto;
    padding: 15px;
    background-color: #fff;
    box-shadow: 0 0 15px #999;
    display: flex;
    position: relative;
  }

  .floating_banner_b {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 100 !important;
  }

  .floating_banner_b .floating_box {
    padding: 20px;
    background-color: #f5f5f5;
    display: flex;
    position: relative;
  }

  .floating_banner_a .floating_box .thumb,
  .floating_banner_b .floating_box .thumb {
    width: 100px;
    height: auto;
    margin-right: 10px;
  }

  .floating_banner_b .floating_box .thumb {
    margin-left: 35px;
  }

  .floating_banner_a .floating_box .thumb img,
  .floating_banner_b .floating_box .thumb img {
    max-width: 100px;
  }

  .floating_banner_a .floating_box .content,
  .floating_banner_b .floating_box .content {
    font-size: 13px;
    color: #333;
    line-height: 1.4;
  }

  .floating_banner_a .floating_box .content span,
  .floating_banner_b .floating_box .content span {
    display: block;
  }

  .floating_banner_a .floating_box .title,
  .floating_banner_b .floating_box .title {
    font-weight: bold;
  }

  .floating_banner_a .floating_box .close_btn {
    position: absolute;
    top: -15px;
    right: -10px;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background-color: #444;
  }

  .floating_banner_a .floating_box .close_btn::before,
  .floating_banner_a .floating_box .close_btn::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 2px; /* 棒の幅（太さ） */
    height: 18px; /* 棒の高さ */
    background: #fff; /* バツ印の色 */
  }

  .floating_banner_a .floating_box .close_btn::before {
    transform: translate(-50%, -50%) rotate(45deg);
  }

  .floating_banner_a .floating_box .close_btn::after {
    transform: translate(-50%, -50%) rotate(-45deg);
  }

  .floating_banner_b .floating_box .close_btn {
    position: absolute;
    top: 10px;
    left: 5px;
    width: 36px;
    height: 36px;
  }

  .floating_banner_b .floating_box .close_btn::before,
  .floating_banner_b .floating_box .close_btn::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 3px; /* 棒の幅（太さ） */
    height: 28px; /* 棒の高さ */
    background: #666; /* バツ印の色 */
  }

  .floating_banner_b .floating_box .close_btn::before {
    transform: translate(-50%, -50%) rotate(45deg);
  }

  .floating_banner_b .floating_box .close_btn::after {
    transform: translate(-50%, -50%) rotate(-45deg);
  }

  .content_hidden {
    opacity: 0;
    visibility: hidden;
  }
}

/* ad*/
.rop-wrapper{ padding-bottom:20px; }

/* floating banner setting 2022 end -----------------------------------------------------------------------------*/

.id_change{
  font-size:90%;
  text-align: center;
}

/** GAM */
#ad_text {
  min-height: 60px;
}
#SPLASH {
  display: none;
}
#SKIN {
  display: none;
}
#FLOAT {
  display: none;
}
#INREAD_RICH {
  text-align: center;
}
#INREAD {
  text-align: center;
}
#INREAD2 {
  text-align: center;
}
#INREAD3 {
  text-align: center;
}
#INREAD4 {
  text-align: center;
}
#INREAD5 {
  text-align: center;
}
#INREAD6 {
  text-align: center;
}