@charset "utf-8";

/* ------------------------------------------------------------------------------
基礎設定
------------------------------------------------------------------------------ */
body{
    color: #333;
    background: #E7ECF2;
    font-family: 'メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic',sans-serif;
}

div#container {
    width: 960px;
    margin: 20px auto;
    text-align: left;
    background: #fff;
    border: 1px solid #999;
}



/* ------------------------------------------------------------------------------
画像のマウスオーバー
------------------------------------------------------------------------------ */
a img {
    background: none ! important;
    border: none;
}

a:hover img {
    opacity: 0.6;
    filter: alpha(opacity=60);
    -ms-filter: "alpha( opacity=60 )";
    background: none ! important;
}



/* ------------------------------------------------------------------------------
骨組み設定
------------------------------------------------------------------------------ */
#header {
    width: 100%;
    /** ヘッダーの背景 **/
}

#logogroup {
    float: left;
    margin: 15px 0 15px 20px;
}

#subnav {
    float: right;
    margin-top: 15px;
}

#logogroup h2 {
    font-weight: normal;
}

#contents {
    float: left;
    width: 683px;
    margin: 0 15px;
}

#sidebar{
	float:right;
	width:232px;
	margin-right:15px;
}

/** 1カラム **/
#one_contents {
    margin-top: 15px;
}



/* ------------------------------------------------------------------------------
文字装飾
------------------------------------------------------------------------------ */
/** 文字サイズ **/
.size8  { font-size: 8px  !important; }
.size10 { font-size: 10px !important; }
.size12 { font-size: 12px !important; }
.size14 { font-size: 14px !important; }
.size16 { font-size: 16px !important; }

/** ディスプレイ **/
.block { display: block !important; }

/** フォント関連 **/
.bold { font-weight: bold !important; }
.al-l { text-align: left !important; }
.al-r { text-align: right !important; }
.al-c { text-align: center !important; }

/** 文字色 **/
.red       { color: #ff0000 !important; }
.blue      { color: #0000ff !important; }
.white     { color: #ffffff !important; }
.syuiro    { color: #e00000 !important; }
.usuyellow { color: #f0e68c !important; }

/** スペース間隔 **/
.m10   { margin: 10px !important; }
.m10-t { margin-top: 10px !important; }
.m20-t { margin-top: 20px !important; }
.m30-t { margin-top: 30px !important; }
.m40-t { margin-top: 40px !important; }
.m50-t { margin-top: 50px !important; }
.m60-t { margin-top: 60px !important; }
.m10-b { margin-bottom: 10px !important; }

.p10   { padding: 10px !important; }
.p20   { padding: 20px !important; }



/* ------------------------------------------------------------------------------
ログインデザイン
予備デザインで後ほどしっかりしたものにする
------------------------------------------------------------------------------ */
.login_data {
    width: 100%;
    text-align: center;
}

.login_table {
    border-collapse: collapse;
    border-spacing: 0;
    margin: 30px auto;
    width: 250px;
    background: url(../img/edittable_td.jpg) repeat;
}

.login_table th {
    background: url(../img/edittable_th.jpg) repeat;
    font-size: 12px;
    font-weight: bold;
}

.login_table th,
.login_table td {
    padding: 5px;
    color: #1D5C79;
    border-bottom: 1px solid #FFF;
}

.login_table td {
    font-size: 12px;
}

.login_table thead th {
    font-size: 14px;
    text-align: center;
}

.login_table tfoot th {
    text-align: right;
}

.login_table tbody th {
    width: 70px;
    text-align: left;
}

.login_table tbody td {
    width: 180px;
    text-align: left;
}

.login_table tbody td input {
    width: 160px;
    margin: 0 5px;
}



/* ------------------------------------------------------------------------------
横メニュー
------------------------------------------------------------------------------ */
/*サブナビゲーション周りの指定*/
#subnav li {
    float: left;
    font-size: 10px;
    margin-right: 15px;
}

#subnav li a {
    background: url(../img/all_kiji_icon.png) no-repeat 0;
    padding-left: 20px;
    color: #069;
    text-decoration: none;
}

#subnav li a:hover {
    color: #f60;
    text-decoration: underline;
}



/* -------------------------------------
 単体記事 ： エディットモード
------------------------------------- */
#edit_navi {
    width: 960px;
    height: 45px;
    margin: 15px auto 0;
    list-style-type: none;
    background: #246eb5;    /** #ff7400 **/
}

#edit_navi li {
    width: 137px;
    float: left;
    padding: 0;
    margin: 0;
    text-align: center;
}

#edit_navi li a {
    display: block;
    width: auto;
    color: #fff;
    font-size: 14px;
    font-weight: bold;
    margin: 0;
    padding: 12px 0;
    text-decoration: none;
}

#edit_navi li a:hover {
    background: #3CB1DB;    /** #ffa443 **/
}


/* -------------------------------------
 ページナビゲーション
------------------------------------- */
.page_nav_cen {
    width: 750px;
    margin: 15px auto 10px auto;
}

.page_navi {
    list-style: none;
    text-align: center;
}

.page_navi li {
    float: left;
    width: 20px;
    padding: 0 10px 5px 0;
}

.page_navi li a,
.page_navi li span {        /* 通常時 */
    width: 100%;
    padding: 2px;
    display: block;
    color: #fff;
    background-color: #246eb5;
    border: 1px solid #ccc;
    text-decoration: none;
    font-weight: bold;
}

.page_navi li a:hover,
.page_navi li span {        /* マウスON時、カレント時 */
    background-color: #3CB1DB;
    color: #fff;
}


/* ------------------------------------------------------------------------------
見出しデザイン
------------------------------------------------------------------------------ */
/** リボン型の見出し（切りっぱなし） **/
.ribbon_cutting {
    font-size: 14px;
    color: #fff;
    position: relative;
    padding: 10px;
    background: #88ccef;
    box-shadow:
        10px 0 0 0 #88ccef,
        -10px 0 0 0 #88ccef,
        0 3px 3px 0 rgba(0,0,0,0.1);
}

.ribbon_cutting:before {
    content: " ";
    position: absolute;
    top: 100%;
    left: -10px;
    width: 0;
    height: 0;
    border-width: 0 10px 10px 0;
    border-style: solid;
    border-color: transparent;
    border-right-color: #7bb8d8;
}

.ribbon_cutting:after {
    content: " ";
    position: absolute;
    top: 0px;
    left: 100%;
    width: 0;
    height: 0;
    border-width: 20px 10px;
    border-style: solid;
    border-color: #88ccef;
    border-right-color: transparent;
}


/** マークがモザイク調 1行限定 **/
.mosaic_mark {
    position: relative;
    margin: 10px auto 0 15px;
    padding: 0 10px 0 55px;
    font: bold 14px/40px Arial, Helvetica, sans-serif;
    color: #666;
    background: #f3f3f3;
    z-index: 1;
}

.mosaic_mark:before {
    content: " ";
    position: absolute;
    top: 0;
    left: 0;
    width: 40px;
    height: 40px;
    border-right: #fff solid 2px;
    background: #f60;
    background-image: -webkit-gradient(linear, left top, left bottom,
            from(            rgba(255, 255, 255, 0.0)),
            color-stop(0.20, rgba(255, 255, 255, 0.0)),
            color-stop(0.20, rgba(255, 255, 255, 0.1)),
            color-stop(0.40, rgba(255, 255, 255, 0.1)),
            color-stop(0.40, rgba(255, 255, 255, 0.3)),
            color-stop(0.60, rgba(255, 255, 255, 0.3)),
            color-stop(0.60, rgba(255, 255, 255, 0.5)),
            color-stop(0.80, rgba(255, 255, 255, 0.5)),
            color-stop(0.80, rgba(255, 255, 255, 0.6)),
            to(              rgba(255, 255, 255, 0.6))
            );
    background-image: -webkit-linear-gradient(top,
            transparent 20%,
            rgba(255, 255, 255, 0.1) 20%,
            rgba(255, 255, 255, 0.1) 40%,
            rgba(255, 255, 255, 0.3) 40%,
            rgba(255, 255, 255, 0.3) 60%,
            rgba(255, 255, 255, 0.5) 60%,
            rgba(255, 255, 255, 0.5) 80%,
            rgba(255, 255, 255, 0.6) 80%,
            rgba(255, 255, 255, 0.6) 100%
            );
    background-image: -moz-linear-gradient(top,
            transparent 20%,
            rgba(255, 255, 255, 0.1) 20%,
            rgba(255, 255, 255, 0.1) 40%,
            rgba(255, 255, 255, 0.3) 40%,
            rgba(255, 255, 255, 0.3) 60%,
            rgba(255, 255, 255, 0.5) 60%,
            rgba(255, 255, 255, 0.5) 80%,
            rgba(255, 255, 255, 0.6) 80%,
            rgba(255, 255, 255, 0.6) 100%
            );
    background-image: -o-linear-gradient(top,
            transparent 20%,
            rgba(255, 255, 255, 0.1) 20%,
            rgba(255, 255, 255, 0.1) 40%,
            rgba(255, 255, 255, 0.3) 40%,
            rgba(255, 255, 255, 0.3) 60%,
            rgba(255, 255, 255, 0.5) 60%,
            rgba(255, 255, 255, 0.5) 80%,
            rgba(255, 255, 255, 0.6) 80%,
            rgba(255, 255, 255, 0.6) 100%
            );
    background-image: linear-gradient(to bottom,
            transparent 20%,
            rgba(255, 255, 255, 0.1) 20%,
            rgba(255, 255, 255, 0.1) 40%,
            rgba(255, 255, 255, 0.3) 40%,
            rgba(255, 255, 255, 0.3) 60%,
            rgba(255, 255, 255, 0.5) 60%,
            rgba(255, 255, 255, 0.5) 80%,
            rgba(255, 255, 255, 0.6) 80%,
            rgba(255, 255, 255, 0.6) 100%
            );
            z-index:-1;
}

.mosaic_mark:after {
    content: " ";
    position: absolute;
    top: 0;
    left: 0;
    width: 40px;
    height: 40px;
    background-image: -webkit-gradient(linear, left top, right top,
            from(            rgba(255, 255, 255, 0.0)),
            color-stop(0.20, rgba(255, 255, 255, 0.0)),
            color-stop(0.20, rgba(255, 255, 255, 0.1)),
            color-stop(0.40, rgba(255, 255, 255, 0.1)),
            color-stop(0.40, rgba(255, 255, 255, 0.3)),
            color-stop(0.60, rgba(255, 255, 255, 0.3)),
            color-stop(0.60, rgba(255, 255, 255, 0.5)),
            color-stop(0.80, rgba(255, 255, 255, 0.5)),
            color-stop(0.80, rgba(255, 255, 255, 0.6)),
            to(              rgba(255, 255, 255, 0.6))
            );
    background-image: -webkit-linear-gradient(left,
            transparent 20%,
            rgba(255, 255, 255, 0.1) 20%,
            rgba(255, 255, 255, 0.1) 40%,
            rgba(255, 255, 255, 0.3) 40%,
            rgba(255, 255, 255, 0.3) 60%,
            rgba(255, 255, 255, 0.5) 60%,
            rgba(255, 255, 255, 0.5) 80%,
            rgba(255, 255, 255, 0.6) 80%,
            rgba(255, 255, 255, 0.6) 100%
            );
    background-image: -moz-linear-gradient(left,
            transparent 20%,
            rgba(255, 255, 255, 0.1) 20%,
            rgba(255, 255, 255, 0.1) 40%,
            rgba(255, 255, 255, 0.3) 40%,
            rgba(255, 255, 255, 0.3) 60%,
            rgba(255, 255, 255, 0.5) 60%,
            rgba(255, 255, 255, 0.5) 80%,
            rgba(255, 255, 255, 0.6) 80%,
            rgba(255, 255, 255, 0.6) 100%
            );
    background-image: -o-linear-gradient(left,
            transparent 20%,
            rgba(255, 255, 255, 0.1) 20%,
            rgba(255, 255, 255, 0.1) 40%,
            rgba(255, 255, 255, 0.3) 40%,
            rgba(255, 255, 255, 0.3) 60%,
            rgba(255, 255, 255, 0.5) 60%,
            rgba(255, 255, 255, 0.5) 80%,
            rgba(255, 255, 255, 0.6) 80%,
            rgba(255, 255, 255, 0.6) 100%
            );
    background-image: linear-gradient(to right,
            transparent 20%,
            rgba(255, 255, 255, 0.1) 20%,
            rgba(255, 255, 255, 0.1) 40%,
            rgba(255, 255, 255, 0.3) 40%,
            rgba(255, 255, 255, 0.3) 60%,
            rgba(255, 255, 255, 0.5) 60%,
            rgba(255, 255, 255, 0.5) 80%,
            rgba(255, 255, 255, 0.6) 80%,
            rgba(255, 255, 255, 0.6) 100%
            );
            z-index:-1;
}



/* ------------------------------------------------------------------------------
吹き出し
------------------------------------------------------------------------------ */
a.pop {
    position: relative;
    text-decoration: none;
}

a.pop span {
    position: absolute;
    top: 30px;
    left: 5px;
    display: none;
    letter-spacing: 0;
    border: none;
}

a.pop:hover span.popup {
    display: block;
    z-index: 10;
    width: 250px;
    padding: 15px 20px;
    color: #111;
    font-size: 14px;
    font-weight: normal;
    word-wrap: break-word;
    text-align: left;
    text-decoration: none;
    border-radius: 6px;
    box-shadow: inset 0 -1px 1px rgba(0, 0, 0, 0.9), inset 0 1px 0 rgba(255, 255, 255, 0.4);
    background-color: #efefef;  /** 古いブラウザ用 **/
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0.00, #cecece), color-stop(1.00, #fff));
    background: -webkit-linear-gradient(#cecece, #fff);
    background: -moz-linear-gradient(#cecece, #fff);
    background: -o-linear-gradient(#cecece, #fff);
    background: -ms-linear-gradient(#cecece, #fff);
    background: linear-gradient(#cecece, #fff);
}

a.pop:hover span.top {
    display: block;
    border-top: 15px solid  transparent;
    border-left: 15px solid #cecece;
    width : 0px;
    height : 0px;
    top: -15px;
    left : 10px;
}

/** エディットモード:本格編集アイコン **/
a.pop:hover span.edittxt_icon_size {
    width: 40px;
    padding: 5px;
    font-size: 10px;
}

/** エディットモード:サイト統一メモアイコン **/



/* ------------------------------------------------------------------------------
テーブルデザイン
------------------------------------------------------------------------------ */
/* -------------------------------------
 ログデザイン
------------------------------------- */
.log_table {
    border-collapse: collapse;
    border-spacing: 0;
    width: 900px;
    margin: 10px 0 50px 25px;
    background: url(../img/edittable_td.jpg) repeat;
}

.log_table th {
    background: url(../img/edittable_th.jpg) repeat;
    height: 20px;
    font-weight: bold;
    text-align: center;
    font-size: 14px !important;
}


.log_table td {
    vertical-align: top;
    text-align: left;
}

.log_table th,
.log_table td {
    font-size: 12px;
    padding: 5px;
    color: #1D5C79;
    border-bottom: 0 solid #FFF;
}

/** トップページ：セルの横幅指定 width:840px **/
.log_table .clonl,
.log_table .clonr {
    height: auto;
}

.log_table .clonl {
    width: 210px;
    height: 340px;
    overflow-y: auto;
    word-wrap: break-word;
}

.log_table .clonr {
    width: 670px;
    height: 150px;
    overflow-y: auto;
    word-wrap: break-word;
}



/* -------------------------------------
 トップページ管理メニュー width:900px
------------------------------------- */
.top_admin_nav {
    width: 900px;
    height: auto;
    margin: 10px 0 20px 25px;
    font-size: 12px;
}

.top_admin_nav .osirase {
    float: left;
    width: 400px;
}

.top_admin_nav .admin {
    float: right;
    width: 450px;
    overflow: hidden;
}

/** トップページ管理メニュー : 操作メニューの余白 **/
.top_admin_nav .admin .select div,
.top_admin_nav .admin .check div,
.top_admin_nav .admin .foot div {
    padding: 4px 0;
}

.top_admin_nav h1 {
    width: 50%;
	margin: 0 0 10px 0;
	padding: 2px 8px;
	border-width: 0 0 5px 0 ;
	border-color: #15aecb;
	border-style: solid;
	background: #f0f8fa;
	color: #4f4d45;
	line-height: 140%;
    font-size: 14px;
	font-weight: bold;
}

.top_admin_nav .osirase .new {
    width: 100%;
    height: 90px;
    font-size: 10px;
    text-align: left;
    word-wrap: break-word;
    overflow-y: auto;
    background: #f0f8fa;
}

.top_admin_nav .admin .select,
.top_admin_nav .admin .check,
.top_admin_nav .admin .foot {
    background: #f0f8fa;
}

/** トップページ管理メニュー : 操作メニュー幅指定 width:450px **/
.top_admin_nav .admin .select {
    padding-bottom: 32767px;
    margin-bottom: -32767px;
    width: 250px;
    float: left;
}

.top_admin_nav .admin .check {
    padding-bottom: 32767px;
    margin-bottom: -32767px;
    width: 200px;
    float: right;
}

.top_admin_nav .admin .foot {
    clear: both;
    width: 100%;
}

/** トップページ管理メニュー : 操作・セル個別指定 **/
.top_admin_nav .admin .title {
    float: left;
    width: 100px;
    padding-left: 10px;
    font-weight: bold;
}

.top_admin_nav .admin .data {
    float: right;
    width: 140px;
}

.top_admin_nav .admin .box {
    float: right;
    width: 50px;
    text-align: center;
}

.top_admin_nav .admin .one {
    text-align: center;
    font-weight: bold;
}



/* -------------------------------------
 トップページ：背景色青
------------------------------------- */
.top_table {
    border-collapse: collapse;
    border-spacing: 0;
    width: 900px;
    margin: 10px 0 0 25px;
    background: url(../img/edittable_td.jpg) repeat;
}

.top_table th,
.top_table .submit {
    background: url(../img/edittable_th.jpg) repeat;
    font-weight: bold;
    text-align: center;
}

/**  角を丸める処理
.edit_table th.topL {
    background: url(../img/edittable_thl.jpg) no-repeat;
}

.edit_table .topR {
    background: url(../img/edittable_thr.jpg) no-repeat top right;
}
**/

.top_table td {
    text-align: left;
}

.top_table th,
.top_table td {
    font-size: 10px;
    padding: 5px;
    color: #1D5C79;
    border-bottom: 0 solid #FFF;
}

/** トップページ：セルの横幅指定 width:840px **/
.top_table .side,
.top_table .body {
    height: auto;
}

.top_table .side {
    font-size: 10px;
    width: 30px;
}

.top_table .body {
    width: 195px;
}

/** トップページ：セル内の配置 **/
.top_table .title,
.top_table .form {
    float: left;
    height: auto;
    margin: 3px;
    font-size: 12px;
}

.top_table .title {
    width: 80px;
}

.top_table .form {
    width: 103px;
}

.top_table .cdata {
    text-align: center;
    font-size: 12px;
    height: auto;
    margin: 3px;
}

/** トップページ：フォームのサイズ **/
.top_table .data {
    width: 98%;
    font-size: 12px;
}


.top_table .submit {
    padding: 5px;
    font-weight: normal;
    font-size: 12px;
}



/** 記事投稿モード予備 **/
.top_table .post_yobi {
    width: 450px;
}

.top_table .post_yobi2 {
    width: 900px;
}



/* -------------------------------------
 エディットモード背景色青
------------------------------------- */
.edit_table {
    border-collapse: collapse;
    border-spacing: 0;
    width: 910px;
    margin: 10px 0 0 25px;
    background: url(../img/edittable_td.jpg) repeat;
}

.edit_table th {
    background: url(../img/edittable_th.jpg) repeat;
    font-size: 12px;
    font-weight: bold;
}

/**  角を丸める処理
.edit_table th.topL {
    background: url(../img/edittable_thl.jpg) no-repeat;
}

.edit_table .topR {
    background: url(../img/edittable_thr.jpg) no-repeat top right;
}
**/

.edit_table th,
.edit_table td {
    padding: 10px 20px;
    color: #1D5C79;
    border-bottom: 1px solid #FFF;
}

.edit_table td {
    font-size: 12px;
}

/** エディットモード **/
.edit_table .title_sidel,
.edit_table .data,
.edit_table .title_sider,
.edit_table .kiji_sidel,
.edit_table .kijiall_side_onel,
.edit_table .time_click,
.edit_table .time_check,
.edit_table .time_submit,
.edit_table .time_mtitle {
    text-align: center;
    height: auto;
    margin: 0 auto;
}

.edit_table .data {
    width: 100%;
}

.edit_table .asp {
    color: #ffa443;
}

.edit_table .text_w {
    /* 横幅を絶対指定しないと
     * レイアウトが崩れるためが保留
    width: 85%;
     */
}

/** エディットモード：タイトル **/
.edit_table .title_sidel {
    width: 100px;
}

.edit_table .title_sider {
    width: 40px;
}

/** エディットモード：画像横幅指定 **/
.edit_table .img_twidth {
    height: 80px !important;
    width: auto;
}

.edit_table .img_kwidth {
    height: 100px !important;
    width: auto;
}

.edit_table .icon {
    height: 16px;
    width: 16px;
}

/** エディットモード：簡易＆本格編集 **/
.edit_table .kiji_sidel {
    width: 300px;
}

.edit_table .kijiall_side_onel {
    width: 150px;
}

.edit_table .sitememo {
    width: 150px;
    height: 150px;
    margin: 0 auto;
    font-size: 10px;
    text-align: left;
    word-wrap: break-word;
    overflow-y: auto;
}

/** エディットモード：時間 **/
.edit_table .time_click {
    width: 20px;
}

.edit_table .time_check {
    width: 50px;
}

.edit_table .time_mtitle {
    width: 730px;
}

.edit_table .time_submit {
    width : 50px;
}

.edit_time th,
.edit_time td {
    padding: 5px !important;
}

/** 臨時メニュー:後ほど良い物を作成 **/
.top_admin_nav .time {
    float: left;
    width: 600px;
}

.top_admin_nav .time .rinzi {
    width: 100%;
    height: auto;
    padding: 10px;
    font-size: 12px;
    text-align: left;
    word-wrap: break-word;
    background: #f0f8fa;
}



/* ------------------------------------------------------------------------------
フッター
------------------------------------------------------------------------------ */
#footer {
    margin-top: 15px;
    clear: both;
    text-align: center;
    background: #246eb5;
    color: #fff;
    padding: 8px 8px 8px 0;
}

#footer p.copyright {
    padding-top: 3px;
}

#footer a {
    color: #ff0;
    text-decoration: none;
}

#footer a:hover {
    text-decoration: underline;
}



