@charset "utf-8";

/* リセット設定 */
@import "reset.css";
/* サイト全体で共通の基本設定 */
@import "default.css";
/* ポップアップ画面の設定 */
@import "pop.css?20160414";
/* ヘッダーの設定 */
@import "header.css";
/* フッターの設定 */
@import "footer.css";

/* ===========================================
広告
============================================ */
.dag_smp_rectangle1{text-align:center;}
.dag_smp_rectangle1 iframe{margin-bottom:15px;}

.ad-rectangle {
    padding: 37px 0;
    text-align: center;
}
.ad-rectangle img {
    width: 300px;
}
.ad-rectangle.top {
    border-bottom: solid 1px #e8e8e8;
	padding:0;
}
.ad-rectangle.top div iframe {
	margin:37px 0;
}
.ad-banner {
    margin-bottom: 36px;
    text-align: center;
}
.ad-banner img {
    width: 320px;
}
@media screen and (max-width: 320px) {
    .ad-rectangle img {
        width: 256px;
    }
    .ad-banner img {
        width: 270px;
    }
}

#dag_welcomebg {
	background-image:none;
	background-color:White;
}

#dag_welcomebg .header {
	border-bottom:1px solid #e8e8e8;
	background-color:White;
}

#dag_welcomebg .header:after {
	content:"";clear:both;display: block;
}

#dag_welcomebg .header .logo  {
	margin:6px 0 0 6px;
	float:left;
}

#dag_welcomebg .header .logo img {
	height: 30px;
}

#dag_welcomebg .header .skip {
	margin:12px 6px 5px 0;
	border:1px solid DarkGray;
	float:right;
	text-decoration:none;
}

#dag_welcomebg .header .skip div{
	padding: 4px 1.5em;
	background:DarkGray;
	font-family: Verdana, Roboto, 'Droid Sans', sans-serif;
	font-size:12px;
	color:WhiteSmoke;
}

#div-gpt-ad-smp_infeed_02{
    display:block;
}
/* ===========================================
メニューバー
============================================ */
nav#menubar {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background: #fff;
    border-top: solid 1px #e8e8e8;
    z-index: 200;
}
nav#menubar ul {
    display: table;
    width: 100%;
}
nav#menubar ul li {
    display: inline-block;
    width: 25%;
    line-height: 50px;
}
nav#menubar ul li span {
    display: block;
    text-indent: 100%;
    overflow: hidden;
    white-space: nowrap;
}
nav#menubar ul li.top span {
    background: url(/images/n/nbo/2016/sp/common/menubar_top.png) no-repeat 50% 50%;
    background-size: 21px 35px;
}
nav#menubar ul li.ranking span {
    background: url(/images/n/nbo/2016/sp/common/menubar_ranking.png) no-repeat 50% 50%;
    background-size: 49px 35px;
}
nav#menubar ul li.save span {
    background: url(/images/n/nbo/2016/sp/common/menubar_save.png) no-repeat 50% 50%;
    background-size: 50px 35px;
}
nav#menubar ul li.save span.current {
    background: #333 url(/images/n/nbo/2016/sp/common/menubar_save_current.png) no-repeat 50% 50%;
    background-size: 50px 35px;
}
nav#menubar ul li.register span {
    background: url(/images/n/nbo/2016/sp/common/menubar_register.png) no-repeat 50% 50%;
    background-size: 60px 35px;
}
/* app用 */
nav#menubar ul.appMenu li {
    width: 33%;
}
/* ===========================================
PR枠
============================================ */
.prBox {
    margin: 10px 16px 16px;
    padding: 14px 7px;
    background: #f7f7f7;
    color: #777;
    font-size: 1.4rem;
}
.prBox dl dt {
    float: left;
}
.prBox dl dd {
    padding-left: 40px;
}
.prBox dl dd a {
    color: #777;
}
.prBoxOuter {
    margin: 36px 0;
}

.top .prBoxOuter {
    margin: 0 0 36px 0;
}
/* ===========================================
タイトル
============================================ */
h1 {
    padding: 28px 0 19px;
    background: url(/images/n/nbo/2016/sp/common/bg_line_h1.png) no-repeat left bottom;
    font-size: 1.5rem;
}
h2 {
    padding: 16px 0;
    background: url(/images/n/nbo/2016/sp/common/bg_line_h2.png) no-repeat left bottom;
    font-size: 1.4rem;
}
/* ===========================================
テキスト
============================================ */
.txtRight {
    text-align: right;
}
.txtCenter {
    text-align: center;
}
/* 一覧へのリンク 枠付き */
.listLink {
    margin: 4px 0 36px;
    font-size: 1.2rem;
    line-height: 1;
}
.listLink a {
    display: inline-block;
    padding: 12px 20px;
    border: solid 1px #9f9f9f;
    border-radius: 3px;
    color: #777;
}
.listLink a span {
    padding-left: 10px;
    background: url(/images/n/nbo/2016/sp/common/bg_arrow_gr.png) no-repeat left center;
    background-size: 4px 8px;
}
.listLink a.prev span {
    padding-left: 10px;
    background: url(/images/n/nbo/2016/sp/common/bg_arrow_gr2.png) no-repeat left center;
    background-size: 4px 8px;
}
.listLink a.next span {
    padding-right: 10px;
    background: url(/images/n/nbo/2016/sp/common/bg_arrow_gr.png) no-repeat right center;
    background-size: 4px 8px;
}
.listLink.txtCenter a {
    padding: 12px 70px;
}
/* 一覧へのリンク テキストのみ */
.txtList {
    margin-bottom: 16px;
    border-top: none !important;
    min-height: 0 !important;
}
.txtList a {
    display: inline-block;
    padding: 0 !important;
    color: #777;
}
.txtList a span {
    padding-left: 10px;
    background: url(/images/n/nbo/2016/sp/common/bg_arrow_gr.png) no-repeat left center;
    background-size: 4px 8px;
    font-size: 1.2rem;
    text-decoration: underline;
}
@media only screen and (orientation:landscape) {
    .txtList a {
        min-height: 0 !important;
    }
}
/* アイコン */
span.icon {
    display: inline-block;
    margin-top: 3px;
    padding: 4px 10px 3px;
    border-radius: 2px;
    color: #fff;
    font-size: 1.1rem;
    font-weight: normal;
    line-height: 1;
}
span.Category {
    background: #e50020;
}
span.PR  {
    background: #aaa;
}
/* リスト */
ul.circle {
    margin: 0 15px;
}
ul.circle li {
    margin-bottom: 2em;
    padding-left: 18px;
    background: url(/images/n/nbo/2016/sp/common/bg_circle.png) no-repeat left 7px;
    background-size: 5px 5px;
    font-size: 1.5rem;
}
/* ===========================================
記事一覧
============================================ */
ul.list {
}
ul.list li {
    border-top: solid 1px #e8e8e8;
    min-height: 95px;
}
ul.list li:first-child {
    border-top: none;
}
ul.list li a {
    padding: 16px 0;
}
ul.list li h3 {
    margin-bottom: 0;
    font-size: 1.5rem;
}
ul.list li h4 {
    margin-bottom: 0;
    color: #777;
    font-size: 1.2rem;
    font-weight: normal;
}
ul.list li p {
    color: #777;
    font-size: 1.2rem;
    line-height: 1.6;
}
ul.list.nothumb li {
    min-height: 0;
}
@media only screen and (orientation:landscape) {
    ul.list li a {
        min-height: 93px;
    }
    ul.list.nothumb li a {
        min-height: 0;
    }
    ul.list li .prBox a {
        min-height: 0 !important;
    }
}
/* ===========================================
記事一覧内にPR枠
============================================ */
ul.list li.pr {
    padding: 8px 0 16px;
}
ul.list li.pr a {
    padding: 0;
}
ul.list li.pr {
    min-height: 0;
}
ul.list li.pr .prBox {
    margin: 8px 0 0 0;
}
/* ===========================================
サムネイル左寄せ
============================================ */
.column01 {
    padding: 0 16px;
    border-top: solid 1px #e8e8e8;
}
.column01 ul li p {
    padding-left: 128px;
}
.column01 ul li h3 {
    padding-left: 128px;
}
.column01 ul li .thumb {
    float: left;
    margin-right: 16px;
    padding-left: 0;
}
.column01 ul li .thumb img {
    width: 112px;
    height: 63px;
}
/* ===========================================
サムネイル右寄せ
============================================ */
.column02 {
    padding: 0 16px;
    border-top: solid 1px #e8e8e8;
}
.column02 ul li p {
    padding-right: 128px;
}
.column02 ul li h3 {
    padding-right: 128px;
}
.column02 ul li .thumb {
    float: right;
    margin: 0 0 0 16px;
    padding-right: 0;
}
.column02 ul li .thumb img {
    width: 112px;
    height: 63px;
}
/* ===========================================
アクセスランキング
============================================ */
.accessranking {
    padding: 0 16px;
    border-top: solid 1px #e8e8e8;
}
.accessranking ul {
    display: table;
    width: 100%;
}
.accessranking ul li {
    min-height: 0;
}
.accessranking ul li b {
    display: table-cell;
    width: 1%;
    padding: 12px;
    background: #000;
    color: #fff;
    font-size: 1.5rem;
    font-weight: normal;
    text-align: center;
    vertical-align: middle;
}
.accessranking ul li div {
    display: table-cell;
    padding-left: 15px;
}
.accessranking ul li div h3 {
    padding-right: 62px;
}
.accessranking ul li div .thumb {
    float: right;
    margin-left: 20px;
}
.accessranking ul li div .thumb img {
    width: 62px;
    height: 35px;
}
.accessranking ul li:nth-child(n + 6) b {
    background: #f3f3f3;
    color: #777;
}
@media only screen and (orientation:landscape) {
    .accessranking ul li a {
        min-height: 0;
    }
}
/* ===========================================
今日の執筆陣
============================================ */
.author {
    padding: 0 16px 36px;
}
.author ul {
    display: table;
    margin: 16px auto 0;
    margin-left: -3%;
}
.author ul li {
    display: inline-block;
    width: 22%;
    margin-bottom: 16px;
    text-align: center;
    margin-left: 3%;
    vertical-align: top;
}
.author ul li img {
    width: 98%;
    height: 98%;
}
.author ul li span {
    display: block;
    margin-top: 4px;
    font-size: 1.2rem;
}
@media only screen and (orientation:landscape) {
    .author ul {
        margin: 16px auto 0;
    }
    .author ul li {
        width: 25%;
        margin-left: 0;
    }
.author ul li img {
        width: 76px;
        height: 76px;
    }
}
/* ===========================================
検索枠
============================================ */
.search {
    border-top: solid 1px #e8e8e8;
}
.search h2 {
    margin: 0 16px;
}
.searchBox {
    padding: 16px;
}
.searchBox form {
    position: relative;
}
.searchBox input {
    margin:0;
    padding:0;
    background: none;
    font-size: 1.5rem;
    -webkit-appearance: none;
}
.searchBox .field {
    width: 99%;
    height: 36px;
    background: #fff;
    border: 1px solid #c0c0c0;
    border-right: none;
    border-radius: 3px 0 0 3px;
    color: #aaa;
    text-indent: 15px;
}
.searchBox .btn {
    position: absolute;
    top: 0;
    right: 0;
    width: 36px;
    height: 36px;
    background: #000 url(/images/n/nbo/2016/sp/common/btn_search.png) no-repeat;
    background-size: 36px 36px;
    border: none;
    border-radius: 0 3px 3px 0;
    text-indent: 100%;
    overflow: hidden;
    white-space: nowrap;
    -webkit-appearance: none;
}

#waiting_d{position:fixed; top:0; left:0; width:100%; height:100%; z-index:100; background:white url(/images/n/nbo/2016/common/loadingL.gif) no-repeat center center; display:block}
/* ===========================================
キーワード
============================================ */
.keyword {
    padding: 16px;
    background: #f3f3f3;
}
.keyword .inner {
    padding: 18px 16px 16px;
    background: #fff;
    border-radius: 4px;
}
.keyword .inner p {
    font-size: 1.2rem;
    color: #000;
    font-weight: bold;
    text-align: center;
}
.keyword .inner ul {
    display: table;
    margin-left: -16px;
    text-align: left;
}
.keyword .inner ul li {
    display: inline-block;
    margin: 16px 0 0 16px;
    font-size: 1.4rem;
    background: #f3f3f3;
    border-radius: 4px;
    color: #000;
}
.keyword .inner ul li a {
    padding: 5px 11px;
    color: #444;
}
/* ===========================================
ソーシャルボタン
============================================ */
#socialbtn {
    margin: 0 auto 34px;
    width: 280px;
}
#socialbtn p {
    margin-bottom: 16px;
}
#socialbtn ul {
    display: table;
    margin: 0 auto;
}
#socialbtn ul li {
    display: inline-block;
    margin-left: 15px;
}
#socialbtn ul li:first-child {
    margin-left: 0;
}
#socialbtn ul li span {
    display: block;
    width: 30px;
    height: 30px;
    text-indent: 100%;
    overflow: hidden;
    white-space: nowrap;
}
#socialbtn ul li.mail span {
    background: url(/images/n/nbo/2016/sp/leaf/icon_mail.png) no-repeat;
    background-size: 30px 30px;
}
#socialbtn ul li.fb span {
    background: url(/images/n/nbo/2016/sp/leaf/icon_fb.png) no-repeat;
    background-size: 30px 30px;
}
#socialbtn ul li.tw span {
    background: url(/images/n/nbo/2016/sp/leaf/icon_tw.png) no-repeat;
    background-size: 30px 30px;
}
#socialbtn ul li.line span {
    background: url(/images/n/nbo/2016/sp/leaf/icon_line.png) no-repeat;
    background-size: 30px 30px;
}
#socialbtn ul li.evernote span {
    background: url(/images/n/nbo/2016/sp/leaf/icon_evernote.png) no-repeat;
    background-size: 30px 30px;
}
#socialbtn ul li.etc span {
    width: 55px;
    background: url(/images/n/nbo/2016/sp/leaf/icon_etc.png) no-repeat;
    background-size: 55px 30px;
}
/* ===========================================
レビュー
============================================ */
#review {
    margin-top: 36px;
    padding: 0 16px;
    border-top: solid 1px #e8e8e8;
}
#review h2 + h3 {
    margin: 16px 0 0 0;
}
#review h3 {
    margin: 24px 0 0 0;
    padding: 9px 15px;
    background: #f5f5f5;
    border-radius: 2px;
    color: #444;
    font-size: 1.2rem;
    font-weight: bold;
}
#review h3 span {
    float: right;
    font-size: 1.2rem;
    font-weight: normal;
}
#review h3 span a {
    padding-left: 10px;
    background: url(/images/n/nbo/2016/sp/common/bg_arrow_gr.png) no-repeat left center;
    background-size: 4px 8px;
    color: #777;
    text-decoration: underline;
}
#review h4 {
    margin: 0 15px 25px;
    padding-top: 25px;
    border-top: solid 1px #e8e8e8;
    color: #444;
    font-size: 1.2rem;
}
#review h2 + h3 + h4 {
    border-top: none;
}
#review ul {
    margin: 0 15px 25px;
}
#review ul li {
    margin-top: 24px;
}
#review ul li:first-child {
    margin-top: 0;
}
#review .submitbtn {
    margin-top: 24px;
}
#review .submitbtn a {
    display: block;
    width: 55%;
    margin: 0 auto;
    padding: 12px;
    border: solid 1px #9f9f9f;
    border-radius: 3px;
    color: #777;
    font-size: 1.2rem;
    line-height: 1;
    text-align: center;
}
#review .submitbtn span {
    display: block;
    width: 55%;
    margin: 0 auto;
    padding: 12px;
    border: solid 1px #9f9f9f;
    border-radius: 3px;
    color: #777;
    font-size: 1.2rem;
    line-height: 1;
    text-align: center;
	opacity:0.5;
}
#review #bpcms_feedback_message_area{
    margin: 0 auto;
    padding: 12px;
    color: #e50020;
    font-size: 1.2rem;
    line-height: 1;
    text-align: center;
}
/* ===========================================
フォーム
============================================ */
input[type=radio] {
    display: none;
    margin: 0;
}
input[type=radio] + label {
    display: inline-block;
    position: relative;
    padding-left: 35px;
    color: #444;
    cursor: pointer;
    font-size: 1.2rem;
}
input[type=radio] + label::before,
input[type=radio]:checked + label::after {
    display: block;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 20px;
    height: 20px;
}
input[type=radio] + label::before {
    background: url(/images/n/nbo/2016/sp/leaf/radiobtn_off.png) no-repeat left center;
    background-size: 20px 20px;
}
input[type=radio]:checked + label::after {
    background: url(/images/n/nbo/2016/sp/leaf/radiobtn_on.png) no-repeat left center;
    background-size: 20px 20px;
}
.checkarea {
    position: relative;
    margin: 10px 0 10px !important;
}
.checkarea input {
    position: absolute;
    top: 0;
    opacity: 0;
    width: 20px;
    height: 20px;
}
.checkarea input[type="checkbox"] + label {
    display: block;
    background: url(/images/n/nbo/2016/sp/leaf/checkbtn_off.png) no-repeat left center;
    background-size: 20px 20px;
    padding: 5px 0 5px 32px;
}
.checkarea input[type="checkbox"]:checked + label {
    background: url(/images/n/nbo/2016/sp/leaf/checkbtn_on.png) no-repeat left center;
    background-size: 20px 20px;
}
textarea {
    width: 100%;
    height: 80px;
    padding: 10px 13px;
    border: solid 1px #d9d9d9;
    border-radius: 3px;
    box-shadow: inset 0 6px 1px -6px rgba(0,0,0,0.2);
    color: #444;
    font-size: 1.5rem;
    resize: none;
    -webkit-appearance: none;
}
/* ===========================================
iframe
============================================ */
iframe#newsframe {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 570px;
    border: 0;
}
.ifrm ul.list {
    border-bottom: solid 1px #e8e8e8;
}
/* ===========================================
トップへ戻るボタン
============================================ */
.pagetop {
}
.pagetop a {
    position: fixed;
    right: 12px;
    bottom: 70px;
    z-index: 100;
}
.pagetop a img {
    width: 60px;
    height: 60px;
}
/* ===========================================
モーダル背景
============================================ */
#modalbg01, #modalbg02 {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    width: 120%;
    background-color:rgba(0,0,0,0.3);
}
#modalbg01.active, #modalbg02.active {
    display:block;
}
#modalbg01 {
    z-index: 10;
}
#modalbg02 {
    z-index: 70;
}