css/nicopedia_style_sp.css (co4418548) [コミュニティ記事]

元記事
ニコニコ大百科: HTML各要素のデフォルト CSS

2020年 8月以降はhttps://dic.nicovideo.jp/css/nicopedia_style_sp.css
それ以前はhttps://dic.nicovideo.jp/css/style.css

この記事を利用する際はヘッダーの追従を固定にして下さい。
元の項目に戻るには

を選択して下さい。

span.art icle dl{
padding: .8em 0 .5em 1.5em
}

span.art icle dt{
font-weight: bold
}

span.art icle dd{
ma rgin-left: 1em;
line-height: 1.8em
}

table{
border-collapse: collapse
}

det ails summary {
list-style: revert
}

.at-List_Name{
font-size: 12px;
color: #222
}

.at-List_Num{
font-size: 14px;
font-weight: bold;
ma rgin-right: 4px
}

.at-List_Date{
font-size: 10px;
color: #999;
ma rgin-bo ttom: 8px
}

.at-List_Ill ust{
max-width: 480px;
ma rgin: 0 auto
}

.at-List_Ill ust-img{
position: rela tive;
border: so lid 1px #999;
ma rgin: 10px
}

.at-List_Ill ust-img>img{
top: 0;
left: 0;
bo ttom: 0;
right: 0;
width: 100%;
height: 100%;
ver tical-align: bo ttom;
obj ect-fit: con tain
}

.at-List_Ill ust-title{
font-size: 12px;
color: #222;
ma rgin-left: 10px
}

.at-Ill ust_Btn{
width: 310px;
ma rgin: 10px auto
}

.at-Ill ust_Btn: after{
content: " ";
display: b lock;
clear: both
}

.at-Ill ust_Btn>li{
float: left;
ma rgin-right: 20px
}

.at-Ill ust_Btn>li: last-child{
ma rgin-right: 0px
}

.at-Ill ust_Btn_homeru{
display: b lock;
width: 100px;
height: 40px;
line-height: 40px;
font-size: 14px;
text-align: center;
box-sizing: border-box;
bac kground: url(/img/icon_hometa.png) no-repeat left 6px center;
bac kground-size: 32px auto;
border: so lid 1px #999;
border-radius: 6px;
color: #222;
padding-left: 24px;
outline: none
}

.at-Ill ust_Btn_homeru.active{
bac kground: url(/img/icon_hometa-or.png) no-repeat left center;
bac kground-size: 32px auto;
color: #ffaf19
}

.at-Ill ust_Btn-moto{
width: 190px;
height: 40px;
line-height: 40px;
font-size: 14px;
text-align: center;
box-sizing: border-box;
border: so lid 1px #999;
border-radius: 6px
}

.at-Ill ust_Btn-moto a{
display: b lock;
color: #222
}

.at-List_Piko{
ma rgin: 10px;
padding: 12px 0px 12px 12px;
width: 200px
}

.at-List_Piko-title{
font-size: 12px;
color: #222;
ma rgin-left: 10px
}

.at-Piko_Btn{
ma rgin: 10px 10px 0px 10px
}

.at-Piko_Btn_homeru{
display: b lock;
width: 100px;
height: 40px;
line-height: 40px;
font-size: 14px;
text-align: center;
box-sizing: border-box;
bac kground: url(/img/icon_hometa.png) no-repeat left 6px center;
bac kground-size: 32px auto;
border: so lid 1px #999;
border-radius: 6px;
color: #222;
padding-left: 24px;
outline: none
}

.at-Piko_Btn_homeru.active{
bac kground: url(/img/icon_hometa-or.png) no-repeat left center;
bac kground-size: 32px auto;
color: #ffaf19
}

.at-Res_Btn-moto{
width: 250px;
height: 40px;
line-height: 40px;
font-size: 14px;
text-align: center;
box-sizing: border-box;
border: so lid 1px #999;
border-radius: 6px
}

.at-Res_Btn-moto a{
display: b lock;
color: #222
}

.ah-Art icle_Title-btn{
width: 140px;
height: 30px;
ma rgin-top: 10px;
line-height: 28px;
font-size: 12px;
text-align: center;
box-sizing: border-box;
bac kground: url(/img/icon_newar ticle-gray.png) no-repeat left 5px center;
bac kground-size: 32px auto;
border: so lid 1px #999;
border-radius: 6px
}

.ah-Art icle_Title-btn a{
display: b lock;
color: #747474;
padding-left: 20px
}

.ah-Art icle_Version{
display: table;
width: 100%
}

.ah-Art icle_Version-date{
min-width: 150px;
color: #747474;
display: table-cell
}

.ah-Art icle_List-date-label{
font-size: 8px
}

.ah-Art icle_Version-link{
font-size: 8px;
display: table-cell;
text-align: right;
width: 100%
}

.ah-Art icle_Version-link a{
display: b lock;
color: #1e7dc0
}

.ah-Art icle_List-au thor{
font-size: 10px;
ma rgin: 10px 0 0;
color: #999
}

.ah-Art icle_List-name{
font-size: 14px
}

.ah-Art icle_List-name a{
display: b lock;
color: #1e7dc0
}

.ah-Art icle_List-comment{
font-size: 8px;
ma rgin: 10px 0 0;
color: #999
}

.ah-Art icle_List-date{
font-size: 10px;
ma rgin: 10px 0 0;
color: #999
}

.ah-Art icle_List-text{
font-size: 12px;
color: #747474;
word-break: break-all
}

.au-Info{
position: rela tive;
ma rgin-bo ttom: 20px
}

.au-Info: after{
content: "";
display: b lock;
width: 100%;
height: 10px;
box-shadow: 0px 2px 2px -1px rgba(0,0,0,.15) inset;
bac kground-color: #d6d6d6
}

.au-Info_Status{
padding: 0 30px;
ma rgin: 30px 0
}

.au-Info_Status ul{
font-size: 12px;
padding: 10px 0
}

.au-Info_Status ul li{
font-size: 12px;
ma rgin-bo ttom: 5px;
display: table
}

.au-Info_Status_title{
display: table-cell;
ver tical-align: top;
width: 60px
}

.au-Info_Status-user .au-Info_Status_title{
width: 73px
}

.au-Info_Status-oek aki ko .au-Info_Status_title{
width: 100px
}

.au-Info_Status-art icle .au-Info_Status_title{
width: 85px
}

.au-Info_Status-piko .au-Info_Status_title{
width: 95px
}

.au-Info_Status_text{
display: table-cell;
ma rgin-left: 5px
}

.au-Info_Text-rank{
display: inline-b lock
}

.au-Info_Title{
color: #222;
font-size: 16px;
font-weight: bold;
ma rgin: 0 0 5px;
padding: 0 0 5px;
border-bo ttom: so lid 2px #ffaf19
}

.au-Info_Rec ently{
padding: 0 30px;
ma rgin: 30px 0
}

.au-Info_Rec ently ul{
font-size: 12px;
padding: 10px 0
}

.au-Info_Rec ently ul li{
display: inline-b lock;
ma rgin: 0
}

.au-Info_Rec ently ul li: after{
content: "/";
color: #999;
position: rela tive;
padding: 0 4px 0 8px
}

.au-Info_Rec ently ul li: last-child: after{
display: none
}

.au-Info_Rec ently ul li a{
color: #1e7dc0
}

.au-Info_Rec ently-tag{
display: inline-b lock
}

.au-Art icle_Body-disp{
border: so lid 1px #999;
padding: 10px 15px;
line-height: 1.8
}

.ho-Column_Title{
padding: 10px 10px 0;
font-size: 20px;
color: #222
}

.ha-Column_Title{
padding: 10px 10px 0;
font-size: 20px;
color: #222
}

.mo-Column_Title{
padding: 10px 10px 0;
font-size: 20px;
color: #222
}

.mo-Ill ust_Btn-toukou{
width: 100%;
height: 30px;
line-height: 30px;
font-size: 12px;
text-align: center;
box-sizing: border-box;
bac kground: url(/img/icon_targe tblank.png) no-repeat right 5px center;
bac kground-size: 22px auto;
border: so lid 1px #999;
border-radius: 6px;
ma rgin-top: 10px
}

.mo-Ill ust_Btn-toukou a{
display: b lock;
color: #222;
padding-right: 15px
}

.ac-Art icle_Commu{
position: rela tive;
border: 1px so lid #999;
ma rgin: 10px;
font-size: 0
}

.ac-Art icle_Commu-name{
width: 100%;
bac kground-color: #222;
color: #fff;
font-size: 14px;
text-align: center;
padding: 2px 0
}

.ac-Art icle_Commu-thumb{
position: rela tive;
display: table-cell;
width: 33%;
text-align: center;
ver tical-align: middle;
bac kground-color: #000;
border-right: so lid 1px #999
}

.ac-Art icle_Commu-thumb>img{
max-width: 100%
}

.ac-Art icle_Commu-text{
display: table-cell;
width: 66%
}

.ac-Art icle_Commu-title{
font-size: 14px;
color: #1e7dc0;
padding: 10px 10px 0;
max-height: 36px;
overflow: hi dden;
text-overflow: ell ip sis;
display: -webkit-box;
-webkit-box-orient: ver tical;
-webkit-line-clamp: 2
}

.ac-Art icle_Commu-title a{
color: inherit
}

.ac-Art icle_Commu-info{
display: table;
padding: 10px;
width: 100%;
box-sizing: border-box
}

.ac-Art icle_Info-status{
display: table-cell;
padding: 5px 0 0;
color: #999;
font-size: 10px
}

.ac-Art icle_Info-status li{
display: b lock
}

.ac-Art icle_Commu-follow{
display: table-cell;
color: #1e7dc0;
font-size: 10px;
text-align: right;
ver tical-align: bo ttom;
padding: 5px 0 0
}

.ac-Art icle_Commu-follow a{
color: inherit
}

.ac-Heading{
width: 100%;
border-bo ttom: so lid 4px #ffaf19;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
jus tify-content: space-be tween;
box-sizing: border-box
}

.ac-Heading_Text{
font-size: 20px;
padding: 0 10px 10px 35px;
bac kground: url(/img/icon_edit-pen.png) no-repeat left 10px bo ttom 12px;
bac kground-size: 20px
}

.ac-Heading_Btn-cl ose{
-webkit-appeara nce: none;
-moz-appeara nce: none;
appeara nce: none;
padding: 0 0 10px;
border: none;
outline: none;
bac kground: tran spa rent;
width: 20px;
height: 20px;
ma rgin-top: 3px;
ma rgin-right: 20px;
font-size: 0;
position: rela tive
}

.ac-Heading_Btn-cl ose: before,.ac-Heading_Btn-cl ose: after{
content: "";
display: b lock;
width: 20px;
height: 1px;
bac kground: #505050;
position: absolute;
top: 0;
left: 0;
right: 0;
bo ttom: 0;
ma rgin: auto
}

.ac-Heading_Btn-cl ose: before{
transform: rotate(45deg);
-webkit-transform: rotate(45deg)
}

.ac-Heading_Btn-cl ose: after{
transform: rotate(-45deg);
-webkit-transform: rotate(-45deg)
}

.ac-Edit{
width: 100%;
padding: 0 15px;
box-sizing: border-box
}

.ac-Edit_Art icle-title{
width: 100%;
box-sizing: border-box
}

.ac-Edit_Art icle-title[aria-hid den=true]{
display: none
}

.ac-Edit_Form{
width: 100%;
box-sizing: border-box
}

.ac-Edit_Form-label{
font-size: 12px;
ma rgin-bo ttom: 5px
}

.ac-Edit_Form-select{
display: inline-b lock;
height: 32px;
position: rela tive
}

.ac-Edit_Form-select: before{
content: "";
display: b lock;
width: 30px;
height: 100%;
bac kground: #646464;
position: absolute;
right: 0;
top: 0;
z-index: -1
}

.ac-Edit_Form-select: after{
content: "";
display: b lock;
width: 10px;
height: 10px;
border-right: so lid 2px #fff;
border-bo ttom: so lid 2px #fff;
position: absolute;
right: 9px;
top: 48%;
bo ttom: 0;
transform: tran slateY(-50%) rotate(45deg);
-webkit-transform: tran slateY(-50%) rotate(45deg);
z-index: -1
}

.ac-Edit_Form-select select{
width: 100%;
display: b lock;
-webkit-appeara nce: none;
-moz-appeara nce: none;
appeara nce: none;
border: none;
outline: none;
bac kground: tran spa rent;
border: so lid 1px #d8d8d8;
color: #646464;
border-radius: 0;
font-size: 14px;
padding: 0 40px 0 10px;
height: 100%
}

.ac-Edit_Form-info{
font-size: 12px;
color: #ad adad;
line-height: 1.6em;
ma rgin: 10px 0 20px
}

.ac-Edit_Form-input{
width: 100%;
box-sizing: border-box
}

.ac-Edit_Form-input input{
padding: 0;
border: none;
border-radius: 0;
outline: none;
bac kground: none;
box-sizing: border-box;
width: 100%;
border: so lid #d7d7d7 1px;
border-radius: 5px;
font-size: 12px;
padding: 10px
}

.ac-Edit_Form-btn{
width: 100%;
height: 50px;
-webkit-appeara nce: none;
-moz-appeara nce: none;
appeara nce: none;
padding: 0;
border: none;
outline: none;
box-sizing: border-box;
bac kground: #ffaf19;
color: #fff;
font-weight: bold;
padding: 10px 10px;
ma rgin-top: 18px;
font-size: 14px
}

.ac-Edit_Form-btn[disabled]{
bac kground: #ea eaea;
color: #9b9b9b
}

.ap-Heading{
width: 100%;
border-bo ttom: so lid 4px #ffaf19;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
jus tify-content: space-be tween;
box-sizing: border-box
}

.ap-Heading_Text{
font-size: 20px;
padding: 0 10px 10px 35px;
bac kground: url(/img/icon_edit-pen.png) no-repeat left 10px bo ttom 12px;
bac kground-size: 20px
}

.ap-Heading_Btn-cl ose{
-webkit-appeara nce: none;
-moz-appeara nce: none;
appeara nce: none;
padding: 0 0 10px;
border: none;
outline: none;
bac kground: tran spa rent;
width: 20px;
height: 20px;
ma rgin-top: 3px;
ma rgin-right: 20px;
font-size: 0;
position: rela tive
}

.ap-Heading_Btn-cl ose: before,.ap-Heading_Btn-cl ose: after{
content: "";
display: b lock;
width: 20px;
height: 1px;
bac kground: #505050;
position: absolute;
top: 0;
left: 0;
right: 0;
bo ttom: 0;
ma rgin: auto
}

.ap-Heading_Btn-cl ose: before{
transform: rotate(45deg);
-webkit-transform: rotate(45deg)
}

.ap-Heading_Btn-cl ose: after{
transform: rotate(-45deg);
-webkit-transform: rotate(-45deg)
}

.ap-Prec autio ns{
width: 100%
}

.ap-Prec autio ns_Link{
font-size: 12px;
font-weight: bold;
padding: 10px;
bac kground: #f7f7f7;
border: so lid 1px #c 5c 5c5
}

.ap-Prec autio ns_Link: before{
content: "";
display: inline-b lock;
width: 1em;
height: 1em;
bac kground: url(/img/icon_pre cauti ons.png) no-repeat;
bac kground-size: 100%
}

.ap-Prec autio ns .prec autio ns-alert{
font-size: 10px;
color: red
}

.ap-Error Message{
width: 100%;
box-sizing: border-box;
ma rgin: 15px 0 22px;
line-height: 1.3em;
padding: 0 20px
}

.ap-Error Message li{
padding-left: 1em;
font-size: 12px;
position: rela tive;
color: red
}

.ap-Error Message li: before{
content: "・";
position: absolute;
top: 0;
left: 0
}

.ap-Edit{
width: 100%;
box-sizing: border-box;
ma rgin-bo ttom: 14px
}

.ap-Edit_Title{
width: 100%;
padding: 0 15px;
box-sizing: border-box
}

.ap-Edit_Title input{
height: 45px;
padding: 0;
border: none;
border-radius: 0;
outline: none;
bac kground: none;
box-sizing: border-box;
width: 100%;
border: so lid #979797 1px;
border-radius: 5px;
font-size: 18px;
padding: 10px
}

.ap-Edit_Title-yomi{
width: 100%;
padding: 0 15px;
box-sizing: border-box;
ma rgin-top: 13px
}

.ap-Edit_Title-yomi input{
height: 45px;
padding: 0;
border: none;
border-radius: 0;
outline: none;
bac kground: none;
box-sizing: border-box;
width: 100%;
border: so lid #979797 1px;
border-radius: 5px;
font-size: 12px;
padding: 10px
}

.ap-Edit_Area{
ma rgin-top: 22px
}

.ap-Edit_Tool bar{
width: 100%;
box-sizing: border-box;
ma rgin-bo ttom: 22px;
position: rela tive;
z-index: 1
}

.ap-Edit_Tool bar *{
box-sizing: border-box
}

.ap-Edit_Tool bar button{
width: calc(10 0vw/6);
height: 50px;
bac kground: lin ear-gradi ent(180deg, #E 6E 6E6 90%, #DF DFDF 92%, #D 3D 3D3 100%);
-webkit-appeara nce: none;
-moz-appeara nce: none;
appeara nce: none;
padding: 0;
border: none;
border-right: so lid 1px #d6d6d6;
outline: none;
color: #505050;
padding: 5px 2px
}

.ap-Edit_Comment{
width: 100%;
box-sizing: border-box;
padding: 15px;
border-top: so lid 12px #d8d8d8
}

.ap-Edit_Comment label{
width: 100%;
font-size: 18px;
display: b lock;
font-weight: bold;
ma rgin-top: 16px
}

.ap-Edit_Comment label sm all{
font-size: 16px;
color: #b3 b3b3;
padding-left: 5px
}

.ap-Edit_Comment text area{
width: 100%;
height: 78px;
-webkit-appeara nce: none;
-moz-appeara nce: none;
appeara nce: none;
resize: none;
padding: 0;
border: 0;
outline: none;
bac kground: tran spa rent;
font-size: 14px;
ma rgin-top: 15px;
border: so lid #979797 1px;
border-radius: 5px;
padding: 10px;
box-sizing: border-box
}

.ap-Edit_Comment text area: focus{
border: 1px #1e7dc0 so lid;
box-shadow: 0 0 3px #1e7dc0;
border-radius: 5px
}

.ap-Edit_BtnArea{
width: 100%;
height: 74px;
position: fixed;
left: 0;
bo ttom: 0;
z-index: 2;
bac kground: #fff;
text-align: center;
box-sizing: border-box;
display: flex;
align-i tems: center;
padding: 0 6px;
box-shadow: 0 -2px 4px rgba(0,0,0,.14)
}

.ap-Edit_Btn-sub mit{
width: 50%;
height: 48px;
box-sizing: border-box;
padding: 0 6px
}

.ap-Edit_Btn-normal{
width: 50%;
height: 48px;
box-sizing: border-box;
padding: 0 6px
}

.ap-Edit_BtnArea input,.ap-Edit_BtnArea button{
width: 100%;
height: 100%;
-webkit-appeara nce: none;
-moz-appeara nce: none;
appeara nce: none;
padding: 0;
border: none;
outline: none;
box-sizing: border-box;
font-weight: bold;
font-size: 14px
}

.ap-Edit_Btn-sub mit input{
bac kground: #b3 b3b3;
color: #fff
}

.ap-Edit_Btn-normal button{
border: so lid 2px #ffaf19;
bac kground: #fff;
color: #ffaf19
}

.preview-cont ainer{
display: none;
height: 100%;
position: fixed;
top: 0;
width: 100%;
z-index: 3;
-webkit-overflow-scrolling: touch
}

.preview-cont ainer[aria-label ledby=preview-modal]{
z-index: 1
}

.preview-cont ainer.is-open{
display: b lock
}

.preview-bg{
bac kground: rgba(0,0,0,.5);
height: 100%;
position: absolute;
width: 100%
}

.preview-content: not([aria-label ledby=preview-modal]){
bac kground: #fff;
left: 50%;
position: absolute;
top: 45%;
transform: tran slate(-50%, -50%);
width: 90%;
max-height: 80vh;
border-radius: 5px;
overflow: hi dden;
padding-bo ttom: 10px;
position: rela tive
}

.preview-content[aria-label ledby=preview-modal]{
width: 100%;
height: 95%;
bac kground: #fff;
position: absolute;
left: 0;
top: 5%;
ma rgin: auto;
border-radius: 5px;
overflow-y: scroll;
z-index: 1;
box-sizing: border-box;
padding-bo ttom: 74px
}

.preview-content[aria-label ledby=fa mily-service-contents-modal]{
width: 100%;
max-height: 100vh;
top: 0;
left: 0;
transform: none;
border-radius: 0
}

.preview-content[aria-label ledby=fa mily-service-contents-conf irm]{
width: 95%;
min-width: 315px;
padding-bo ttom: 0
}

.preview-content-inner{
width: 100%
}

.preview-content-inner-heading{
width: 100%;
height: 44px;
bac kground: #2d 2d2d;
color: #fff;
text-align: center;
font-size: 17px;
padding: 12px 5px 8px;
box-sizing: border-box;
position: sticky;
position: -webkit-sticky;
top: 0
}

.preview-content-heading{
width: 100%;
bac kground: #ffaf19 url(/img/a post_modal_heading_img.png) no-repeat left 10px bo ttom;
bac kground-size: 60px auto;
height: 44px;
color: #2d 2d2d;
font-size: 12px;
text-align: center;
display: flex;
align-i tems: center;
box-sizing: border-box
}

.preview-content-heading-text{
width: 100%;
text-align: center;
font-weight: bold
}

.preview-content-text{
font-size: 12px;
line-height: 1.6em;
padding: 15px;
box-sizing: border-box
}

.preview-content-text-list{
width: 100%
}

.preview-content-text-list li{
padding-left: 1em;
position: rela tive
}

.preview-content-text-list li: before{
content: "・";
position: absolute;
top: 0;
left: 0
}

.preview-content-text-list li: not(: nth-of-type(1)){
ma rgin-top: 1em
}

.preview-art icle-contents{
width: 100%;
overflow: initial
}

.preview-Edit_Comment{
width: 100%;
box-sizing: border-box;
padding: 15px;
border-top: so lid 12px #d8d8d8;
bac kground: #fff
}

.preview-Edit_Comment label{
width: 100%;
font-size: 18px;
display: b lock;
ma rgin-top: 16px
}

.preview-Edit_Comment label sm all{
font-size: 16px;
color: #b3 b3b3;
padding-left: 5px
}

.preview-Edit_Comment text area{
width: 100%;
height: 78px;
-webkit-appeara nce: none;
-moz-appeara nce: none;
appeara nce: none;
resize: none;
padding: 0;
border: 0;
outline: none;
bac kground: tran spa rent;
font-size: 14px;
ma rgin-top: 15px;
border: so lid #979797 1px;
border-radius: 5px;
padding: 10px;
box-sizing: border-box
}

.preview-Edit_Comment text area: focus{
border: 1px #1e7dc0 so lid;
box-shadow: 0 0 3px #1e7dc0;
border-radius: 5px
}

.preview-content-if rame{
top: 0;
left: 0;
width: 100%;
height: 100vh
}

.preview-cl ose-button-wrap per{
position: sticky;
top: 0;
z-index: 1
}

.preview-cl ose-button{
-webkit-appeara nce: none;
-moz-appeara nce: none;
appeara nce: none;
padding: 0 0 10px;
border: none;
outline: none;
bac kground: tran spa rent;
width: 20px;
height: 20px;
font-size: 0;
position: absolute;
top: 15px;
right: 15px
}

.preview-cl ose-button: before,.preview-cl ose-button: after{
content: "";
display: b lock;
width: 20px;
height: 1px;
bac kground: #505050;
position: absolute;
top: 0;
left: 0;
right: 0;
bo ttom: 0;
ma rgin: auto
}

.preview-cl ose-button: before{
transform: rotate(45deg);
-webkit-transform: rotate(45deg)
}

.preview-cl ose-button: after{
transform: rotate(-45deg);
-webkit-transform: rotate(-45deg)
}

.preview-content[aria-label ledby=preview-modal] .preview-cl ose-button: before,.preview-content[aria-label ledby=preview-modal] .preview-cl ose-button: after{
bac kground: #fff
}

.preview-loading{
display: none;
padding: 10px
}

.preview-error{
color: #a00;
display: none;
padding: 10px
}

.fa mily-service-contents-modal-heading{
height: 51px;
bac kground: #e be beb;
font-weight: bold;
text-align: center;
font-size: 14px;
box-sizing: border-box;
padding: 10px 5px 5px
}

.fa mily-service-contents-modal-inner{
width: 100%;
max-height: calc(100vh - 51px);
padding: 0 18px 20px;
box-sizing: border-box;
overflow-y: scroll
}

.fa mily-service-content{
width: 100%;
ma rgin-bo ttom: 15px
}

.fa mily-service-contents-bot tom-mar gin{
width: 100%;
height: 100px
}

.fa mily-service-contents-heading{
font-size: 16px;
text-align: center;
box-sizing: border-box;
padding: 15px 5px
}

.fa mily-service-contents-list{
width: 100%;
box-sizing: border-box
}

.fa mily-service-contents-list[data-service=ill ust]{
display: flex;
flex-wrap: wrap
}

.fa mily-service-contents-list li{
box-sizing: border-box
}

.fa mily-service-contents-list[data-service=video] li,.fa mily-service-contents-list[data-service=news] li{
width: 100%;
display: flex;
ma rgin-bo ttom: 10px
}

.fa mily-service-contents-list[data-service=ill ust] li{
width: 32%;
display: flex;
flex-flow: column wrap;
jus tify-content: space-be tween;
ma rgin-bo ttom: 15px
}

.fa mily-service-contents-list[data-service=ill ust] li: nth-of-type(3n-1){
ma rgin: 0 2% 15px
}

.fa mily-service-contents-thumb{
box-sizing: border-box;
text-align: center;
position: rela tive
}

.fa mily-service-contents-list[data-service=video] .fa mily-service-contents-thumb{
width: 110px;
height: 80px;
overflow: hi dden;
flex-shrink: 0;
text-align: center;
ma rgin-right: 10px
}

.fa mily-service-contents-list[data-service=video] img{
width: 110px;
height: 80px;
obj ect-fit: con tain
}

.fa mily-service-contents-list[data-service=ill ust] .fa mily-service-contents-thumb{
width: 100%;
padding-top: 100%;
position: rela tive;
ma rgin-bo ttom: 4px
}

.fa mily-service-contents-list[data-service=ill ust] .fa mily-service-contents-thumb: after{
content: "";
display: b lock;
border: so lid #999 1px;
box-sizing: border-box;
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
z-index: 1
}

.fa mily-service-contents-list[data-service=ill ust] img{
width: 100%;
height: 100%;
obj ect-fit: con tain;
position: absolute;
top: 0;
left: 0
}

.fa mily-service-contents-list[data-service=news] .fa mily-service-contents-thumb{
width: 62px;
height: 62px;
flex-shrink: 0;
text-align: center;
ma rgin-right: 10px
}

.fa mily-service-contents-list[data-service=news] img{
width: 62px;
height: 62px;
obj ect-fit: con tain
}

.fa mily-service-contents-det ails{
width: 100%;
display: flex;
flex-flow: column wrap;
box-sizing: border-box
}

.fa mily-service-contents-date{
width: 100%;
height: 1.5em;
overflow: hi dden;
font-size: 9px;
color: #747474;
box-sizing: border-box
}

.fa mily-service-contents-title{
width: 100%;
height: 1.3em;
font-size: 12px;
color: #14 7cc2;
align-self: center;
overflow: hi dden;
ma rgin-bo ttom: 5px
}

.fa mily-service-contents-list[data-service=video] .fa mily-service-contents-title,.fa mily-service-contents-list[data-service=news] .fa mily-service-contents-title{
align-self: center;
height: 2.6em
}

.fa mily-service-contents-conf irm-heading{
width: 100%;
font-size: 14px;
font-weight: bold;
text-align: center;
box-sizing: border-box;
padding: 40px 15px 15px
}

.fa mily-service-contents-conf irm-preview{
width: 312px;
ma rgin: auto;
box-sizing: border-box
}

.fa mily-service-contents-conf irm-preview if rame,.fa mily-service-contents-conf irm-preview if rame body{
width: 100% !imp ort ant
}

.fa mily-service-contents-conf irm-buttons{
width: 100%;
display: flex;
ma rgin-top: 15px;
box-sizing: border-box;
border-top: so lid 1px #989898
}

.fa mily-service-contents-conf irm-buttons button{
width: 50%;
height: 50px;
border-right: so lid 1px #989898;
bac kground: #fff;
color: #14 7cc2;
font-weight: bold;
font-size: 14px
}

.wa-Heading{
width: 100%;
border-bo ttom: so lid 4px #ffaf19;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
jus tify-content: space-be tween;
box-sizing: border-box
}

.wa-Heading_Text{
font-size: 20px;
padding: 0 10px 10px 35px;
bac kground: url(/img/icon_edit-pen.png) no-repeat left 10px bo ttom 12px;
bac kground-size: 20px;
color: #25 2525;
font-weight: normal
}

.wa-Contents{
ma rgin-top: 10px;
padding: 0 15px
}

.wa-Contents_Inner: not(: nth-of-type(1)){
ma rgin-top: 24px
}

.wa-Contents_Inner p{
font-size: 12px;
color: #535353;
line-height: 1.6em
}

.wa-Contents_Inner p strong{
font-size: 16px;
color: #25 2525;
line-height: 1.8em;
font-weight: normal
}

.wa-Contents_Inner p sm all{
color: #535353
}

.wa-Contents_Img{
display: b lock;
width: 100px;
ma rgin: 40px auto
}

.wa-Contents_Img img{
width: 100%
}

.mp-Profile{
position: rela tive;
padding: 20px;
text-align: center
}

.mp-Profile_inner{
display: inline-b lock
}

.mp-Profile_Title{
color: #222;
font-size: 16px;
text-align: center
}

.mp-Profile_Title-name{
display: inline-b lock;
font-weight: bold;
text-align: left
}

.mp-Profile_Title-text{
min-width: 130px;
display: inline-b lock
}

.mp-Profile_Status{
position: rela tive;
ma rgin: 10px 0
}

.mp-Profile_Status-title{
font-size: 12px;
padding: 10px 0 10px 45px;
bac kground: url("/img/icon_hometa.png") no-repeat left center;
bac kground-size: 50px;
display: inline-b lock
}

.mp-Profile_Count{
border-top: 1px so lid #979797;
ma rgin: 5px 0 0;
padding: 10px 0 0
}

.mp-Profile_Count>li{
display: inline-b lock;
ma rgin: 0 10px;
color: #222;
font-size: 14px
}

.mp-Profile_Count-label{
color: #999;
font-size: 10px
}

.mp-Menu: before{
content: "";
display: b lock;
width: 100%;
height: 10px;
bac kground-color: #d6d6d6;
box-shadow: 0px 2px 2px -1px rgba(0,0,0,.15) inset
}

.mp-Menu_List{
font-size: 0;
bac kground-color: #fff
}

.mp-Menu_List li{
border-bo ttom: 1px so lid #979797;
bac kground: url("/img/icon_arrow-right.png") no-repeat right center;
bac kground-size: 30px
}

.mp-Menu_List li a{
display: table;
color: #222;
padding: 10px 30px 10px 10px;
min-height: 50px;
box-sizing: border-box;
width: 100%;
line-height: 1
}

.mp-Menu_Title{
font-size: 16px;
color: #222;
padding-right: 60px
}

.mp-Menu_Title-s{
display: table-cell;
ver tical-align: middle;
padding-right: 60px;
font-size: 16px
}

.mp-Menu_Sub title{
font-size: 10px;
color: #999;
ma rgin-top: 3px
}

.mp-Info{
position: rela tive
}

.mp-Info: before{
content: "";
display: b lock;
width: 100%;
height: 10px;
box-shadow: 0px 2px 2px -1px rgba(0,0,0,.15) inset;
bac kground-color: #d6d6d6
}

.mp-Info_Status{
padding: 0 30px;
ma rgin: 30px 0
}

.mp-Info_Status ul{
font-size: 12px;
padding: 10px 0
}

.mp-Info_Status ul li{
font-size: 12px;
ma rgin-bo ttom: 5px;
display: table
}

.mp-Info_Status_title{
display: table-cell;
ver tical-align: top;
width: 60px
}

.mp-Info_Status-user .mp-Info_Status_title{
width: 73px
}

.mp-Info_Status-oek aki ko .mp-Info_Status_title{
width: 100px
}

.mp-Info_Status-art icle .mp-Info_Status_title{
width: 85px
}

.mp-Info_Status-piko .mp-Info_Status_title{
width: 95px
}

.mp-Info_Status_text{
display: table-cell;
ma rgin-left: 5px
}

.mp-Info_Text-rank{
display: inline-b lock
}

.mp-Info_Title{
color: #222;
font-size: 16px;
font-weight: bold;
ma rgin: 0 0 5px;
padding: 0 0 5px;
border-bo ttom: so lid 2px #ffaf19
}

.mp-Info_Rec ently{
padding: 0 30px;
ma rgin: 30px 0 0
}

.mp-Info_Rec ently ul{
font-size: 12px;
padding: 10px 0
}

.mp-Info_Rec ently ul li{
display: inline-b lock;
ma rgin: 0
}

.mp-Info_Rec ently ul li: after{
content: "/";
color: #999;
position: rela tive;
padding: 0 4px 0 8px
}

.mp-Info_Rec ently ul li: last-child: after{
display: none
}

.mp-Info_Rec ently ul li a{
color: #1e7dc0
}

.mp-Info_Rec ently-tag{
display: inline-b lock
}

.pa-Column_Title{
padding: 10px;
ma rgin-bo ttom: 10px;
font-size: 20px;
color: #222;
padding-left: 35px;
bac kground: url(/img/icon_hometa.png) no-repeat left -1px center;
bac kground-size: 40px auto
}

.pw-Column_Title{
padding: 10px;
ma rgin-bo ttom: 10px;
font-size: 20px;
color: #222;
padding-left: 35px;
bac kground: url(/img/icon_pus hword.png) no-repeat left center;
bac kground-size: 40px auto
}

.re-Wrap per{
position: rela tive;
width: 100%;
height: 100%;
box-sizing: border-box
}

.re-Wrap per_Inner{
position: rela tive;
width: 100%;
max-width: 768px;
min-height: 100%;
ma rgin: 0 auto;
padding-bo ttom: 60px;
box-sizing: border-box
}

.re-Form{
position: rela tive;
ma rgin: 15px 0
}

.re-Guide{
ma rgin-bo ttom: 20px
}

.re-Guide_Title{
padding: 10px;
font-size: 14px;
color: #222;
text-align: center
}

.re-Guide_Text{
padding: 0 10px;
color: #999;
font-size: 12px
}

.re-Guide_Text p{
position: rela tive;
padding-left: 15px;
ma rgin-bo ttom: 5px
}

.re-Guide_Text p: before{
content: "・";
position: absolute;
left: 0;
top: 0
}

.re-Guide_Text p: last-child{
ma rgin-bo ttom: 0
}

.re-Guide_Text p .re-Guide_Text-gray{
color: #999
}

.re-Guide_Text-red{
color: red
}

.re-Guide_Text-link{
color: #1e7dc0
}

.re-Guide_Not ice1{
font-size: 12px;
padding: 0 10px
}

.re-Guide_Not ice1-cl ose { text-align: right;
color: #999
}

.re-Form_Not ice2 { font-size: 12px;
padding-bo ttom: 8px
}

.re-Form_Lead Text{
font-size: 12px;
color: #747474;
ma rgin-bo ttom: 20px
}

.re-Form_TextTab{
width: 100%;
max-width: 480px;
padding: 0 10px;
ma rgin: 20px auto 40px;
box-sizing: border-box
}

.re-Form_TextTab dt{
font-size: 14px;
color: #222;
ma rgin-bo ttom: 8px;
font-weight: normal
}

.re-Form_TextTab dd{
ma rgin-bo ttom: 20px;
ma rgin-left: 0;
line-height: 1.3em
}

.re-Form_TextTab-name input[type=text]{
width: 100%;
font-size: 14px;
padding: 10px;
border: so lid 1px #999;
box-sizing: border-box;
bac kground: #fff
}

.re-Form_TextTab-name{
position: rela tive
}

.re-Form_TextTab-text{
position: rela tive
}

.re-Form_TextTab-text text area{
width: 100%;
font-size: 14px;
padding: 10px;
border: so lid 1px #999;
box-sizing: border-box;
bac kground: #fff
}

.textTab-Caution{
position: absolute;
bac kground-color: #fff;
border: 1px so lid #979797;
border-radius: 7px;
top: 140px;
width: 100%;
color: #222;
padding: 10px;
font-size: 12px;
box-sizing: border-box;
box-shadow: 1px 2px 2px rgba(0,0,0,.15)
}

.textTab-name-Caution{
top: 40px
}

.textTab-Caution: before{
content: "";
position: absolute;
top: -17px;
left: 50%;
ma rgin-left: -8px;
border: 8px so lid tran spa rent;
border-bo ttom: 10px so lid #fff;
z-index: 1
}

.textTab-Caution: after{
content: "";
position: absolute;
top: -18px;
left: 50%;
ma rgin-left: -8px;
z-index: 0;
border: 8px so lid tran spa rent;
border-bo ttom: 10px so lid #979797
}

.re-Form_TextTab-btn{
ma rgin: 20px 0
}

.re-Form_TextTab-btn>a,button.re-Form_TextTab-btn{
display: b lock;
width: 100%;
padding: 20px 10px;
box-sizing: border-box;
text-align: center;
color: #fff;
font-size: 16px;
bac kground: #ffaf19
}

.re-Form_TextTab-btn>a.disabled{
bac kground: #ea eaea;
color: #999;
border: #d6d6d6;
pointer-events: none
}

.re-Form_Oek aki koTab{
width: 100%;
padding: 0 10px;
max-width: 490px;
ma rgin: 20px auto 40px;
box-sizing: border-box
}

.re-Form_Oek aki koTab dl{
ma rgin: 0 0 40px;
padding: 0
}

.re-Form_Oek aki koTab dt{
font-size: 14px;
color: #222;
ma rgin-bo ttom: 8px;
font-weight: normal
}

.re-Form_Oek aki koTab dd{
display: table;
width: 100%;
ma rgin-bo ttom: 20px;
position: rela tive;
ma rgin-left: 0;
line-height: 1.3em
}

.re-Form_Oek aki koTab-label{
display: table-cell;
ver tical-align: middle
}

.re-Form_Oek aki koTab-label p{
width: 20px;
height: 40px;
text-align: center;
line-height: 40px;
font-size: 14px;
color: #747474
}

.re-Form_Oek aki koTab-input{
position: rela tive;
display: table-cell;
width: 100%
}

.re-Form_Oek aki koTab-input>input[type=text]{
width: 100%;
font-size: 14px;
padding: 10px;
height: 40px;
border: so lid 1px #999;
box-sizing: border-box;
bac kground: #fff
}

.re-Form_Oek aki koTab-updown{
display: table-cell;
padding: 0 20px
}

.re-Form_Oek aki koTab-updown>input[type=button]{
width: 40px;
height: 40px;
line-height: 36px;
font-size: 20px;
text-align: center;
color: #747474;
bac kground: #ea eaea;
border: so lid 1px #d6d6d6;
border-radius: 0;
box-sizing: border-box;
outline: 0
}

.re-Form_Oek aki koTab-sizemax{
display: table-cell
}

.re-Form_Oek aki koTab-sizemax>input[type=button]{
width: 60px;
height: 40px;
line-height: 40px;
font-size: 14px;
text-align: center;
color: #222;
bac kground: #ea eaea;
border: so lid 1px #d6d6d6;
border-radius: 0;
box-sizing: border-box;
outline: 0
}

.re-Form_Oek aki koTab-btn{
ma rgin: 20px 0
}

.re-Form_Oek aki koTab-btn>a{
display: b lock;
width: 100%;
padding: 20px 10px;
box-sizing: border-box;
text-align: center;
color: #fff;
font-size: 16px;
bac kground: #ffaf19
}

.re-Form_Oek aki koTab-btn>a.disabled{
bac kground: #ea eaea;
color: #999;
border: #d6d6d6
}

.ru-Column{
position: rela tive;
padding: 10px 0 0px
}

.ru-Column_Text{
padding: 10px;
font-size: 12px;
color: #222;
text-align: jus tify;
text-jus tify: inter-id eog raph
}

.ru-Agree_Box{
position: sticky;
width: 100%;
bo ttom: 30px;
bac kground-color: #fff;
max-width: 768px;
padding-bo ttom: 50px
}

.ru-Agree_Box: before{
content: "";
position: absolute;
display: b lock;
width: 100%;
height: 20px;
top: -20px;
box-shadow: 0px -6px 4px -4px rgba(0,0,0,.15) inset
}

.ru-Agree_Box-text{
padding: 20px 10px;
font-size: 12px;
font-weight: bold;
text-align: center
}

.ru-Agree_Box-btn{
text-align: center;
padding: 0 10px 10px;
ma rgin: 0 auto;
width: 256px;
font-size: 0;
-webkit-box-pack: center;
jus tify-content: center
}

.ru-Agree_Box-btn>li{
width: 50%;
bac kground-color: #747474;
color: #fff;
font-size: 14px;
text-align: center;
height: 44px;
line-height: 44px;
ver tical-align: middle
}

.ru-Agree_Box-btn>button{
width: 100%;
color: #fff;
font-size: 14px;
line-height: 44px;
ma rgin-top: 10px;
bac kground-color: #ffaf19;
cursor: pointer
}

.sr-Header_SearchMenu{
width: 100%;
bac kground: #222;
box-shadow: 0 0 2px rgba(0,0,0,.8)
}

.sr-Header_SearchMenu-inner{
width: 100%;
max-width: 768px;
ma rgin: 0 auto
}

.sr-Header_SearchInput{
ma rgin: 0 10px;
padding-bo ttom: 10px;
position: rela tive
}

.sr-Header_SearchInput input[type=search]{
width: 100%;
height: 32px;
font-size: 16px;
padding: 6px 24px 6px 28px;
border: 0;
border-radius: 6px;
bac kground: #fff url(/img/icon_search_input.png) no-repeat left 0 center;
bac kground-size: 28px auto
}

.sr-Header_SearchInput input[type=search]: : -webkit-search-cancel-button{
opacity: .8
}

.sr-Header_SearchInput button[type=reset].search-Input_Clear{
position: absolute;
top: 6px;
right: 6px;
width: 20px;
height: 20px;
bac kground-color: tran spa rent;
border: none;
cursor: pointer;
outline: none;
padding: 0;
appeara nce: none
}

.sr-Header_SearchInput button[type=reset].search-Input_Clear: : before,.sr-Header_SearchInput button[type=reset].search-Input_Clear: : after{
position: absolute;
top: 50%;
left: 50%;
width: 15px;
height: 1px;
bac kground-color: #4c 4c4c;
border-radius: 9999px;
content: ""
}

.sr-Header_SearchInput button[type=reset].search-Input_Clear: : before{
transform: tran slate(-50%, -50%) rotate(45deg)
}

.sr-Header_SearchInput button[type=reset].search-Input_Clear: : after{
transform: tran slate(-50%, -50%) rotate(-45deg)
}

.sr-Header_SearchInput input[type=search].search-Input_Inpu tForm: : -webkit-search-cancel-button{
-webkit-appeara nce: none
}

.sr-search-query{
padding: 12px 10px;
font-size: 16px
}

.sr-search-query>.sr-search-query-key word{
font-size: 24px
}

.sr-match-art icle>.sr-match-art icle-summary{
color: #999;
ma rgin-left: 10px;
ma rgin-right: 10px;
ma rgin-bo ttom: 12px;
font-size: 12px
}

.sr-Navi{
width: 100%;
overflow: hi dden;
height: 48px;
bac kground: #ea eaea;
ma rgin-bo ttom: 20px
}

.sr-Navi_Inner{
height: 60px;
width: 100%;
overflow-x: auto;
-webkit-overflow-scrolling: touch
}

.sr-Navi_List{
display: inline-table;
max-width: 100%;
padding: 10px 0
}

.sr-Navi_List>li{
font-size: 12px;
display: table-cell;
ver tical-align: middle;
text-align: center;
border-right: so lid 1px #d6d6d6;
white-space: nowrap
}

.sr-Navi_List>li: last-child{
border-right: none
}

.sr-Navi_List>li.active{
position: rela tive;
color: #222;
font-weight: bold;
padding: 0px 1.5em;
box-sizing: border-box
}

.sr-Navi_List>li.active: after{
content: "";
position: absolute;
left: 0;
bo ttom: -10px;
display: b lock;
width: 100%;
height: 4px;
bac kground: #ffaf19
}

.sr-Navi_List>li>a{
display: b lock;
color: #999;
padding: 4px 1.5em;
box-sizing: border-box
}

.sr-Navi_List-num{
display: b lock;
font-size: 10px;
font-weight: normal;
color: #747474
}

.sr-List_SortMenu{
ma rgin: 0 10px 10px
}

.sr-List_SortMenu-select{
-moz-appeara nce: none;
-webkit-appeara nce: none;
appeara nce: none;
border-radius: 0;
border: 0;
ma rgin: 0;
padding: 0;
bac kground: none tran spa rent;
ver tical-align: middle;
font-size: inherit;
color: inherit;
box-sizing: content-box
}

.sr-List_SortMenu-select{
position: rela tive;
width: 150px;
height: 30px;
font-size: 10px;
color: #747474;
padding: 0 30px 0 5px;
border-radius: 0px;
border: so lid 1px #999;
box-sizing: border-box;
box-shadow: none;
bac kground: #fff url(/img/icon_arrow-select.png) no-repeat right center;
bac kground-size: 30px 30px
}

.sr-List{
padding: 0;
ma rgin-bo ttom: 24px
}

.sr-List>li{
padding: 12px 0px;
ma rgin: 0 10px;
border-bo ttom: so lid 1px #d6d6d6
}

.sr-List>li: last-child{
border-bo ttom: none
}

.sr-List>li.gold-sp{
padding-left: 28px;
bac kground: url(/img/icon_nicoad-gold.png) no-repeat;
bac kground-size: 24px auto;
bac kground-position: left top 8px
}

.sr-List>li.gold-sp .sw-Column_Art icle-summary{
ma rgin-left: -28px
}

.sr-List>li.gold-sp .sw-Column_Update{
ma rgin-left: -28px
}

.sr-List>li.silver-sp{
padding-left: 28px;
bac kground: url(/img/icon_nicoad-silver.png) no-repeat;
bac kground-size: 24px auto;
bac kground-position: left top 8px
}

.sr-List>li.silver-sp .sw-Column_Art icle-summary{
ma rgin-left: -28px
}

.sr-List>li.silver-sp .sw-Column_Update{
ma rgin-left: -28px
}

.sr-List>li.sr-List_Nicoad{
padding: 0;
ma rgin: -1px 0 0 0;
border-top: so lid 1px #d6d6d6
}

.sr-List>li.sr-List_Nicoad: before{
content: "";
display: b lock;
width: 100%;
height: 10px;
bac kground: -webkit-lin ear-gradi ent(top, rgba(0, 0, 0, 0.1) 0%, rgba(255, 255, 255, 0))
}

.sr-List>li.sr-List_Nicoad: after{
content: "";
display: b lock;
width: 100%;
height: 10px;
bac kground: -webkit-lin ear-gradi ent(top, rgba(255, 255, 255, 0) 0%, rgba(0, 0, 0, 0.1))
}

.sr-List_Nicoad-list{
padding: 4px 10px
}

.sr-List_Nicoad-it em{
padding: 12px 0px;
border-bo ttom: so lid 1px #d6d6d6;
display: -webkit-box;
display: -ms-flexbox;
display: flex
}

.sr-List_Nicoad-it em: last-child{
border-bo ttom: none
}

.sr-List_Nicoad-title{
flex: 1 1 auto;
overflow: hi dden;
padding-left: 28px;
bac kground: url(/img/icon_nicoad-silver.png) no-repeat;
bac kground-size: 24px auto;
bac kground-position: left top -2px
}

.search-art icle-summary_label-wrap{
display: flex;
ma rgin-top: 10px
}

.search-art icle-summary_label{
display: b lock;
cursor: pointer
}

#search-art icle-summary_checkbox{
display: none;
ma rgin-left: 16px
}

#search-art icle-summary_checkbox: checked+.search-art icle-summary_checkbox-text: : before{
border: 1px so lid #14 7cc2;
bac kground-color: #14 7cc2
}

#search-art icle-summary_checkbox: checked+.search-art icle-summary_checkbox-text: : after{
opacity: 1
}

.search-art icle-summary_checkbox-text{
display: b lock;
position: rela tive;
padding-left: 20px
}

.search-art icle-summary_checkbox-text: : before{
position: absolute;
top: 2px;
left: 0;
border: 1px so lid #c8c8c8;
bac kground-color: #fff;
border-radius: 2px;
width: 12px;
height: 12px;
content: ""
}

.search-art icle-summary_checkbox-text: : after{
position: absolute;
top: 6px;
left: 2px;
bac kground-image: url(/img/icon_check-white.svg);
bac kground-repeat: no-repeat;
bac kground-position: 0 0;
bac kground-size: 10px 7px;
width: 10px;
height: 7px;
content: "";
opacity: 0
}

.gold-sp .sr-List_Nicoad-title{
bac kground: url(/img/icon_nicoad-gold.png) no-repeat;
bac kground-size: 24px auto
}

.silver-sp .sr-List_Nicoad-title{
bac kground: url(/img/icon_nicoad-silver.png) no-repeat;
bac kground-size: 24px auto
}

.sr-List_Nicoad-link{
display: b lock;
font-size: 14px
}

.sr-List_Nicoad-supporter{
font-size: 10px;
color: #999;
ma rgin-top: 2px
}

.sr-List_Nicoad-point{
flex: 0 0 auto;
width: 65px;
font-size: 10px;
height: 20px;
line-height: 20px;
border-radius: 20px;
bac kground: #ccd7d9;
text-align: center;
color: #5f6467;
ma rgin-left: 16px
}

.gold-sp .sr-List_Nicoad-point{
color: #987600;
bac kground: #f6d538
}

.silver-sp .sr-List_Nicoad-point{
color: #5f6467;
bac kground: #ccd7d9
}

.gold-sp .sr-List_Nicoad-point a{
display: b lock;
color: #987600
}

.silver-sp .sr-List_Nicoad-point a{
display: b lock;
color: #5f6467
}

.st-Ad{
position: rela tive;
padding: 20px 0px;
width: 100%;
box-sizing: border-box;
overflow: hi dden
}

.st-Ad: before{
content: "";
display: b lock;
position: absolute;
top: 0;
left: 0;
width: 10 6%;
height: 20px;
ma rgin-left: -3%
}

.st-Ad: after{
content: "";
display: b lock;
position: absolute;
bo ttom: 0;
left: 0;
width: 10 6%;
height: 20px;
ma rgin-left: -3%
}

.st-Ad_Normal{
max-width: 420px;
ma rgin: 0 auto;
text-align: center
}

#dic_sp_300x 250_north_up{
min-height: 254px
}

body,html{
ma rgin: 0
}

#video{
max-width: 420px;
width: 100%
}

.st-Footer{
width: 100%;
height: 50px;
bac kground: #222;
ma rgin-top: -50px;
position: rela tive
}

.st-Footer_Inner{
padding: 10px;
width: 100%;
display: flex;
jus tify-content: space-be tween;
max-width: 768px;
ma rgin: 0 auto;
box-sizing: border-box;
font-size: 12px
}

.st-Footer_Inner: after{
content: " ";
display: b lock;
clear: both
}

.st-Footer_Copy{
line-height: 30px;
color: #fff;
font-size: 9px
}

.st-Footer_Btn-create{
flex-shrink: 0;
padding: 0 3px
}

.st-Footer_Btn-create a{
display: b lock;
width: 120px;
text-align: center;
color: #fff;
bac kground: #ffaf19 url(/img/icon_fotter_edit-pen.png) no-repeat;
bac kground-size: auto 14px;
bac kground-position: left 6px center;
line-height: 30px;
border-radius: 6px;
padding-left: 12px
}

.st-Footer_Btn-pc{
flex-shrink: 0;
text-align: center;
font-size: 10px
}

.st-Footer_Btn-pc a{
display: b lock;
width: 36px;
bac kground: #fff;
line-height: 30px;
border-radius: 6px;
color: #747474
}

.st-Header_Ad{
display: b lock;
bac kground: #fff;
width: 100%;
text-align: center;
font-size: 0;
position: -webkit-sticky;
position: sticky;
top: 0;
left: 0;
z-index: 99
}

.st-Header_Ad-cl ose{
position: absolute;
top: 8px;
right: 8px;
display: b lock;
width: 24px;
height: 24px;
font-size: 20px;
color: #999;
text-align: center;
box-sizing: border-box;
line-height: 21px;
bac kground: rgba(255,255,255,.25)
}

.st-Header_Ad-cl ose-wrap per{
top: 0px;
right: 0px;
width: 36px;
height: 36px;
display: b lock;
position: absolute
}

.st-Header{
width: 100%;
height: auto
}

.st-Header_Btn-main menu{
position: rela tive;
display: inline-b lock;
width: 40px;
height: 48px;
ver tical-align: middle;
box-sizing: border-box;
bac kground: url(/img/icon_humberger.png) no-repeat center center;
bac kground-size: 40px auto
}

.st-Header_Btn-main menu.active{
bac kground: url(/img/icon_humberger_active.png) no-repeat center center;
bac kground-size: 40px auto
}

.st-Header_Btn-main menu a{
display: b lock;
height: 100%
}

.st-Header_Main Menu{
max-width: 768px;
ma rgin: 0 auto;
padding: 10px;
bac kground-color: #d7d7d7;
box-shadow: 0 0 2px rgba(0,0,0,.8)
}

.st-Header_Main Menu dl{
bac kground: #fff;
padding: 0
}

.st-Header_Main Menu dt{
padding: 5px;
font-size: 10px;
color: #fff;
bac kground: #ffaf19;
font-weight: normal
}

.st-Header_Main Menu dd{
padding: 10px 10px 10px 40px;
font-size: 14px;
border-bo ttom: so lid 1px #999;
ma rgin-left: 0;
line-height: 1.3em
}

.st-Header_Main Menu dd a{
display: b lock;
color: #000
}

.st-Header_Main Menu dd: last-child{
border-bo ttom: none
}

.st-Header_Btn-search{
position: rela tive;
display: inline-b lock;
width: 40px;
height: 48px;
ver tical-align: middle;
box-sizing: border-box;
bac kground: url(/img/icon_search .png) no-repeat center center;
bac kground-size: 40px auto
}

.st-Header_Btn-search.active{
bac kground: url(/img/icon_search_active.png) no-repeat center center;
bac kground-size: 40px auto
}

.st-Header_Btn-search: after{
content: "";
position: absolute;
top: 12px;
right: 0;
display: b lock;
width: 1px;
height: 25px;
border-right: #636363 so lid 1px;
bac kground-size: 100%
}

.st-Header_Btn-search a{
display: b lock;
height: 100%
}

.st-Header_SearchMenu{
width: 100%;
bac kground: #222;
box-shadow: 0 0 2px rgba(0,0,0,.8)
}

.st-Header_SearchMenu-inner{
width: 100%;
max-width: 768px;
ma rgin: 0 auto
}

.st-Header_SearchInput{
padding: 0 10px 10px
}

.st-Header_SearchInput input[type=search]{
width: 100%;
height: 32px;
font-size: 16px;
padding: 6px 24px 6px 28px;
border: 0;
border-radius: 6px;
bac kground: #fff url(/img/icon_search_input.png) no-repeat left 0 center;
bac kground-size: 28px auto
}

.st-Header_SearchInput input[type=search]: : -webkit-search-cancel-button{
opacity: .8
}

.st-Header_SearchInput button[type=reset].search-Input_Clear{
position: absolute;
top: 6px;
right: 16px;
width: 20px;
height: 20px;
bac kground-color: tran spa rent;
border: none;
cursor: pointer;
outline: none;
padding: 0;
appeara nce: none
}

.st-Header_SearchInput button[type=reset].search-Input_Clear: : before,.st-Header_SearchInput button[type=reset].search-Input_Clear: : after{
position: absolute;
top: 50%;
left: 50%;
width: 15px;
height: 1px;
bac kground-color: #4c 4c4c;
border-radius: 9999px;
content: ""
}

.st-Header_SearchInput button[type=reset].search-Input_Clear: : before{
transform: tran slate(-50%, -50%) rotate(45deg)
}

.st-Header_SearchInput button[type=reset].search-Input_Clear: : after{
transform: tran slate(-50%, -50%) rotate(-45deg)
}

.st-Header_SearchInput input[type=search].search-Input_Inpu tForm: : -webkit-search-cancel-button{
-webkit-appeara nce: none
}

.st-Header_Push Word{
bac kground: #ea eaea;
padding: 10px
}

.st-Header_Push Word-title{
width: 100%;
max-width: 768px;
font-size: 10px;
color: #535353;
ma rgin: 0 auto 8px
}

.st-Header_Push Word-title: before{
content: "";
display: inline-b lock;
width: 18px;
height: 18px;
bac kground: url(/img/icon_pus hword.png) no-repeat center center;
bac kground-size: 18px auto;
ver tical-align: middle
}

.st-Header_Push Word-list{
width: 100%;
max-width: 768px;
ma rgin: 0 auto;
font-size: 0
}

.st-Header_Push Word-list li{
max-width: 100%;
white-space: nowrap;
overflow: hi dden;
text-overflow: ell ip sis;
display: inline-b lock;
font-size: 12px;
line-height: 1;
color: #747474;
border: 1px so lid #999;
border-radius: 4px;
ma rgin: 0 10px 6px 0;
box-sizing: border-box
}

.st-Header_Push Word-list li a{
color: #747474;
padding: 8px 10px;
display: inline-b lock
}

.st-Header_Push Word-list li: last-child{
ma rgin-right: 0
}

.st-Header_Push Word-more{
width: 100%;
max-width: 768px;
ma rgin: 0 auto;
text-align: right;
font-size: 10px
}

.st-Header_Push Word-more a{
color: #1e7dc0
}

.st-Header_Btn-global menu{
position: rela tive;
display: inline-b lock;
width: 40px;
height: 48px;
ver tical-align: middle;
box-sizing: border-box;
bac kground: url(/img/icon_menu.png) no-repeat center center;
bac kground-size: 40px auto
}

.st-Header_Btn-global menu.active{
bac kground: url(/img/icon_menu_active.png) no-repeat center center;
bac kground-size: 40px auto
}

.st-Header_Btn-global menu a{
display: b lock;
height: 100%
}

.st-Header_Global Menu{
width: 100%;
bac kground: #d7d7d7;
box-sizing: border-box;
box-shadow: 0 0 2px rgba(0,0,0,.8)
}

.st-PopupInline{
width: 100%;
max-width: 320px;
bac kground: #fff;
ma rgin: 0 auto;
border-radius: 8px;
box-sizing: border-box
}

.st-PopupInline_Text Area{
padding: 30px 20px
}

.st-PopupInline_Text Area-text{
text-align: center;
font-size: 14px;
color: #222
}

.st-PopupInline_BtnArea{
display: table;
width: 100%;
border-top: so lid 1px #d6d6d6
}

.st-PopupInline_Btn{
display: table-cell;
border-right: so lid 1px #d6d6d6
}

.st-PopupInline_Btn: last-of-type{
border-right: none
}

.st-PopupInline_Btn a{
width: 100%;
display: b lock;
padding: 20px;
font-size: 14px;
color: #1e7dc0;
text-align: center;
box-sizing: border-box
}

.st-PopupInline_Btn-two{
width: 50%
}

.mfp-zoom-in.mfp-ready.mfp-bg.st-PopupTimer_Bg{
opacity: 0
}

#am-WatchList_Add{
max-width: 280px;
bac kground: rgba(83,83,83,.9)
}

#am-WatchList_Add .st-PopupInline_Text Area{
padding: 25px 20px 30px
}

#am-WatchList_Add .st-PopupInline_Text Area-text{
color: #fff;
padding-top: 35px;
bac kground: url(/img/icon_check-wh .png) no-repeat center top -5px;
bac kground-size: 40px auto
}

#st-Hometa_Notyet{
max-width: 150px;
bac kground: rgba(83,83,83,.9)
}

#st-Hometa_Notyet .st-PopupInline_Text Area{
padding: 20px
}

#st-Hometa_Notyet .st-PopupInline_Text Area-text{
color: #fff;
padding-top: 90px;
bac kground: url(/img/icon_hometa-wh-big.png) no-repeat center top;
bac kground-size: 80px auto
}

.mfp-bg{
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1042;
overflow: hi dden;
position: fixed;
bac kground: rgba(0,0,0,.35)
}

.mfp-wrap{
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1043;
position: fixed;
outline: none !imp ort ant;
-webkit-bac kface-vi sibility: hi dden
}

.mfp-cont ainer{
text-align: center;
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
padding: 0 8px;
box-sizing: border-box
}

.mfp-cont ainer: before{
content: "";
display: inline-b lock;
height: 100%;
ver tical-align: middle
}

.mfp-align-top .mfp-cont ainer: before{
display: none
}

.mfp-content{
position: rela tive;
display: inline-b lock;
ver tical-align: middle;
ma rgin: 0 auto;
text-align: left;
z-index: 1045
}

.mfp-inline-holder .mfp-content,.mfp-ajax-holder .mfp-content{
width: 100%;
cursor: auto
}

.mfp-ajax-cur{
cursor: pr og ress
}

.mfp-zoom-out-cur,.mfp-zoom-out-cur .mfp-image-holder .mfp-cl ose{
cursor: zoom-out
}

.mfp-zoom{
cursor: pointer;
cursor: zoom-in
}

.mfp-auto-cursor .mfp-content{
cursor: auto
}

.mfp-cl ose,.mfp-arrow,.mf p-preloader,.mfp-counter{
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none
}

.mfp-loading.mfp-fig ure{
display: none
}

.mfp-hide{
display: none !imp ort ant
}

.mf p-preloader{
color: #ccc;
position: absolute;
top: 50%;
width: auto;
text-align: center;
ma rgin-top: -0.8em;
left: 8px;
right: 8px;
z-index: 1044
}

.mf p-preloader a{
color: #ccc
}

.mf p-preloader a: hover{
color: #fff
}

.mfp-s-ready .mf p-preloader{
display: none
}

.mfp-s-error .mfp-content{
display: none
}

button.mfp-cl ose,button.mfp-arrow{
overflow: vi sible;
cursor: pointer;
bac kground: tran spa rent;
border: 0;
-webkit-appeara nce: none;
display: b lock;
outline: none;
padding: 0;
z-index: 1046;
box-shadow: none;
touch-action: manipula tion
}

button: : -moz-focus-inner{
padding: 0;
border: 0
}

.mfp-cl ose{
width: 44px;
height: 44px;
line-height: 44px;
position: absolute;
right: 0;
top: 0;
text-dec oration: none;
text-align: center;
opacity: .65;
padding: 0 0 18px 10px;
color: #fff;
font-style: normal;
font-size: 28px;
font-f amily: Arial,Baskerville,mon ospace
}

.mfp-cl ose: hover,.mfp-cl ose: focus{
opacity: 1
}

.mfp-cl ose: active{
top: 1px
}

.mfp-cl ose-btn-in .mfp-cl ose{
color: #333
}

.mfp-image-holder .mfp-cl ose,.mfp-if rame-holder .mfp-cl ose{
color: #fff;
right: -6px;
text-align: right;
padding-right: 6px;
width: 100%
}

.mfp-counter{
position: absolute;
top: 0;
right: 0;
color: #ccc;
font-size: 12px;
line-height: 18px;
white-space: nowrap
}

.mfp-arrow{
position: absolute;
opacity: .65;
ma rgin: 0;
top: 50%;
ma rgin-top: -55px;
padding: 0;
width: 90px;
height: 110px;
-webkit-tap-hig hlight-color: tran spa rent
}

.mfp-arrow: active{
ma rgin-top: -54px
}

.mfp-arrow: hover,.mfp-arrow: focus{
opacity: 1
}

.mfp-arrow: before,.mfp-arrow: after{
content: "";
display: b lock;
width: 0;
height: 0;
position: absolute;
left: 0;
top: 0;
ma rgin-top: 35px;
ma rgin-left: 35px;
border: medium inset tran spa rent
}

.mfp-arrow: after{
border-top-width: 13px;
border-bo ttom-width: 13px;
top: 8px
}

.mfp-arrow: before{
border-top-width: 21px;
border-bo ttom-width: 21px;
opacity: .7
}

.mfp-arrow-left{
left: 0
}

.mfp-arrow-left: after{
border-right: 17px so lid #fff;
ma rgin-left: 31px
}

.mfp-arrow-left: before{
ma rgin-left: 25px;
border-right: 27px so lid #3f 3f3f
}

.mfp-arrow-right{
right: 0
}

.mfp-arrow-right: after{
border-left: 17px so lid #fff;
ma rgin-left: 39px
}

.mfp-arrow-right: before{
border-left: 27px so lid #3f 3f3f
}

.mfp-if rame-holder{
padding-top: 40px;
padding-bo ttom: 40px
}

.mfp-if rame-holder .mfp-content{
line-height: 0;
width: 100%;
max-width: 900px
}

.mfp-if rame-holder .mfp-cl ose{
top: -40px
}

.mfp-if rame-scaler{
width: 100%;
height: 0;
overflow: hi dden;
padding-top: 56.25%
}

.mfp-if rame-scaler if rame{
position: absolute;
display: b lock;
top: 0;
left: 0;
width: 100%;
height: 100%;
box-shadow: 0 0 8px rgba(0,0,0,.6);
bac kground: #000
}

img.mfp-img{
width: auto;
max-width: 100%;
height: auto;
display: b lock;
line-height: 0;
box-sizing: border-box;
padding: 40px 0;
ma rgin: 0 auto
}

.mfp-fig ure{
line-height: 0
}

.mfp-fig ure: after{
content: "";
position: absolute;
left: 0;
top: 40px;
bo ttom: 40px;
display: b lock;
right: 0;
width: auto;
height: auto;
z-index: -1;
box-shadow: 0 0 8px rgba(0,0,0,.6);
bac kground: #444
}

.mfp-fig ure sm all{
color: #b db dbd;
display: b lock;
font-size: 12px;
line-height: 14px
}

.mfp-fig ure fig ure{
ma rgin: 0
}

.mfp-bot tom-bar{
ma rgin-top: -36px;
position: absolute;
top: 100%;
left: 0;
width: 100%;
cursor: auto
}

.mfp-title{
text-align: left;
line-height: 18px;
color: #f 3f 3f3;
word-wrap: break-word;
padding-right: 36px
}

.mfp-image-holder .mfp-content{
max-width: 100%
}

.mfp-gallery .mfp-image-holder .mfp-fig ure{
cursor: pointer
}

@media screen and (max-width: 800px)and (orien tation: lands cape),screen and (max-height: 300px){
.mfp-img-mobile .mfp-image-holder{
padding-left: 0;
padding-right: 0
}

.mfp-img-mobile img.mfp-img{
padding: 0
}

.mfp-img-mobile .mfp-fig ure: after{
top: 0;
bo ttom: 0
}

.mfp-img-mobile .mfp-fig ure sm all{
display: inline;
ma rgin-left: 5px
}

.mfp-img-mobile .mfp-bot tom-bar{
bac kground: rgba(0,0,0,.6);
bo ttom: 0;
ma rgin: 0;
top: auto;
padding: 3px 5px;
position: fixed;
box-sizing: border-box
}

.mfp-img-mobile .mfp-bot tom-bar: empty{
padding: 0
}

.mfp-img-mobile .mfp-counter{
right: 5px;
top: 3px
}

.mfp-img-mobile .mfp-cl ose{
top: 0;
right: 0;
width: 35px;
height: 35px;
line-height: 35px;
bac kground: rgba(0,0,0,.6);
position: fixed;
text-align: center;
padding: 0
}

}

@media all and (max-width: 900px){
.mfp-arrow{
-webkit-transform: scale(0.75);
transform: scale(0.75)
}

.mfp-arrow-left{
-webkit-transform-origin: 0;
transform-origin: 0
}

.mfp-arrow-right{
-webkit-transform-origin: 100%;
transform-origin: 100%
}

.mfp-cont ainer{
padding-left: 10px;
padding-right: 10px
}

}

.mfp-zoom-in .mfp-with-anim{
opacity: 0;
tran sition: all .3s ease-in-out;
-webkit-transform: scale(0.8);
transform: scale(0.8)
}

.mfp-zoom-in.mfp-bg{
opacity: 0;
tran sition: all .3s ease-out
}

.mfp-zoom-in.mfp-ready .mfp-with-anim{
opacity: 1;
-webkit-transform: scale(1);
transform: scale(1)
}

.mfp-zoom-in.mfp-ready.mfp-bg{
opacity: .8
}

.mfp-zoom-in.mfp-remo ving .mfp-with-anim{
-webkit-transform: scale(0.8);
transform: scale(0.8);
opacity: 0
}

.mfp-zoom-in.mfp-remo ving.mfp-bg{
opacity: 0
}

.wl-Column_Title{
padding: 10px 90px 0 10px;
font-size: 20px;
color: #222
}

.wl-Counter{
width: 80px;
position: absolute;
top: 5px;
right: 10px;
text-align: right;
font-size: 0
}

.wl-Counter_Num{
font-size: 16px;
color: #222
}

.wl-Counter_Num-label{
font-size: 10px;
color: #999;
ma rgin-right: 4px
}

.wl-Counter_Caption{
font-size: 10px;
color: #999
}

.wl-Column_Status{
display: table;
ma rgin-top: 8px
}

.wl-Column_Status-row{
display: table-row;
width: 100%
}

.wl-Column_Status-update{
display: table-cell;
width: 100%
}

.wl-Column_Link-edit{
display: table-cell;
ver tical-align: bo ttom;
font-size: 10px;
padding-top: 10px
}

.wl-Column_Status-delete{
display: table-cell;
ver tical-align: bo ttom;
font-size: 10px;
padding-top: 10px
}

.wl-Column_Status-delete a{
display: b lock;
width: 70px;
color: #1e7dc0
}

#wl-delete .st-PopupInline_Text Area-text{
text-align: center
}

.tp-Info{
width: 100%;
bac kground: #f ffcd8
}

.tp-Info_Inner{
width: 100%;
max-width: 768px;
ma rgin: 0 auto;
box-sizing: border-box
}

.tp-Info_Inner li{
color: #f58200;
border-bo ttom: 1px so lid #f58200;
font-size: 10px;
white-space: nowrap;
overflow: hi dden;
text-overflow: ell ip sis;
bac kground: url(/img/icon_info.png) no-repeat left 10px center;
bac kground-size: 16px auto;
position: rela tive
}

.tp-Info_Inner li: last-child{
border-bo ttom: 1px so lid #f58200
}

.tp-Info_Inner li a{
color: inherit;
display: b lock;
position: rela tive;
padding: 10px 30px 10px 30px;
overflow: hi dden;
text-overflow: ell ip sis
}

.tp-Info_Inner li: after{
content: "";
position: absolute;
top: 50%;
ma rgin-top: -15px;
right: 5px;
width: 30px;
height: 30px;
bac kground: url(/img/icon_arrow-right-wh .png) no-repeat right center;
bac kground-size: 20px
}

.tp-PushWord .sw-Column_Title{
padding-left: 35px;
bac kground: url(/img/icon_pus hword.png) no-repeat left center;
bac kground-size: 40px auto
}

.tp-Popu lar Art icle .sw-Column_Title{
padding-left: 35px;
bac kground: url(/img/icon_hometa-bold.png) no-repeat left center;
bac kground-size: 42px auto
}

.tp-Popu lar Art icle .sw-Column_List,.tp-PushWord .sw-Column_List{
counter-reset: rank-label
}

.tp-Popu lar Art icle .sw-Column_List>li,.tp-PushWord .sw-Column_List>li{
position: rela tive;
counter-incre ment: rank-label 1;
padding-left: 30px
}

.tp-Popu lar Art icle .sw-Column_List>li: before,.tp-PushWord .sw-Column_List>li: before{
content: counter(rank-label);
position: absolute;
top: 10px;
left: 0;
display: b lock;
width: 22px;
height: 22px;
line-height: 22px;
text-align: center;
font-size: 12px;
color: #fff;
bac kground: #d6d6d6
}

.tp-Popu lar Art icle .sw-Column_List>li: nth-of-type(1): before,.tp-PushWord .sw-Column_List>li: nth-of-type(1): before{
bac kground: #f58200
}

.tp-Popu lar Art icle .sw-Column_List>li: nth-of-type(2): before,.tp-PushWord .sw-Column_List>li: nth-of-type(2): before{
bac kground: #ffaf19
}

.tp-Popu lar Art icle .sw-Column_List>li: nth-of-type(3): before,.tp-PushWord .sw-Column_List>li: nth-of-type(3): before{
bac kground: #f fcb2c
}

.sw-Art icle_Sub Contents .tp-PushWord .sw-Column_List>li: nth-of-type(6): before{
content: "PR"
}

.tp-WeeklyRe com mend .sw-Column_Title{
padding-left: 35px;
bac kground: url(/img/icon_recommend.png) no-repeat left center;
bac kground-size: 40px auto
}

.tp-WeeklyRe com mend_Art icle{
padding: 10px
}

.tp-WeeklyRe com mend_Art icle a{
display: b lock;
color: #1e7dc0
}

.tp-WeeklyRe com mend_Art icle-title{
font-size: 14px;
color: #1e7dc0;
ma rgin-bo ttom: 8px
}

.tp-WeeklyRe com mend_Art icle-text{
font-size: 12px;
color: #222;
display: -webkit-box;
-webkit-box-orient: ver tical;
-webkit-line-clamp: 2;
overflow: hi dden
}

.tp-WeeklyRe com mend_Art icle-elect ion{
padding: 10px 0 10px 20px;
font-size: 12px;
color: #222;
white-space: nowrap;
overflow: hi dden;
text-overflow: ell ip sis;
bac kground: url(/img/icon_elec tion.png) no-repeat left -7px center;
bac kground-size: 30px auto
}

.tp-WeeklyIll ust .sw-Column_Title{
padding-left: 35px;
bac kground: url(/img/icon_il lust.png) no-repeat left center;
bac kground-size: 40px auto
}

.tp-WeeklyIll ust_Art icle{
padding: 10px;
text-align: center
}

.tp-WeeklyIll ust_Art icle-title{
font-size: 14px;
ma rgin-bo ttom: 8px
}

.tp-WeeklyIll ust_Art icle-title a{
color: #1e7dc0
}

.tp-WeeklyIll ust_Img{
display: inline-b lock;
position: rela tive;
font-size: 0;
ma rgin-bo ttom: 10px
}

.tp-WeeklyIll ust_Img>img{
max-width: 100%;
padding: 10px;
box-sizing: border-box;
border: ridge 10px #ffde43
}

.tp-WeeklyIll ust_Label{
font-size: 12px;
color: #222;
text-align: center
}

.tp-WeeklyP iko .sw-Column_Title{
padding-left: 35px;
bac kground: url(/img/icon_piko.png) no-repeat left center;
bac kground-size: 40px auto
}

.tp-WeeklyP iko_Art icle{
padding: 10px;
text-align: center
}

.tp-WeeklyP iko_Art icle-title{
font-size: 14px;
ma rgin-bo ttom: 8px
}

.tp-WeeklyP iko_Art icle-title a{
color: #1e7dc0
}

.tp-WeeklyP iko_Box{
display: inline-b lock;
position: rela tive;
font-size: 0;
ma rgin-bo ttom: 10px;
border: ridge 10px #ffde43;
padding: 15px 50px 15px 50px
}

.tp-WeeklyP iko_Label{
font-size: 12px;
color: #222;
text-align: center
}

.tp-NewIllust_Art icle-list{
padding: 10px
}

.tp-NewIllust_Art icle-list: after{
content: "";
display: b lock;
clear: both
}

.tp-NewIllust_Art icle-list>li{
float: left;
width: 31.33%;
ma rgin: 0 3% 0 0
}

.tp-NewIllust_Art icle-list>li>a{
display: b lock
}

.tp-NewIllust_Art icle-list>li: last-child{
ma rgin-right: 0
}

.tp-NewIllust_Box-i mg{
position: rela tive;
border: so lid 1px #999
}

.tp-NewIllust_Box-i mg: before{
content: "";
display: b lock;
padding-top: 100%
}

.tp-NewIllust_Box-i mg>img{
position: absolute;
top: 0;
left: 0;
bo ttom: 0;
right: 0;
width: 100%;
height: 100%;
obj ect-fit: con tain
}

.tp-NewIllust_Box-label{
font-size: 10px;
color: #1e7dc0;
ma rgin-top: 8px;
display: -webkit-box;
-webkit-box-orient: ver tical;
-webkit-line-clamp: 2;
overflow: hi dden
}

.tp-NewP iko_Art icle-list{
padding: 10px
}

.tp-NewP iko_Art icle-list: after{
content: "";
display: b lock;
clear: both
}

.tp-NewP iko_Art icle-list>li{
float: left;
width: 31.33%;
ma rgin: 0 3% 0 0
}

.tp-NewP iko_Art icle-list>li>a{
display: b lock
}

.tp-NewP iko_Art icle-list>li: last-child{
ma rgin-right: 0
}

.tp-NewP iko_Box-box{
position: rela tive;
padding: 10px 0px 10px 5px
}

.tp-NewP iko_Box-box: before{
content: "";
display: b lock
}

.tp-NewP iko_Box-box>img{
position: absolute;
top: 0;
left: 0;
bo ttom: 0;
right: 0;
width: 100%;
height: 100%;
obj ect-fit: con tain
}

.tp-NewP iko_Box-label{
font-size: 10px;
color: #1e7dc0;
ma rgin-top: 8px;
display: -webkit-box;
-webkit-box-orient: ver tical;
-webkit-line-clamp: 2;
overflow: hi dden
}

.tp-NewUpdate .sw-Column_Title{
padding-left: 35px;
bac kground: url(/img/icon_newupdate.png) no-repeat left center;
bac kground-size: 40px auto
}

.tp-NewArt icle .sw-Column_Title{
padding-left: 35px;
bac kground: url(/img/icon_newar ticle.png) no-repeat left center;
bac kground-size: 40px auto
}

.tp-SpNewArt icle .sw-Column_Title{
padding-left: 35px;
bac kground: url(/img/icon_edit-pen-black.png) no-repeat left center;
bac kground-size: 40px auto
}

.tp-NewRes .sw-Column_Title{
padding-left: 35px;
bac kground: url(/img/icon_res.png) no-repeat left center;
bac kground-size: 40px auto
}

.tp-Nicoad .sw-Column_Title{
padding-left: 35px;
bac kground: url(/img/icon_nicoad-bk.png) no-repeat left 8px center;
bac kground-size: 26px auto
}

body,html{
height: 100%
}

body{
font-size: 14px;
line-height: 14px;
line-height: 1.3;
color: #222;
font-fa mily: -apple-system, Blink Mac System Font, ArialMT, "Hira gino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", sans-serif;
-webkit-text-size-ad just: none
}

a{
color: #1e7dc0
}

a.auto-hdn: link, a.auto-hdn: visited{
color: #444
}

bl oc kq uote{
max-width: 100%;
border: 1px so lid #f fd248;
bac kground-image: url(/img/quote.gif);
bac kground-repeat: no-repeat;
padding-top: 10px;
padding-right: 0px;
padding-bo ttom: 10px;
padding-left: 30px;
ma rgin-left: 30px
}

.bs-Wrap per{
position: rela tive;
width: 100%;
height: 100%;
box-sizing: border-box
}

.bs-Cover{
display: b lock;
position: fixed;
font-size: 12px;
top: 0;
left: 0;
width: 100%;
height: 100%;
bac kground: rgba(0,0,0,.35);
z-index: 80
}

.bs-Wrap per_Inner{
position: rela tive;
width: 100%;
max-width: 768px;
min-height: 100%;
ma rgin: 0 auto;
padding-bo ttom: 105px;
box-sizing: border-box
}

html.smooth_scroll{
scroll-behavior: smooth
}

.sw-Art icle{
position: rela tive;
ma rgin: 15px 0
}

.sw-Art icle_Title{
display: b lock;
padding: 0 10px;
ma rgin: 15px 0;
box-sizing: border-box
}

.sw-Art icle_TitleBox{
ma rgin-top: 10px
}

.sw-Art icle_TitleBox: after{
display: b lock;
content: "";
clear: both
}

.sw-Art icle_Title-label{
font-size: 20px;
font-weight: bold;
color: #222;
ma rgin-bo ttom: 4px
}

.sw-Art icle_Title-category{
display: inline-b lock;
color: #fff;
font-size: 12px;
padding: 3px 4px;
bac kground: #999;
ver tical-align: middle;
ma rgin: -4px 0 0 4px;
border-radius: 4px
}

.sw-Art icle_Title-sub label{
font-size: 16px;
color: #222
}

.sw-Art icle_Title-yomi{
font-size: 10px;
color: #999
}

.sw-Art icle_Title-art icle-text-count-wrap{
display: flex;
ma rgin-top: 5px
}

.sw-Art icle_Title-art icle-text-count{
padding: 2px 7px;
font-size: 10px;
color: #fff;
bac kground-color: #999;
border-radius: 9999px
}

.sw-Art icle_Title-btnArticle{
width: 120px;
height: 30px;
ma rgin-top: 10px;
line-height: 28px;
font-size: 12px;
text-align: center;
box-sizing: border-box;
bac kground: url(/img/icon_newar ticle-gray.png) no-repeat left 5px center;
bac kground-size: 32px auto;
border: so lid 1px #999;
border-radius: 6px
}

.sw-Art icle_Title-btnArticle a{
display: b lock;
color: #747474;
padding-left: 20px
}

.sw-Art icle_Title-btnT hread{
float: left;
width: 150px;
height: 30px;
line-height: 28px;
font-size: 12px;
text-align: center;
box-sizing: border-box;
border: so lid 1px #999;
border-radius: 6px
}

.sw-Art icle_Title-btnT hread a{
display: b lock;
color: #747474
}

.sw-Art icle_Title-sns{
float: right;
width: 140px;
font-size: 0;
text-align: center
}

.sw-Art icle_Title-sns li{
display: inline-b lock;
ma rgin-right: 4px
}

.sw-Art icle_Title-sns li: last-child{
ma rgin-right: 0
}

.sw-Art icle_Title-sns li a{
display: b lock;
bac kground: #535353;
width: 30px;
height: 30px;
line-height: 30px;
border-radius: 50%
}

.sw-Art icle_Title-sns li img{
width: 20px;
ver tical-align: middle
}

.sw-Art icle_Title-btnT hread a: before{
content: "";
display: inline-b lock;
ver tical-align: middle;
width: 26px;
height: 28px;
bac kground: url(/img/icon_res-gray.png) no-repeat left -6px center;
bac kground-size: 36px auto;
ma rgin-top: -2px
}

.sw-Art icle_Title-count{
font-size: 10px
}

.sw-Art icle_Title-Revision{
padding: 5px 10px 5px 10px;
ma rgin: 2px 10px 2px 10px;
font-size: 12px;
color: #f58200;
border: so lid 1px #f58200
}

.sw-Art icle_Title_Reses{
ma rgin: 15px 40px 15px 0
}

.sw-Art icle_Indic ator{
position: absolute;
top: 0;
right: 0
}

.sw-Art icle_Indic ator-comment{
width: 40px;
padding-top: 20px;
text-align: center;
color: #999;
font-size: 10px;
box-sizing: border-box;
bac kground: url(/img/icon_comment-gray.png) no-repeat center top -10px;
bac kground-size: 40px auto
}

.sw-Art icle_List{
padding: 0 10px
}

.sw-Art icle_List>li{
padding: 12px 0;
border-bo ttom: so lid 1px #d6d6d6
}

.sw-Art icle_List>li>.at-List_Text{
overflow: hi dden
}

.sw-Art icle_List>li: last-child{
border-bo ttom: none
}

.sw-Art icle_Menu{
ma rgin: 0px 0 20px;
bac kground: #ea eaea
}

.sw-Art icle_Menu-fixed{
ma rgin: 0;
position: fixed;
top: 0px;
left: 0;
width: 100%;
z-index: 80
}

.sw-Art icle_Men u-li st{
display: table;
width: 100%;
max-width: 480px;
ma rgin: 0 auto;
box-sizing: border-box;
padding: 5px 10px
}

.sw-Art icle_Men u-li st>li{
display: table-cell;
width: 33.3%;
font-size: 10px;
color: #222;
text-align: center
}

.sw-Art icle_Men u-li st li: before{
content: "";
display: b lock;
ver tical-align: middle;
width: 100%;
height: 25px;
ma rgin-bo ttom: 2px
}

.sw-Art icle_Men u-li st li.sw-Art icle_Menu-homeru: before{
display: none
}

.sw-Art icle_Menu-homeru a{
outline: none;
border-style: none;
display: b lock;
color: #25 2525
}

.sw-Art icle_Menu-homeru a: before{
content: "";
display: b lock;
ver tical-align: middle;
width: 100%;
height: 25px;
bac kground: url(/img/icon_hometa.png) no-repeat center center;
bac kground-size: 40px auto;
ma rgin-bo ttom: 2px
}

.sw-Art icle_Menu-homeru.active{
color: #ffaf19
}

.sw-Art icle_Menu-homeru.active: before{
bac kground: url(/img/icon_hometa-or.png) no-repeat center center;
bac kground-size: 50px auto
}

.sw-Art icle_Menu-share: before{
bac kground: url(/img/icon_news-dg.svg) no-repeat center center;
bac kground-size: 20px auto
}

.sw-Art icle_Menu-share.active{
color: #c 5c 5c5
}

.sw-Art icle_Menu-share.active: before{
bac kground: url(/img/icon_news-dg.svg) no-repeat center center;
bac kground-size: 20px auto
}

.sw-Art icle_Men u-li st li.sw-Art icle_Menu-nicoad: before{
display: none
}

.sw-Art icle_Menu-nicoad a{
display: b lock;
color: #1 b1 b1b
}

.sw-Art icle_Menu-nicoad a: before{
content: "";
display: b lock;
width: 100%;
height: 25px;
ma rgin-bo ttom: 2px;
bac kground: url(/img/icon_nicoad-bk.png) no-repeat center center;
bac kground-size: 24px auto
}

.sw-Art icle_Menu-othre: before{
bac kground: url(/img/icon_other.png) no-repeat center center;
bac kground-size: 40px auto
}

.sw-Art icle_Menu-othre.active{
color: #c 5c 5c5
}

.sw-Art icle_Menu-othre.active: before{
bac kground: url(/img/icon_other-gray.png) no-repeat center center;
bac kground-size: 40px auto
}

.sw-Art icle_Body{
ma rgin: 20px 0
}

.sw-Art icle_Body-inner{
padding: 0 10px;
box-sizing: border-box;
overflow-x: scroll
}

.sw-Art icle_Body-inner p{
font-size: 14px;
line-height: 1.8;
ma rgin-bo ttom: 20px
}

.sw-Art icle_Body-inner p a{
color: #1e7dc0
}

.sw-Art icle_Body-inner p: last-child{
ma rgin-bo ttom: 0
}

.sw-Art icle_Body-inner h2{
padding-left: 20px;
border-bo ttom: 1px so lid #8cc700;
bac kground: url(/img/disc_l.gif) no-repeat 0px;
font-size: 20px;
font-weight: bold;
ma rgin: 30px 0 10px
}

.sw-Art icle_Body-inner h2: first-child{
ma rgin-top: 0
}

.sw-Art icle_Body-inner h3{
font-size: 18px;
padding-left: 20px;
border-bo ttom: 1px so lid #8cc700;
bac kground: url(/img/disc_m.gif) no-repeat 0px;
ma rgin: 30px 0 10px
}

.sw-Art icle_Body-inner h3: first-child{
ma rgin-top: 0
}

.sw-Art icle_Body-inner h4{
font-size: 16px;
padding-left: 20px;
border-bo ttom: 1px so lid #8cc700;
bac kground: url(/img/disc_s.gif) no-repeat 0px;
ma rgin: 30px 0 10px
}

.sw-Art icle_Body-inner h4: first-child{
ma rgin-top: 0
}

.sw-Art icle_Body-inner h5{
font-size: 14px;
padding-left: 18px;
border-bo ttom: 1px so lid #8cc700;
bac kground: url(/img/disc_ss.gif) no-repeat 0px;
ma rgin: 30px 0 10px
}

.sw-Art icle_Body-inner h5: first-child{
ma rgin-top: 0
}

.sw-Art icle_Body-inner h6{
border-bo ttom: 1px so lid #8cc700
}

.sw-Art icle_Body-inner ul{
ma rgin-bo ttom: 20px;
list-style: url(/img/li1.gif) out side
}

.sw-Art icle_Body-inner ul>li{
ma rgin: 0 0 10px 20px
}

.sw-Art icle_Body-inner ul>li>ul{
ma rgin-top: 10px
}

.sw-Art icle_Body-inner ul>li>ul>li{
position: rela tive;
ma rgin-bo ttom: 10px;
padding-left: 18px;
bac kground: url(/img/icon_arrow-right.png) left -5px top -2px no-repeat;
bac kground-size: 20px;
list-style: none
}

.sw-Art icle_Body-inner ul>li>ul>li: before{
content: "";
display: none
}

.sw-Art icle_Body-inner ol>li{
list-style: decimal out side
}

.sw-Art icle_Body-inner th{
bac kground-color: #f 1f 1f1;
padding: 2px;
border: 1px so lid #d 1d 1d1
}

.sw-Art icle_Body-inner td{
padding: 5px;
border: 1px so lid #d 1d 1d1
}

.sw-Art icle_Body-inner sup{
font-size: .7em;
ver tical-align: super
}

.sw-Art icle_Body-inner sub{
font-size: .7em;
ver tical-align: sub
}

.sw-Art icle_Body-fixed{
ma rgin-top: 90px
}

.sw-Art icle_SnsBox{
width: 100%;
position: fixed;
bo ttom: 0;
left: 0;
bac kground: #fff;
z-index: 99;
overflow: auto
}

.sw-Art icle_Othr eBox{
width: 100%;
position: fixed;
bo ttom: 0;
left: 0;
bac kground: #fff;
z-index: 99;
overflow-y: auto
}

.sw-Art icle_Othr eBo x-i nfo{
bac kground: #ea eaea;
padding: 20px 10px
}

.sw-Art icle_Othr eBo x-i nfo dt{
font-size: 12px;
text-align: center;
color: #999;
padding-bo ttom: 15px;
ma rgin-bo ttom: 20px;
border-bo ttom: so lid 1px #d6d6d6;
font-weight: normal
}

.sw-Art icle_Othr eBo x-i nfo dd{
font-size: 12px;
line-height: 1.5;
color: #999;
ma rgin-bo ttom: 8px;
ma rgin-left: 0
}

.sw-Art icle_Othr eBo x-i nfo dd: last-child{
ma rgin-bo ttom: 0;
white-space: nowrap;
overflow: hi dden;
text-overflow: ell ip sis
}

.sw-Art icle_Othr eBox-navi li{
height: 48px;
line-height: 48px;
text-align: center;
font-size: 14px;
border-bo ttom: 1px #999 so lid
}

.sw-Art icle_Othr eBox-navi li: last-child{
border-bo ttom: none
}

.sw-Art icle_Othr eBox-navi li a{
display: b lock;
color: #222
}

.sw-Art icle_Menu-cancell{
border-top: so lid 4px #999;
height: 48px;
line-height: 48px;
text-align: center;
font-size: 14px;
color: #1e7dc0
}

.sw-Art icle_Sub Contents{
ma rgin-bo ttom: 20px
}

.sw-Art icle_Sub Contents-title{
padding: 8px 10px;
bac kground: #222;
color: #fff;
font-size: 14px;
ma rgin-top: 4px
}

.sw-Art icle_Sub Contents-push word{
padding-left: 30px;
bac kground: #222 url(/img/icon_pus hword-wh .png) no-repeat left center;
bac kground-size: 30px
}

.sw-Art icle_Sub Contents-hometa{
padding-left: 30px;
bac kground: #222 url(/img/icon_hometa-wh .png) no-repeat left center;
bac kground-size: 35px
}

.sw-Art icle_Sub Contents-spnew{
padding-left: 30px;
bac kground: #222 url(/img/icon_edit-pen-wh .png) no-repeat left center;
bac kground-size: 35px
}

.sw-Art icle_Sub Contents-nicoad .sw-Column_Title{
color: #fff;
font-size: 14px;
ma rgin-top: 4px;
padding: 8px 10px;
padding-left: 30px;
bac kground: #222 url(/img/icon_nicoad-wh .png) no-repeat left center;
bac kground-size: 22px;
bac kground-position: left 4px center;
border-bo ttom: none
}

.sw-Art icle_Sub Contents-portal-link{
padding: 8px
}

#sukinamono_lives tr {
padding: 0px 3px
}

.sw-Art icle_Sub Contents-portal-link ul li{
display: inline;
word-wrap: break-word;
font-size: 12px
}

.sw-Art icle_Sub Contents-portal-link ul li: not(: last-child): : after{
padding: 0 3px;
content: "/"
}

.sw-Art icle_Sub Contents .st-box_heading-live { font-size: 100%;
font-weight: bold;
height: auto;
padding-left: 20px;
ma rgin: 30px 0 10px;
border-bo ttom: 1px so lid #8cc700;
bac kground: url(/img/disc_l.gif) no-repeat 0px
}

.sw-Art icle_Sub Contents-sukinamono_lives { padding: 0 10px
}

.a-sukinamono_live-contents { padding: 0px
}

.a-sukinamono_live-contents table { display: flex
}

.a-sukinamono_live-contents tb ody { display: flex;
jus tify-content: center;
width: 100%
}

.a-sukinamono_live-contents tb ody tr { width: 160px;
max-width: 48%;
ma rgin-left: 8px;
display: inline-b lock;
ver tical-align: top
}

.a-sukinamono_live-contents tb ody tr:first-child { mar gin: 0
}

.a-sukinamono_live-contents tb ody tr td { padding: 0;
border-style: none;
display: inline-b lock
}

.a-sukinamono_live-thumb { border-style: none
}

.a-sukinamono_live-thumbInner { width: 100%;
bac kground-color: #000;
display: inline-b lock;
text-align: center
}

.a-sukinamono_live-thumbInner img { width: 130px;
height: 100px;
display: b lock;
ma rgin: 0 auto
}

.a-sukinamono_live-info { width: 160px
}

.a-sukinamono_live-info svg { height: 11px;
width: 11px;
ver tical-align: -1px
}

.a-sukinamono_live-info svg path { fill: #c5 c5 c5;
fill-rule: eve nodd
}

.a-sukinamono_live-title { font-size: 14px;
font-weight: 600;
display: b lock;
line-height: 16px;
ma rgin: 8px 0 2px;
word-break: break-all
}

.a-sukinamono_live-count { position: absolute;
right: 0
}

.a-sukinamono_live-post Time { color: #999;
position: rela tive;
ma rgin-right: 6px;
font-size: 9px
}

.a-sukinamono_live-post Time nobr:first-child { mar gin-right: 1px
}

.a-sukinamono_live-user { mar gin: 5px 0px
}

.a-sukinamono_live-user a { font-weight: bold
}

.a-sukinamono_live-user a img { border-radius: 50%
}

.a-sukinamono_live-user a span { display: inline-bl ock;
ver tical-align: 9px;
color: #999;
font-size: 90%;
ma rgin-left: 2px
}

.sw-Art icle_Recomme dMovie{
padding: 10px;
border-bo ttom: 1px #d6d6d6 so lid
}

.sw-Art icle_Sub Contents-sub title{
font-size: 16px;
color: #222;
font-weight: bold;
ma rgin-bo ttom: 10px
}

.sw-Art icle_Recomme dMovie-lis it>li{
padding: 10px 0;
border-bo ttom: so lid #d6d6d6 1px
}

.sw-Art icle_Recomme dMovie-lis it>li: first-child{
padding-top: 0
}

.sw-Art icle_Recomme dMovie-lis it>li: last-child{
border-bo ttom: none
}

.sw-Art icle_Recomme dMovie-lis it>li: after{
content: " ";
display: b lock;
clear: both
}

.sw-Art icle_Recomme dMovie-thumb{
float: left;
width: 30%;
ma rgin-right: 3%
}

.sw-Art icle_Recomme dMovie-thumb img{
width: 100%
}

.sw-Art icle_Recomme dMovie-textbox{
float: left;
width: 67%
}

.sw-Art icle_Recomme dMovie-date{
font-size: 10px;
color: #999;
ma rgin-bo ttom: 5px
}

.sw-Art icle_Recomme dMovie-label{
font-size: 12px;
display: -webkit-box;
-webkit-box-orient: ver tical;
-webkit-line-clamp: 2;
overflow: hi dden;
ma rgin-bo ttom: 5px
}

.sw-Art icle_Recomme dMovie-label a{
color: #1e7dc0
}

.sw-Art icle_Recomme dMovie-count Set: after{
content: " ";
display: b lock;
clear: both
}

.sw-Art icle_Recomme dMovie-count Set>li{
float: left;
width: auto;
max-width: 31%;
color: #999;
font-size: 10px;
ma rgin-right: 3.5%
}

.sw-Art icle_Recomme dMovie-count Set>li: before{
content: "";
display: inline-b lock;
ver tical-align: middle;
width: 15px;
height: 15px
}

.sw-Art icle_Recomme dMovie-count Set>li: last-child{
ma rgin-right: 0
}

.sw-Art icle_Sub Contents-moreLinks{
text-align: right;
font-size: 10px;
ma rgin-top: 10px
}

.sw-Art icle_Sub Contents-moreLinks a{
color: #1e7dc0
}

.sw-Art icle_Sub Contents-moreLinks a: before{
content: "";
display: inline-b lock;
ver tical-align: middle;
width: 15px;
height: 15px;
bac kground: url(/img/icon_search-blu.png) no-repeat center center;
bac kground-size: 20px
}

.sw-Art icle_RecommedIll ust{
padding: 10px;
border-bo ttom: 1px #d6d6d6 so lid
}

.sw-Art icle_RecommedIll ust-lis it{
max-width: 480px;
ma rgin: 0 auto
}

.sw-Art icle_RecommedIll ust-lis it: after{
content: " ";
display: b lock;
clear: both
}

.sw-Art icle_RecommedIll ust-lis it li{
float: left;
width: 48%;
ma rgin-right: 4%
}

.sw-Art icle_RecommedIll ust-lis it li: last-child{
ma rgin-right: 0
}

.sw-Art icle_RecommedIll ust-thumb{
position: rela tive;
border: so lid 1px #999
}

.sw-Art icle_RecommedIll ust-thumb: before{
content: "";
display: b lock;
padding-top: 100%
}

.sw-Art icle_RecommedIll ust-thumb>img{
position: absolute;
top: 0;
left: 0;
bo ttom: 0;
right: 0;
width: 100%;
height: 100%;
obj ect-fit: con tain
}

.sw-Art icle_RecommedIll ust-label{
overflow: hi dden;
text-overflow: ell ip sis;
white-space: nowrap;
font-size: 12px;
ma rgin: 5px 0
}

.sw-Art icle_RecommedIll ust-label a{
color: #1e7dc0
}

.sw-Art icle_RecommedIll ust-name{
font-size: 10px;
color: #999
}

.sw-Art icle_Recomme dNews{
padding: 10px;
border-bo ttom: 1px #d6d6d6 so lid
}

.sw-Art icle_Recomme dNews-list>li{
padding: 10px 0;
border-bo ttom: so lid #d6d6d6 1px
}

.sw-Art icle_Recomme dNews-list>li: first-child{
padding-top: 0
}

.sw-Art icle_Recomme dNews-list>li: last-child{
border-bo ttom: none
}

.sw-Art icle_Recomme dNews-list>li: after{
content: " ";
display: b lock;
clear: both
}

.sw-Art icle_Recomme dNews-thumb{
float: left;
width: 20%;
ma rgin-right: 3%
}

.sw-Art icle_Recomme dNews-thumb img{
width: 100%
}

.sw-Art icle_Recomme dNews-textbox{
float: left;
width: 77%
}

.sw-Art icle_Recomme dNews-label{
font-size: 12px;
display: -webkit-box;
-webkit-box-orient: ver tical;
-webkit-line-clamp: 2;
overflow: hi dden;
ma rgin-bo ttom: 5px
}

.sw-Art icle_Recomme dNews-label a{
color: #1e7dc0
}

.sw-Art icle_Recomme dNews-count Set: after{
content: " ";
display: b lock;
clear: both
}

.sw-Art icle_Recomme dNews-count Set>li{
float: left;
width: auto;
max-width: 48.25%;
color: #999;
font-size: 10px;
ma rgin-right: 3.5%
}

.sw-Art icle_Recomme dNews-count Set>li: last-child{
ma rgin-right: 0
}

.sw-Art icle_Recomme dNews-date{
font-size: 10px;
color: #999;
ma rgin-bo ttom: 5px
}

.sw-Art icle_Sub Contents-threadtitle{
font-size: 18px;
font-weight: bold;
bac kground: url(/img/icon_res-or.png) no-repeat left center;
bac kground-size: 40px;
ma rgin: 10px;
padding: 10px 10px 10px 40px;
border-bo ttom: 1px so lid #d6d6d6
}

.sw-Art icle_Title-box{
display: -webkit-box;
display: -ms-flexbox;
display: flex
}

.sw-Art icle_Title-content{
flex: 1 1 auto
}

.sw-Art icle_Title-count ers{
flex: 0 0 auto;
padding-left: 16px
}

.sw-Art icle_Title-homeru{
width: 48px;
text-align: center;
font-size: 10px;
color: #999;
ma rgin-bo ttom: 4px
}

.sw-Art icle_Title-homeru: before{
content: "";
display: b lock;
bac kground: url(/img/icon_hometa_ranking.png) no-repeat;
bac kground-size: con tain;
width: 22px;
height: 22px;
ma rgin: 0 auto 2px;
opacity: .5
}

.sw-Art icle_Title-nicoad{
width: 48px;
text-align: center;
font-size: 10px;
color: #999
}

.sw-Art icle_Title-nicoad: before{
content: "";
display: b lock;
bac kground: url(/img/icon_nicoad-gray.png) no-repeat;
bac kground-size: con tain;
width: 22px;
height: 22px;
ma rgin: 0 auto 2px
}

.sw-Art icle_Tags{
bac kground: #f7f7f7;
width: 100%;
overflow: hi dden
}

.sw-Art icle_Tags-inner{
padding: 10px 0;
ma rgin: 0 10px;
overflow-x: auto;
display: flex;
flex-flow: row nowrap;
align-i tems: center;
-webkit-overflow-scrolling: touch
}

.sw-Art icle_Tags-list{
flex: 0 0 auto;
white-space: nowrap
}

.sw-Art icle_Tags-it em{
display: inline-b lock;
ma rgin-right: 16px;
font-size: 12px;
color: #333;
bac kground: url(/img/tag.svg) no-repeat left center;
bac kground-size: 15px 15px
}

.sw-Art icle_Tags-it em>a{
color: #000;
padding-left: 20px
}

.sw-Art icle_Tags-editBtn{
flex: 0 0 70px;
width: 70px;
height: 30px;
line-height: 29px;
text-align: center;
font-size: 12px;
color: #333;
bac kground: #fff;
border-radius: 6px;
border: so lid 1px #c 5c 5c5;
box-sizing: border-box;
outline: none
}

.sw-Art icle_Tag Edit{
position: fixed;
bac kground: #f 3f 3f3;
width: 100%;
height: 100%;
z-index: 999;
bo ttom: 0;
display: none
}

.sw-Art icle_Tag Edit-head{
position: rela tive;
height: 50px;
line-height: 50px;
text-align: center;
font-size: 16px;
color: #1 b1 b1b;
bac kground: #fff;
box-shadow: 0 2px 3px rgba(0,0,0,.1)
}

.sw-Art icle_Tag Edit-headBtn{
position: absolute;
top: 0;
left: 0;
font-size: 0;
height: 50px;
width: 50px;
bac kground: url(/img/c lose.svg) no-repeat center center;
bac kground-size: 16px 16px;
border: none
}

.sw-Art icle_Tag Edit-add{
border-bo ttom: so lid 1px #d6d6d6
}

.sw-Art icle_Tag Edit-addBtn{
width: 100%;
height: 50px;
line-height: 50px;
padding: 0 10px 0 32px;
font-size: 14px;
text-align: left;
bac kground: url(/img/tag_add.svg) no-repeat left 10px center;
bac kground-size: 14px 14px;
border: none
}

.sw-Art icle_Tag Edit-list{
bac kground: #fff
}

.sw-Art icle_Tag Edit-listIt em{
position: rela tive;
padding: 8px 32px 8px 10px;
color: #535353;
border-bo ttom: so lid 1px #d6d6d6
}

.sw-Art icle_Tag Edit-listDel{
position: absolute;
top: 0;
right: 0;
font-size: 0;
height: 32px;
width: 32px;
bac kground: url(/img/tag_delete.svg) no-repeat center center;
bac kground-size: 16px 16px;
border: none;
outline: none
}

.sw-Art icle_TagAdd-head{
position: rela tive;
height: 50px;
line-height: 50px;
text-align: center;
font-size: 16px;
color: #1 b1 b1b;
bac kground: #fff;
box-shadow: 0 2px 3px rgba(0,0,0,.1)
}

.sw-Art icle_TagAdd-headBtn{
position: absolute;
top: 0;
left: 0;
font-size: 0;
height: 50px;
width: 50px;
bac kground: url(/img/icon_arrow-left.png) no-repeat right 10px center;
bac kground-size: 30px auto;
border: none
}

.sw-Art icle_TagAdd-form{
ma rgin: 10px;
bac kground: #fff;
border-radius: 4px;
display: flex
}

.sw-Art icle_TagAdd-input{
width: 100%;
height: 40px;
font-size: 14px;
outline: 0;
padding: 0 0 0 8px
}

.sw-Art icle_TagAdd-btn{
flex: 0 0 60px;
height: 40px;
line-height: 40px;
text-align: center;
color: #14 7cc2;
font-size: 14px;
padding: 0
}

.alg ol ia-auto complete{
flex: 1 1 auto
}

.sw-Art icle_Tag Edit-overlay{
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
bac kground: rgba(0,0,0,.35);
display: flex;
jus tify-content: center;
align-i tems: center
}

.tag-edit-form-error{
bac kground: #fff;
box-shadow: 0 0 2px 2px rgba(0,0,0,.2);
padding: 5px
}

.sw-Art icle_Tag Edit-loading{
position: absolute;
top: 0;
right: 0;
bo ttom: 0;
left: 0;
ma rgin: auto;
width: 10px;
height: 10px;
border-radius: 50%;
box-shadow: 0 -30px 0 0 #bbb,15px -26px 0 0 #aaa,26px -15px 0 0 #999,30px 0 0 0 #888,26px 15px 0 0 #777,15px 26px 0 0 #666,0 30px 0 0 #555,-15px 26px 0 0 #444,-26px 15px 0 0 #333,-30px 0 0 0 #222,-26px -15px 0 0 #111,-15px -26px 0 0 #000;
animation: tag-edit-form-loading 1s infinite steps(12, start)
}

@key frames tag-edit-form-loading{
0%{
transform: rotate(0deg)
}

100%{
transform: rotate(360deg)
}

}

.sw-Art icle_Btn-edit{
width: 100%;
text-align: center;
ma rgin-top: 20px
}

.sw-Art icle_Btn-edit a{
display: b lock;
width: 100%;
height: 50px;
border: so lid 1px #535353;
text-align: center;
color: #000;
padding: 16px 10px;
box-sizing: border-box
}

.sw-Art icle_Btn-edit a span{
bac kground: url(/img/icon_edit-pen.png) no-repeat left center;
bac kground-size: 18px auto;
padding-left: 20px
}

.sw-Arrow_Top{
position: fixed;
bo ttom: 55px;
right: 5px;
width: 44px;
height: 44px;
box-sizing: border-box;
text-align: center;
line-height: 64px;
font-size: 10px;
color: #747474;
box-shadow: 1px 1px 4px rgba(0,0,0,.3);
bac kground: #fff url(/img/icon_arrow-top.png) no-repeat center top;
bac kground-size: 36px auto;
z-index: 10
}

.sw-Arrow_Top.is-fin{
bac kground-color: tran spa rent;
box-shadow: none
}

.sw-Arrow_Top a{
display: b lock;
color: #747474;
height: 44px
}

.sw-Link_Prev{
border-top: 1px so lid #999;
border-bo ttom: 1px so lid #999;
text-align: center;
ma rgin: 20px 0 70px 0;
bac kground: url(/img/icon_arrow-left.png) no-repeat left 10px center;
bac kground-size: 30px auto
}

.sw-Link_Prev>a{
display: b lock;
font-size: 14px;
color: #222;
padding: 15px 0;
position: rela tive
}

.sw-Link_Next{
border-top: 1px so lid #999;
border-bo ttom: 1px so lid #999;
text-align: center;
ma rgin: 20px 0;
bac kground: url(/img/icon_arrow-right.png) no-repeat right 10px center;
bac kground-size: 30px auto
}

.sw-Link_Next>a{
display: b lock;
font-size: 14px;
color: #222;
padding: 15px 0;
position: rela tive
}

.sw-Column{
position: rela tive;
padding: 15px 0
}

.sw-Column_Bot tom{
ma rgin: -44px auto 40px
}

.sw-Column_Title{
padding: 10px;
ma rgin-bo ttom: 10px;
border-bo ttom: so lid 4px #ffaf19;
font-size: 20px;
color: #222
}

.sw-Column_List{
padding: 0 10px
}

.sw-Column_List>li{
padding: 12px 0;
border-bo ttom: so lid 1px #d6d6d6
}

.sw-Column_List>li: last-child{
border-bo ttom: none
}

.sw-Column_List-rank{
counter-reset: rank-label
}

.sw-Column_List-rank>li{
position: rela tive;
counter-incre ment: rank-label 1;
padding-left: 30px
}

.sw-Column_List-rank>li: before{
content: counter(rank-label);
position: absolute;
top: 10px;
left: 0;
display: b lock;
width: 22px;
height: 22px;
line-height: 22px;
text-align: center;
font-size: 12px;
color: #fff;
bac kground: #d6d6d6
}

.sw-Column_List-rank>li: nth-of-type(1): before{
bac kground: #f58200
}

.sw-Column_List-rank>li: nth-of-type(2): before{
bac kground: #ffaf19
}

.sw-Column_List-rank>li: nth-of-type(3): before{
bac kground: #f fcb2c
}

.sw-Column_Label{
display: table-cell;
width: 100%;
color: #1e7dc0;
font-size: 14px
}

.sw-Column_Label>a{
display: b lock;
color: #1e7dc0
}

.sw-Colum_List-indic ator{
display: table-cell;
ver tical-align: top;
font-size: 0
}

.sw-Colum_List-indic ator>ul{
width: 55px;
text-align: right;
font-size: 0;
line-height: 1
}

.sw-Colum_List-hometa{
color: #999;
font-size: 10px;
box-sizing: border-box
}

.sw-Colum_List-hometa: before{
content: "";
display: inline-b lock;
width: 20px;
height: 14px;
ver tical-align: middle;
bac kground: url(/img/icon_hometa-gray.png) no-repeat center center;
bac kground-size: 24px auto
}

.sw-Colum_List-com ent{
color: #999;
font-size: 10px;
box-sizing: border-box
}

.sw-Colum_List-com ent: before{
content: "";
display: inline-b lock;
width: 20px;
height: 14px;
ver tical-align: middle;
bac kground: url(/img/icon_comment-gray.png) no-repeat center center;
bac kground-size: 24px auto
}

.sw-Colum_List-category{
display: inline-b lock;
white-space: nowrap
}

.sw-Column_Nothing{
ma rgin: 20px 10px;
padding-bo ttom: 120px;
bac kground: url(/img/img_none-ar ticle.png) no-repeat center bo ttom;
bac kground-size: 90px auto
}

.sw-Column_Nothing-text{
font-size: 14px;
color: #222;
ma rgin-bo ttom: 20px
}

.sw-Column_Nothing-hint{
font-size: 12px;
color: #747474
}

.sw-Colum_More{
padding: 0 10px;
ma rgin: 10px 0;
box-sizing: border-box
}

.sw-Colum_Mo re: after{
content: "";
display: b lock;
clear: both
}

.sw-Colum_More-date{
float: left;
font-size: 10px;
color: #999
}

.sw-Colum_More-link{
float: right;
font-size: 12px
}

.sw-Colum_More-link a{
color: #1e7dc0
}

.sw-Colum_More-list{
text-align: center
}

.sw-Colum_More-lis tt ext{
color: #1e7dc0;
font-size: 12px
}

.sw-Colum_More-lis tmark{
color: #1e7dc0;
display: b lock;
width: 1em;
word-break: break-word;
line-height: .4;
ma rgin: 0 auto
}

.sw-Column_Art icle-summary{
display: -webkit-box;
-webkit-box-orient: ver tical;
-webkit-line-clamp: 3;
overflow: hi dden;
word-break: break-all;
ma rgin-top: 6px;
font-size: 11px;
line-height: 16px;
color: #999
}

.sw-Column_Update{
ma rgin-top: 8px
}

.sw-Column_Update-date{
font-size: 10px;
color: #999
}

.sw-Column_Update-comment{
font-size: 12px;
color: #222;
white-space: nowrap;
overflow: hi dden;
text-overflow: ell ip sis
}

.sw-Colum_Resb oa rd{
ma rgin-top: 8px
}

.sw-Colum_Resb oa rd-comment{
font-size: 12px;
color: #222;
display: -webkit-box;
-webkit-box-orient: ver tical;
-webkit-line-clamp: 2;
overflow: hi dden;
padding-left: 10px;
border-left: so lid 6px #d6d6d6;
box-sizing: border-box
}

.sw-Pa ging{
padding: 10px 15px;
bac kground: #ea eaea;
box-sizing: border-box;
ma rgin: 20px 0
}

.sw-Pa ging: last-of-type{
ma rgin: 20px 0
}

.sw-Pa ging: after{
content: "";
display: b lock;
clear: both
}

.sw-Pa ging_Num{
font-size: 12px;
height: 20px;
line-height: 20px;
color: #222;
text-align: center
}

.sw-Pa ging_Prev{
float: left;
width: 80px;
font-size: 0;
color: #999
}

.sw-Pa ging_Prev-firstbtn{
display: inline-b lock;
font-size: 12px;
letter-sp acing: -0.4em;
width: 40px;
height: 20px;
line-height: 20px;
text-align: center;
border-right: so lid 1px #c fc fcf;
box-sizing: border-box
}

.sw-Pa ging_Prev-firstbtn a{
display: b lock;
color: #222;
font-weight: bold
}

.sw-Pa ging_Prev-prevbtn{
display: inline-b lock;
font-size: 12px;
width: 40px;
height: 20px;
line-height: 20px;
text-align: center;
border-right: so lid 1px #c fc fcf;
box-sizing: border-box
}

.sw-Pa ging_Prev-prevbtn a{
display: b lock;
color: #222;
font-weight: bold
}

.sw-Pa ging_Next{
float: right;
width: 80px;
font-size: 0;
color: #999
}

.sw-Pa ging_Next-nextbtn{
display: inline-b lock;
font-size: 12px;
width: 40px;
height: 20px;
line-height: 20px;
text-align: center;
border-left: so lid 1px #c fc fcf;
box-sizing: border-box
}

.sw-Pa ging_Next-nextbtn a{
display: b lock;
color: #222;
font-weight: bold
}

.sw-Pa ging_Next-lastbtn{
display: inline-b lock;
font-size: 12px;
letter-sp acing: -0.4em;
width: 40px;
height: 20px;
line-height: 20px;
text-align: center;
border-left: so lid 1px #c fc fcf;
box-sizing: border-box
}

.sw-Pa ging_Next-lastbtn a{
display: b lock;
color: #222;
font-weight: bold
}

.sw-TabMenu{
width: 100%;
padding-bo ttom: 5px;
ma rgin-bo ttom: 10px;
border-bo ttom: so lid 4px #ffaf19
}

.sw-TabMenu: after{
content: "";
display: b lock;
clear: both
}

.sw-TabMenu>li{
float: left;
bac kground: #ea eaea;
border: so lid 1px #d6d6d6;
border-bo ttom: so lid 1px #999;
border-top-left-radius: 8px;
border-top-right-radius: 8px;
text-align: center;
font-size: 14px;
height: 44px;
line-height: 44px;
box-sizing: border-box;
display: b lock;
color: #999
}

.sw-TabMenu>li.active{
bac kground: #fff;
border: so lid 1px #999;
border-bo ttom: so lid 1px #fff;
color: #222
}

.sw-TabMenu>li>a{
float: left;
bac kground: #ea eaea;
border-top-left-radius: 8px;
border-top-right-radius: 8px;
text-align: center;
font-size: 14px;
height: 44px;
line-height: 44px;
box-sizing: border-box;
display: b lock;
color: #999
}

.sw-TabMenu>li.active>a{
bac kground: #fff;
border: so lid 1px #999;
border-bo ttom: so lid 1px #fff;
color: #222
}

.sw-TabMenu_Three li{
width: 33.3%
}

.sw-TabMenu_Two li{
width: 50%
}

.sw-TabBoxes_It em{
display: none
}

.sw-TabBoxes_It em: first-of-type{
display: b lock
}

.sw-Ill ust_List{
padding: 0 20px
}

.sw-Ill ust_List: after{
content: " ";
display: b lock;
clear: both
}

.sw-Ill ust_List>li{
float: left;
width: 28%;
ma rgin: 0 8% 30px 0
}

.sw-Ill ust_List>li: nth-child(3n){
ma rgin-right: 0
}

.sw-Ill ust_List-title{
font-size: 12px;
color: #1e7dc0;
display: -webkit-box;
-webkit-box-orient: ver tical;
-webkit-line-clamp: 2;
overflow: hi dden;
ma rgin-bo ttom: 4px
}

.sw-Ill ust_List-date{
font-size: 10px;
color: #999;
ma rgin: 4px 0
}

.sw-Ill ust_List-img{
position: rela tive;
border: so lid 1px #999
}

.sw-Ill ust_List-img: before{
content: "";
display: b lock;
padding-top: 100%
}

.sw-Ill ust_List-img>img{
position: absolute;
top: 0;
left: 0;
bo ttom: 0;
right: 0;
width: 100%;
height: 100%;
obj ect-fit: con tain
}

.sw-Ill ust_List-hometa{
position: absolute;
top: 0;
right: 0;
padding: 4px 4px 4px 20px;
border-bo ttom-left-radius: 6px;
color: #fff;
font-size: 10px;
box-sizing: border-box;
bac kground: rgba(0,0,0,.35) url(/img/icon_hometa-wh .png) no-repeat left 2px center;
bac kground-size: 24px auto
}

.sw-Ill ust_List-label{
font-size: 10px;
color: #747474;
ma rgin: 5px 0
}

.sw-Ill ust_Btn-homeru{
width: 80px;
height: 30px;
line-height: 28px;
font-size: 12px;
text-align: center;
box-sizing: border-box;
bac kground: url(/img/icon_hometa.png) no-repeat left 6px center;
bac kground-size: 28px auto;
border: so lid 1px #999;
border-radius: 6px
}

.sw-Ill ust_Btn-homeru a{
display: b lock;
color: #222;
padding-left: 20px;
border-style: none;
outline: none
}

@media screen and (max-width: 420px){
.sw-Il lust_List>li{
float: left;
width: 47%;
ma rgin: 0 6% 30px 0
}

.sw-Ill ust_List>li: nth-child(3n){
ma rgin-right: 6%
}

.sw-Ill ust_List>li: nth-child(2n){
ma rgin-right: 0
}

}

.sw-Piko_List{
padding: 0 20px
}

.sw-Piko_List: after{
content: " ";
display: b lock;
clear: both
}

.sw-Piko_List>li{
float: left;
width: 28%;
ma rgin: 0 8% 30px 0
}

.sw-Piko_List>li: nth-child(3n){
ma rgin-right: 0
}

.sw-Piko_List-date{
font-size: 10px;
color: #999;
ma rgin: 4px 0
}

.sw-Piko_List-box{
position: rela tive;
border: so lid 1px #999;
padding: 12px 0px 12px 12px;
ma rgin-bo ttom: 5px
}

.sw-Piko_List-box: before{
content: "";
display: b lock
}

.sw-Piko_List-title{
font-size: 12px;
color: #1e7dc0;
display: -webkit-box;
-webkit-box-orient: ver tical;
-webkit-line-clamp: 2;
overflow: hi dden;
ma rgin-bo ttom: 4px
}

.sw-Piko_List-hometa{
position: absolute;
top: 0;
right: 0;
padding: 4px 4px 4px 20px;
border-bo ttom-left-radius: 6px;
color: #fff;
font-size: 10px;
box-sizing: border-box;
bac kground: rgba(0,0,0,.35) url(/img/icon_hometa-wh .png) no-repeat left 2px center;
bac kground-size: 24px auto
}

.sw-Piko_Btn-homeru{
width: 80px;
height: 30px;
line-height: 28px;
font-size: 12px;
text-align: center;
box-sizing: border-box;
bac kground: url(/img/icon_hometa.png) no-repeat left 6px center;
bac kground-size: 28px auto;
border: so lid 1px #999;
border-radius: 6px
}

.sw-Piko_Btn-homeru a{
display: b lock;
color: #222;
padding-left: 20px;
border-style: none;
outline: none
}

@media screen and (max-width: 420px){
.sw-Piko_List>li{
float: left;
width: 47%;
ma rgin: 0 6% 30px 0
}

.sw-Piko_List>li: nth-child(3n){
ma rgin-right: 6%
}

.sw-Piko_List>li: nth-child(2n){
ma rgin-right: 0
}

}

ol{
padding-left: 32px;
list-style: decimal out side;
line-height: 1.8
}

.dot{
image-rendering: pixelated;
image-rendering: -webkit-crisp-edges;
image-rendering: -moz-crisp-edges;
-ms-interpo lation-mode: nea rest-neighbor
}

.nico video{
height: 176px;
width: 312px
}

.tweetb lock{
border-color: #1b95e0 !imp ort ant;
bac kground-position: 5px;
bac kground-size: 20px;
bac kground-image: url(/img/twitter_logo.png) !imp ort ant;
ma rgin-left: 0px !imp ort ant;
border-radius: 5px;
max-width: 468px;
word-wrap: break-word !imp ort ant
}

.nico videoplayer{
border-color: #000 !imp ort ant;
bac kground-position: 5px;
bac kground-size: 20px;
bac kground-image: url(/img/icon_niconico_pc.png) !imp ort ant;
ma rgin-left: 0px !imp ort ant;
border-radius: 5px;
max-width: 468px;
word-wrap: break-word !imp ort ant
}

.tp-Nicoad_It em{
border-bo ttom: so lid 2px #eee;
padding: 8px 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex
}

.tp-Nicoad_Title{
flex: 1 1 auto;
overflow: hi dden;
padding-left: 28px;
bac kground: url(/img/icon_nicoad-silver.png) no-repeat;
bac kground-size: 24px 24px;
bac kground-position: left top -2px
}

.gold-sp .tp-Nicoad_Title{
bac kground: url(/img/icon_nicoad-gold.png) no-repeat;
bac kground-size: 24px 24px
}

.silver-sp .tp-Nicoad_Title{
bac kground: url(/img/icon_nicoad-silver.png) no-repeat;
bac kground-size: 24px 24px
}

.tp-Nicoad_Title-link{
display: b lock;
font-size: 14px
}

.tp-Nicoad_Title-supporter{
font-size: 10px;
color: #999;
ma rgin-top: 2px
}

.tp-Nicoad_Point{
flex: 0 0 auto;
width: 65px;
font-size: 10px;
height: 20px;
line-height: 20px;
border-radius: 20px;
bac kground: #ccd7d9;
text-align: center;
color: #5f6467;
ma rgin-left: 16px
}

.gold-sp .tp-Nicoad_Point{
color: #987600;
bac kground: #f6d538
}

.silver-sp .tp-Nicoad_Point{
color: #5f6467;
bac kground: #ccd7d9
}

.gold-sp .tp-Nicoad_Point a{
display: b lock;
color: #987600
}

.silver-sp .tp-Nicoad_Point a{
display: b lock;
color: #5f6467
}

.indexSp-Nicoad-Art icle-it em: : before{
display: inline-b lock;
content: "";
bac kground: url(/img/icon_nicoad-silver.png);
bac kground-size: con tain;
width: 24px;
height: 24px;
ver tical-align: middle
}

.indexSp-Nicoad-Art icle-counter{
font-size: 11px;
height: 20px;
line-height: 20px;
border-radius: 20px;
bac kground: #ccd7d9;
text-align: center;
color: #5f6467
}

.indexSp-Nicoad-Art icle-offer{
font-size: 8px;
color: #b 5b 5b5
}

.tp-TrendWord .sw-Column_Title{
padding-left: 35px;
bac kground: url(/img/icon_res.png) no-repeat left center;
bac kground-size: 40px auto
}

.tp-TrendWord_Icon{
width: 18px;
height: 18px;
ma rgin-left: 1px;
display: inline-b lock;
overflow: hi dden;
text-indent: 100%;
white-space: nowrap;
ver tical-align: sub
}

.tp-TrendWord_Icon.is-Hyakumaru{
bac kground: url(/img/hyaku-mark-40-40px.png);
bac kground-position: bo ttom -1px left -1px
}

.tp-TrendWord_Icon.is-Hyakumaru: hover{
bac kground-position: top -1px left -1px
}

.tp-TrendWord_Icon.is-Hatena{
bac kground: url(/img/hyaku-mark-40-40px.png);
bac kground-position: top -1px right -1px
}

.tp-TrendWord_Icon.is-Hatena: hover{
bac kground-position: bo ttom -1px right -1px
}

.tp-TrendWord_Text{
ma rgin: 16px 0 8px;
padding: 0 10px;
font-size: 13px
}

#Com mon Header{
position: rela tive;
width: 100%;
min-height: 44px;
z-index: 100000;
ma rgin: 0;
padding: 0;
bac kground-color: #25 2525
}

.art icle_img,.lazy-contents{
max-width: 100%
}

h2, h3, h4, h5{
bac kground-repeat: no-repeath2 h3 h4 h5
}

.sw-Art icle_Sub Contents-buzz word 100_banner img{
padding: 15px 0px;
width: 100%
}

css/nicopedia_style_sp.css コミュ

おすすめトレンド

ニコニ広告で宣伝された記事