@charset "utf-8";
/* CSS Document */

#contents .top {
width: 100%;
}

#wrapper{
width: 1024px;
margin: 86px auto 10px auto;
height:100%;
}

#header {
background-image: url(../images/bg_paper_new1.png);
background-repeat: repeat-x;
height: 75px;
width:100%;
position: fixed;
top: 0px;
left: 0px;
z-index:999999;
}

#top_nav {
background-color:#f2f2f2;
height: 25px;
width:100%;
position: fixed;
top: 75px;
left: 0px;
z-index:99999;
padding:10px;
-webkit-box-shadow: 0 5px 30px -10px rgba(0,0,0,1);
box-shadow: 0 5px 30px -10px rgba(0,0,0,1);

}


#site_logo {
position: absolute;
left: 10px;
top: 7px;
}
#mag_logo_box {
position: absolute;
left: 10px;
top: 38px;
}
#btn_login {
position: absolute;
top: 0px;
right: 70px;
}
#btn_discribe {
position: absolute;
top: 20px;
right: 20px;
}
#mag_logo_box img {
color: #FFF;
padding: 5px;
margin-right: 10px;
filter: alpha(opacity=25);
-moz-opacity:0.25;
opacity:0.25;
}

#mag_logo_box img.on {
border-top: 2px solid #fff;
border-right: 2px solid #aeaeae;
border-bottom: 2px solid #aeaeae;
border-left: 2px solid #aeaeae;
background-color:#FFF;
filter: alpha(opacity=100);
-moz-opacity:1;
opacity:1;
border-radius: 0px 0px 7px 7px;
}


#mag_logo_box img.of {
border-top: 2px solid #aeaeae;
border-right: 2px solid #aeaeae;
border-bottom: 2px solid #aeaeae;
border-left: 2px solid #aeaeae;
background-color:#FFF;
filter: alpha(opacity=100);
-moz-opacity:1;
opacity:1;
border-radius: 0px 0px 7px 7px;
}


#mag_logo_box img.of:hover {
border-top: 2px solid #fff;
border-right: 2px solid #aeaeae;
border-bottom: 2px solid #aeaeae;
border-left: 2px solid #aeaeae;
background-color:#FFF;
filter: alpha(opacity=100);
-moz-opacity:1;
opacity:1;
border-radius: 0px 0px 7px 7px;
}













/*
body #wrapper #contents #leftside {
width: 230px;
left: 5px;
position:fixed;
top:70px;
}
*/


#contents .clearfix #leftside .tit_box {
background-color:#fffaf1;
padding:20px 20px 5px 20px;
overflow: hidden;
}
#contents .clearfix #leftside .tit_box b > a {
font-size: 14px;
}
.readmore_box .rest {
background-image: url(../images/bg_rest.png);
background-repeat: no-repeat;
padding-left: 20px;
margin: 0 0 10px 0;
}

.art_txt {
margin-top: 20px;
margin-bottom: 40px;
}
body #wrapper #contents .clearfix #leftside .sns_box_left {
padding: 10px 20px 20px 20px;
background-color:#fffaf1;
height:20px;
margin-bottom: 10px;
}
body #wrapper #contents .clearfix #sub_content .tit_txt {
background-color: #000;
margin-bottom: 20px;
padding: 5px;
color:#FFF;
}


#sub_content dl {
margin: 0 0 20px 0;
}
#sub_content {
background-color: #FFF;
margin:0 0 20px 0;
width: 712px;
}



#sub_content dl dt {
float: left;
width: 80px;
margin-right: 20px;
border: 1px solid #eee;
}

#sub_content dl dt img {
width: 100%;
margin:0;
}


body #wrapper #contents #rightside {
height: 600px;
width: 300px;
display: block;
float: right;
margin:16px 0 0 0;
}

#sns_box {
width: 47px;
padding:60px 0 0 0;
height:206px;
position:fixed;
top:150px;
right:0px;
background-image:url(../images/bg_sns_box.png);
background-repeat:no-repeat;
z-index:99999;
}

#sns_box img{
margin:0 0 10px 12px;
}

.sns_box_rt .fb_com {
float: left;
margin: 0 10px 0 0;
}

.sns_box_rt {
float: right;
margin: 0 0 20px;
padding: 0;
/*  text-align: right;*/
}
.sns_box_rt .ht {
float: right;
margin: 0 0 0 5px;
}
.sns_box_rt .tw {
float: right;
margin: 0 0 0 5px;
}
.sns_box_rt .fb {
float: right;
margin: 0;
}
.sns_box_rt .gp {
float: right;
margin: 0 0 0 10px;
}
.sns_box_rt .bk {
float: right;
margin: 0 0 0 5px;
}
.gplusone div {
width: 65px !important;
}

a .bm_cont {
text-align:center;
margin:10px;
width:55px;
display:block;
}
body #wrapper #contents .clearfix #rightside .fb_coment {
background-color: #FFF!important;
margin: 0 0 10px 0 !important;
padding:10px;
height: 154px;
}
#rightside #ranking {
background-color: #f66;
padding:10px;
margin:10px 0 0 0;
}

#rightside #ranking img {
margin:0 10px 0 0 ;
}

#rightside #ranking p.tit {
color:#fff;
font-weight:bold;
}
#month_select {
height:30px;
margin-top: 10px;
}
body #wrapper #contents .clearfix #rightside .fb_coment .fb-comments {
background-color: #FFF!important;
}


#coment_box {
background-color: #FFF;
padding: 30px 10px 0 10px;
position:relative;
margin:40px 0 20px 0;
width:684px;

}


.fb_come_tit {
position:absolute;
left: 60px;
top: -20px;
}

#footer_base {
position: fixed !important;
bottom: 0;
left: 0;
width: 100%;
height: 35px;
border-top: solid 1px #ccc;
z-index: 999999;
}

#footer {
padding: 0px 10px;
margin-right: auto;
margin-left: auto;
}
#footer img {
height: 25px;
margin-top: 5px;
}
#ranking #rank_in {
margin: 10px 0 0 0;
background-color:#FFF;
padding:10px;
}
.tit_box h1 {
font-size: 34px;
line-height: 1.4;
font-weight: bold;
margin: 0 0 10px 0;
color: #252523;
}
#leftside .tit_box .category {
font-weight: bold;
color: #818181;
margin: 4px 0 10px 0;
font-size: 14px;
}
#rightside #ranking #rank_in p {
font-size: 123.1%;
line-height:1.2;
font-weight:bold;
font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','Meiryo UI','メイリオ',Verdana,'ＭＳ Ｐゴシック',sans-serif;
margin:0 0 10px 0;
}
#rank_in p span {
color: #099;
}






body #wrapper #footer .ft_nav ul {
margin: 10px 0 0 250px;
list-style-type: none;

}
body #wrapper #footer .ft_nav ul li {
float: left;
margin-right: 20px;
font-size:85%;
}

#contents_top {
width: 100%;
margin: 130px 10px 10px 10px;
position: relative;
}

#top_nav .month_nav {
float: left;
margin: 0 20px 0 0;
}



#btn_login a{
background: url('../images/sendenkaigi_sprite.png') no-repeat 0 -25px;
width: 158px;
height: 24px;
position: absolute;
right: 70px;
top: 0px;
z-index:99999999999;
}

#btn_login a:hover{
background: url('../images/sendenkaigi_sprite.png') no-repeat 0 0;
width: 158px;
height: 24px;
position: absolute;
right: 70px;
top: 0px;
z-index:9999999999;
}


#btn_discribe a{
background: url('../images/sendenkaigi_sprite.png') no-repeat 0 -51px;
width: 67px;
height: 67px;
position: absolute;
right: 20px;
top: 25px;
z-index:999999999;
}

#btn_discribe a:hover{
background: url('../images/sendenkaigi_sprite.png') no-repeat -68px -51px;
width: 67px;
height: 67px;
position: absolute;
right: 20px;
top: 25px;
z-index:99999999;
}

#btn_gear a{
background: url('../images/ic_gear.png') no-repeat;
width: 20px;
height: 21px;
position: absolute;
right: 60px;
top: 7px;
z-index:999999999;
}


dd .like_cnt {
font-size:105%;
width: 100px;
margin-left: 10px;
padding-left: 25px;
background-image: url(../images/like.png);
background-repeat: no-repeat;
background-position: 0 0;
}

#ranking #rank_in ol li {
font-size: 123.1%;
line-height: 1.2;
font-weight: bold;
font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','Meiryo UI','メイリオ',Verdana,'ＭＳ Ｐゴシック',sans-serif;
margin: 0 0 10px 30px;
color: #f66;
}
#leftside .tit_box .author {
font-size: 16px;
font-weight: bold;
}


::selection{
background:#a6dedf;
}

::-moz-selection{
background:#a6dedf;
}

#main .art_box_base p a.uline {
color: #000;
}



#backnumber .year {
padding:5px;
font-weight:bold;
color:white;
background-color:#f66;

}

#backnumber .box {
width:121px;
float:left;
margin:10px 8px;
height:280px;
}
#backnumber img {
margin:0 0 10px 0;
width:121px;
height:169px;
border:1px solid #ccc;
}
#backnumber .box a .date {
color:#000;
font-weight:normal;
font-size:90%;
margin:0 0 5px 0;
}

#backnumber .box a .info {
color:#000;
font-weight:normal;
margin:0 0 5px 0;
line-height:1.2;
font-weight:bold;
font-size:100%;
}
.left-main-wrap{
font-family: 'Noto Sans Japanese','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','Meiryo UI','メイリオ',Verdana,'ＭＳ Ｐゴシック',sans-serif;
width: 712px;
float: left;
}
#leftside {
margin:16px 0 0 0;
width:712px;

}
#contents {
width: 1024px;
margin:0 auto;
}


#month_bn li a {
text-decoration: underline;
}
#month_bn .index_box .topic {
font-weight: bold;
color: #f66;
}
.art_box_base h2 {
font-size: 22px;
color: #882717;
line-height: 1.4;
margin: 50px 0 20px 0;
}
.cap p {
font-size: 13px;
}
.art_box_base p {
font-size: 16px;
}
.img_full img {
width: 100%;
margin-bottom: 5px;
}
.img_mid {
width: 400px;
margin: 0 auto;
}
.img_mid img {
width: 400px;
margin-bottom: 5px;
}
.img_icon {
overflow: hidden;
margin-bottom: 20px;
}
.img_icon img {
width: 150px;
display: block;
margin:0 10px 0 0;
float:left;
}
.img_icon > .caption {
display: block;
overflow: hidden;
}
.caption {
font-size: 77%;
line-height: 1.25;
margin: 10px 0 20px 0;
text-indent: 0em;
color: #999;
}
.feature {
background: #fff5f5;
}
#box_wrapper .contents_top_new .box.top-article-item {
width: 244px;
height: 310px;
margin: 7.5px;
background: #fff;
border: 1px solid #e9ebee;
}

.box.top-article-item > a {
display: block;
padding: 15px;
position: relative;
height: 100%;
}

.box.top-article-item > a:hover {
text-decoration: none;
}
.box.top-article-item > a:hover .top-article-title {
transition: color .2s;
}
.top-article-thumb-wrap {
width: 214px;
height: 112.34px;
position: relative;
margin-bottom: 12px;
overflow: hidden;
border: 1px solid #eee;
transition: opacity .2s;
}
.box.top-article-item > a:hover .top-article-thumb-wrap {
opacity: .8;
transition: opacity .2s;
}
.top-article-thumb {
width: 100%;
height: auto;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}

#box_wrapper .contents_top_new .box .bk {
position: absolute;
bottom: 15px;
right: -4px;
width: 45px;
height: 27px;
box-shadow: 0 1px 3px 0px rgba(102, 102, 102, .3);
}

.favorite_star a {
width: 45px;
height: 27px;
position: relative;
}

.favorite_star a:after {
content: "";
display: block;
width: 0;
height: 0;
border-right: 2px solid transparent;
border-bottom: 2px solid transparent;
position: absolute;
bottom: -4px;
right: 0.5px;
}

.favorite-tooltip {
position: absolute;
bottom: -40px;
left: -53px;
display: block;
background: #eee;
width: 120px;
z-index: 3;
font-size: 10px;
color: #555;
padding: 8px;
z-index: 2;
box-shadow: 0px 0px 3px 0px rgba(102, 102, 102, .3);
}
.favorite-tooltip:before {
content: "";
display: block;
width: 0;
height: 0;
border-bottom: 6px solid #eee;
border-right: 5px solid transparent;
border-left: 5px solid transparent;
position: absolute;
left: 50%;
top: -7px;
margin-left: -5px;
}
.favorite_star a:before {
content: "\f02e";
font: normal normal normal 14px/1 FontAwesome;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: #fff;
}
.top-article-free-label {
position: absolute;
right: -1px;
top: -1px;
}
.favorite_star a {
background: #FF6666;
}
.favorite_star a:after {
border-top: 2px solid #e55454;
border-left: 2px solid #e55454;
}
.box.top-article-item > a:hover .top-article-title {
color: #FF6666;
}
.favorite_star.on a:before{
color: #bb3d3d;
}


.top-article-category {
margin-top: -15px;
height: 50px;
position: relative;
}
.top-article-category-inner {
position: absolute;
left: 0;
top: 50%;
transform: translate(0, -50%);
display: inline-block;
line-height: 1.2;
}

@media print{　　/* 20200707 印刷時のヘッダ無効 */
	#wrapper {
		margin-top: 0;
	}
	#footer_base {
		position: relative !important;
	}
}