@charset "UTF-8";

/*
180wiki skin gray(width1000) 0.1 2009/9/10 hrmz
http://180.style.coocan.jp/wiki/
*/

/* wrap
----------------------------------------------------------------------------- */
body { text-align: center; }

div#wrapper {
	width: 1000px;
	margin: 0 auto;
	text-align: left;
}

div#wrap_content{
	float:left;
	width: 770px;
}

div#wrap_sidebar{
	float:right;
	width: 230px;
}
div#footer{
	clear:both;
}

/* ■■ design ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/

/* General
----------------------------------------------------------------------------- */
body{
	font-family:'ヒラギノ丸ゴ Pro W4','Hiragino Maru Gothic Pro','游ゴシック Medium','Yu Gothic Medium','游ゴシック','Yu Gothic','Hiragino Kaku Gothic Pro','メイリオ','ＭＳ Ｐゴシック','MS PGothic',sans-serif;
	font-size:small;
	color:#000000;
	margin: 0;
	padding: 0;
}

img{
	border:none;
	vertical-align:middle;
}

#wrapper {
	background-image: url(180mt-w1000-body2BgMid.gif);
	background-repeat: repeat-y;
}

/* ----- link ----- */
a:link {
	color: #0000ff;
	text-decoration: none;
}
a:visited {
	color: #7a0099;
	text-decoration: none;
}
a:active {
	color: #000000;
	text-decoration: underline;
}
a:hover {
	color: #FF33CC;
	text-decoration: underline;
}

div.ie5 { text-align:center; }

span.noexists {
	color:inherit;
	background-color:#FFFACC;
}

.super_index {
	color:#DD3333;
	background-color:inherit;
	font-weight:bold;
	font-size:60%;
	vertical-align:super;
}

a.note_super {
	color:#DD3333;
	background-color:inherit;
	font-weight:bold;
	font-size:60%;
	vertical-align:super;
}

div.jumpmenu {
	font-size:60%;
	text-align:right;
}

em { font-style:italic; }

strong { font-weight:bold; }

.small { font-size:80%; }

span.size1 {
	font-size:xx-small;
	line-height:130%;
	text-indent:0px;
	display:inline;
}
span.size2 {
	font-size:x-small;
	line-height:130%;
	text-indent:0px;
	display:inline;
}
span.size3 {
	font-size:small;
	line-height:130%;
	text-indent:0px;
	display:inline;
}
span.size4 {
	font-size:medium;
	line-height:130%;
	text-indent:0px;
	display:inline;
}
span.size5 {
	font-size:large;
	line-height:130%;
	text-indent:0px;
	display:inline;
}
span.size6 {
	font-size:x-large;
	line-height:130%;
	text-indent:0px;
	display:inline;
}
span.size7 {
	font-size:xx-large;
	line-height:130%;
	text-indent:0px;
	display:inline;
}

/* html.php/catbody() */
strong.word0 {
	background-color:#FFFF66;
	color:black;
}
strong.word1 {
	background-color:#A0FFFF;
	color:black;
}
strong.word2 {
	background-color:#99FF99;
	color:black;
}
strong.word3 {
	background-color:#FF9999;
	color:black;
}
strong.word4 {
	background-color:#FF66FF;
	color:black;
}
strong.word5 {
	background-color:#880000;
	color:white;
}
strong.word6 {
	background-color:#00AA00;
	color:white;
}
strong.word7 {
	background-color:#886800;
	color:white;
}
strong.word8 {
	background-color:#004699;
	color:white;
}
strong.word9 {
	background-color:#990099;
	color:white;
}

/* Header
----------------------------------------------------------------------------- */
#header{
	height: 150px;
	width: 1000px;
	text-align: left;
	background-image: url(header1.png);
	background-repeat: no-repeat;
	font-family: 'Hiragino Maru Gothic Pro', Meiryo, verdana, arial, 'trebuchet ms', sans-serif;
	font-size: 30px;
	font-weight: bold;
	color: #dcdcdc;
}

#header a,
#header a:link,
#header a:visited,
#header a:active,
#header a:hover {
	font-family: 'Hiragino Maru Gothic Pro', Meiryo, verdana, arial, 'trebuchet ms', sans-serif;
	font-size: 30px;
	font-weight: bold;
	color: #696969;
	text-decoration: none;
}

#logo{
	padding: 50px 35px 0px 65px;
}


/* Content
----------------------------------------------------------------------------- */
#toolbar {
	margin-left: 15px;
}

#content {
	margin-left: 15px;
}

#content h1.title{
	margin:  0;
	padding: 0;
	background-image: none;
	border-style: none;
}
#content h1.title a{
	font-size:25px;
	color: #666666;
	text-decoration:none;
}

#lastmodified{
	color:#000000;
	font-size:12px;
}

#body{
	margin-top:10px;
	line-height: 1.5;
}

h1, h2 {
	font-size:16px;
	font-weight: bold;
	margin:10px 20px 10px 5px;
	padding:4px 0px 4px 26px;
	color: #666666;
	background-image: url(180mt-circleL.gif);
	background-position: left center;
	background-repeat: no-repeat;
	border-bottom:1px dotted #DDDDDD;
}

h1 a:link,
h1 a:visited,
h2 a:link,
h2 a:visited {
	color: #666666;
	text-decoration: none;
}
h1 a:hover,
h2 a:hover {
	color: #FF33CC;
	text-decoration: underline;
}

h3 {
	font-size:14px;
	border-bottom:  3px solid #CCCCCC;
	border-top:     1px solid #CCCCCC;
	border-left:   10px solid #CCCCCC;
	border-right:   3px solid #CCCCCC;
	margin:10px 20px 10px 15px;
	padding:2px 0px 2px 10px;
}
h4 {
	font-size:13px;
	border-left:   8px solid #CCCCCC;
	margin:10px 20px 10px 15px;
	padding:0px 0px 0px 10px;
}
h5, h6 {
	padding-left:10px;
}

p{
	margin:5px 20px;
}

.style_table {
	padding:0px;
	border:0px;
	margin:0px 20px;
	text-align:left;
	color:inherit;
	background-color:#DDDDDD;
}
.style_th {
	padding:5px;
	margin:1px;
	text-align:center;
	color:inherit;
	background-color:#EEEEEE;
}

.style_td {
	padding:5px;
	margin:1px;
	color:inherit;
	background-color:#EEEEEE
}

thead td.style_td,
tfoot td.style_td {
	color:inherit;
	background-color:#D0D8E0;
}
thead th.style_th,
tfoot th.style_th {
	color:inherit;
	background-color:#E0E8F0;
}

pre{
	border-top:    1px solid #DDDDDD;
	border-right:  2px solid #DDDDDD;
	border-bottom: 2px solid #DDDDDD;
	border-left:   1px solid #DDDDDD;
	margin:5px 20px;
	padding:.5em;
	word-wrap:break-word;
	overflow:auto;
}

blockquote {
	margin:5px 20px;
	padding:5px;
	background-color:#EEEEEE;
	border:1px solid #DDDDDD;
}

ul {
	margin-top:5px;
	margin-bottom:5px;
	margin-right:2em;
}

ul.list1 { list-style-type:disc; }
ul.list2 { list-style-type:circle; }
ul.list3 { list-style-type:square; }
ol.list1 { list-style-type:decimal; }
ol.list2 { list-style-type:lower-roman; }
ol.list3 { list-style-type:lower-alpha; }

dt {
	font-weight:bold;
	margin-top:5px;
	margin-bottom:5px;
}
dd {
	margin: 5px 20px 5px 25px;
}

hr.full_hr {
	border-style:solid;
	border-color:#000000;
	border-width:1px 0px;
}
hr.note_hr {
	width:90%;
	border-style:solid;
	border-color:#000000;
	border-width:1px 0px;
}

/* SideBar
----------------------------------------------------------------------------- */
div#menubar {
	margin:15px 15px 15px 5px;
	padding:0px;
	font-size: 12px;
	word-break:break-all;
	overflow:hidden;
}

div#menubar h2{
	margin:5px 0px;
	padding:5px 10px 5px 15px;
	font-size: 12px;
	font-weight: bold;
	color: #FFFFFF;
	background-image: url(180wiki-gray-SideBgTop.gif);
	background-repeat: no-repeat;
	background-position: left center;
	border-style: none;
}
div#menubar h3,
div#menubar h4,
div#menubar h5,
div#menubar h6 {
	font-weight: bold;
	padding:0px;
}

div#menubar ul {
	padding-left: 15px;
	margin-left: 5px;
	list-style-image: url(180mt-arrow.gif);
}

/* Footer
----------------------------------------------------------------------------- */
#footer{
	font-size:13px;
	text-align:center;
	color: #666666;
	padding-bottom: 10px;
	background-image: url(180mt-w1000-body2BgBtm.gif);
	background-repeat: no-repeat;
	background-position:left bottom;
}
/* -------------------------------------------------------------------------- */

/* html.php/edit_form() */
.edit_form { clear:both; }

/* pukiwiki.skin.php */
div#navigator {
	clear:both;
	padding:4px 0px 0px 0px;
	margin:0px;
}


div#note {
	clear:both;
	padding:0px;
	margin:0px;
}

div#attach {
	clear:both;
	padding:0px;
	margin:0px;
}

div#related {
	font-size:80%;
	padding:0px;
	margin:16px 0px 0px 0px;
}

div#banner {
	float:right;
	margin-top:24px;
}

div#preview {
	color:inherit;
	background-color:#F5F8FF;
}

/* aname.inc.php */
.anchor {}
.anchor_super {
	font-size:xx-small;
	vertical-align:super;
}

/* br.inc.php */
br.spacer {}

/* calendar*.inc.php */
.style_calendar {
	padding:0px;
	border:0px;
	margin:3px;
	margin-left:20px;
	color:inherit;
	background-color:#CCD5DD;
	text-align:center;
}
.style_td_caltop {
	padding:5px;
	margin:1px;
	color:inherit;
	background-color:#EEF5FF;
	font-size:80%;
	text-align:center;
}
.style_td_today {
	padding:5px;
	margin:1px;
	color:inherit;
	background-color:#FFFFDD;
	text-align:center;
}
.style_td_sat {
	padding:5px;
	margin:1px;
	color:inherit;
	background-color:#DDE5FF;
	text-align:center;
}
.style_td_sun {
	padding:5px;
	margin:1px;
	color:inherit;
	background-color:#FFEEEE;
	text-align:center;
}
.style_td_blank {
	padding:5px;
	margin:1px;
	color:inherit;
	background-color:#EEF5FF;
	text-align:center;
}
.style_td_day {
	padding:5px;
	margin:1px;
	color:inherit;
	background-color:#EEF5FF;
	text-align:center;
}
.style_td_week {
	padding:5px;
	margin:1px;
	color:inherit;
	background-color:#DDE5EE;
	font-size:80%;
	font-weight:bold;
	text-align:center;
}

/* calendar_viewer.inc.php */
div.calendar_viewer {
	color:inherit;
	background-color:inherit;
	margin-top:20px;
	margin-bottom:10px;
	padding-bottom:10px;
}
span.calendar_viewer_left {
	color:inherit;
	background-color:inherit;
	float:left;
}
span.calendar_viewer_right {
	color:inherit;
	background-color:inherit;
	float:right;
}

/* clear.inc.php */
.clear {
	margin:0px;
	clear:both;
}

/* counter.inc.php */
div.counter {
	color: #666666;
	font-size:75%; 
}

/* diff.inc.php */
span.diff_added {
	color:blue;
	background-color:inherit;
}

span.diff_removed {
	color:red;
	background-color:inherit;
}

/* hr.inc.php */
hr.short_line {
	text-align:center;
	width:80%;
	border-style:solid;
	border-color:#333333;
	border-width:1px 0px;
}

/* include.inc.php */
h5.side_label { text-align:center; }

/* navi.inc.php */
ul.navi {
	margin:0px;
	padding:0px;
	text-align:center;
}
li.navi_none {
	display:inline;
	float:none;
}
li.navi_left {
	display:inline;
	float:left;
	text-align:left;
}
li.navi_right {
	display:inline;
	float:right;
	text-align:right;
}

/* new.inc.php */
span.comment_date { font-size:x-small; }
span.new1 {
	color:red;
	background-color:transparent;
	font-size:x-small;
}
span.new5 {
	color:green;
	background-color:transparent;
	font-size:xx-small;
}

/* popular.inc.php */
span.counter { font-size:70%; }
ul.popular_list {
<?php
/*
	padding:0px;
	border:0px;
	margin:0px 0px 0px 1em;
	word-wrap:break-word;
	word-break:break-all;
*/
?>
}

/* recent.inc.php,showrss.inc.php */
ul.recent_list {
<?php
/*
	padding:0px;
	border:0px;
	margin:0px 0px 0px 1em;
	word-wrap:break-word;
	word-break:break-all;
*/
?>
}

/* ref.inc.php */
div.img_margin {
	margin-left:32px;
	margin-right:32px;
}

/* search.inc.php id付必要 */
div#searchbox {
	margin:0px 15px;
}

/* vote.inc.php */
td.vote_label {
	color:inherit;
	background-color:#FFCCCC;
}
td.vote_td1 {
	color:inherit;
	background-color:#DDE5FF;
}
td.vote_td2 {
	color:inherit;
	background-color:#EEF5FF;
}

/* 本文の方のみ、検索ボックスを調整 */
#body form[action="./?cmd=search"] div {
 margin :20px 20px;
}
#body form[action="./?cmd=search"] input[name="word"] {
width: 60%  ; 
max-width: 500px  ; 
}
/* コメント投稿欄の幅調整 */
input[name="msg"]{
width: 90％  ; 
max-width : 400px;
}
/* =============================================
   サイドバー折りたたみ（スマホ対応）
   180wiki.css の末尾に追記
   ============================================= */

/* タブボタン（PC時は非表示） */
#sidebar-tab {
  display: none;
}

/* オーバーレイ */
#sidebar-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.4);
  z-index: 90;
}
#sidebar-overlay.is-open {
  display: block;
}

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

  /* レイアウトをブロックに切り替え */
  #main {
    display: block !important;
  }

  /* サイドバーを画面左端に固定・初期状態は隠す */
  #wrap_sidebar {
    position: fixed;
    top: 0;
    left: 0;
    width: 240px;
    height: 100%;
    transform: translateX(-240px);
    transition: transform 0.3s ease;
    z-index: 100;
    overflow-y: auto;
    background: #fff; /* ← 白背景。好みの色に変更可 */
  }

  /* 開いた状態 */
  #wrap_sidebar.is-open {
    transform: translateX(0);
  }

  /* メインコンテンツは全幅に */
  #wrap_content {
    width: 100% !important;
    margin: 0 !important;
  }

  /* タブボタン表示 */
  #sidebar-tab {
    display: block;
    position: fixed;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    z-index: 200;
    background: #333; /* 好みの色に変更可 */
    color: #fff;
    writing-mode: vertical-rl;
    padding: 14px 8px;
    font-size: 13px;
    cursor: pointer;
    border-radius: 0 6px 6px 0;
    box-shadow: 2px 0 6px rgba(0,0,0,0.3);
    user-select: none;
    transition: left 0.3s ease;
    line-height: 1.4;
  }

  /* サイドバーが開いたらタブを右へ */
  #wrap_sidebar.is-open + #sidebar-tab,
  #sidebar-tab.is-open {
    left: 240px;
  }
}

/* 長いURLのはみ出し対策 */
@media screen and (max-width: 768px) {
  #body, #comment, .comment, li, td, p {
    word-break: break-all;
    overflow-wrap: break-word;
  }
}



//	/* iframe.inc.php */
//	iframe {
//		margin-left:20px
//