/*========== コンテンツ中身 ==========*/
#content { text-align: left;}

#content h1 {
height: 42px;
background: url(../images/h1.gif) no-repeat center top;
font-size: 19px;
padding-left: 45px;
line-height: 240%;
color: #333;
margin-bottom: 15px;
}

#content .col {
margin: 0 0 5px 0;
}

#content .colbody {
margin: 0 5px 0 5px;
}



/* 共通ページナビ */
#navigation {/*ページナビ*/
text-align: center;
margin: 0 auto;
padding: 5px 0;
clear: both;
}

#navigation a {
border: 1px solid #00847b;
background: #00847b;
margin: 0 1px;
padding: 2px 5px;
color: #FFF;
font-size: 11px;
width: 20px;
text-decoration: none;
}

#navigation a.on,
#navigation span {
width: 20px;
text-align: center;
border: 1px solid #00847b;
background: #FFF;
margin: 0 1px;
padding: 2px 5px;
color: #00847b;
text-decoration: none;
}

#navigation a.navin {
border: 0;
background: #FFF;
color: #00847b;
text-decoration: none;
}

#content .colbody .buttonRow {
margin: 0 auto;
text-align: center;
}

.colbody #filter #order { /*表示順＆件数*/
border-top: 1px solid #CCC;
}

.colbody #filter.btm #order { /*表示順＆件数*/
border-top: 1px solid #CCC;
}

.colbody #filter {
float: clear;
padding: 0;
border-bottom: 1px solid #CCC;
}

.colbody #filter.btm {
border: 0;
}

.colbody #filter #order select { /*プルダウン*/
border: 1px solid #CCC;
background: #EDEDED;
}

.colbody #filter #order #orderl {/*左（表示順）*/
width: 250px;
float: left;
margin: 5px 0 0 5px;
}

.ie .colbody #filter #order #orderl {
width: 220px;
}

.colbody #filter #order #orderr {/*右（件数）*/
width: 250px;
float: right;
text-align: right;
margin: 5px 5px 0 0;
}


/*-----リストテーブル用 -----*/
table.list01 {
border-right: 1px solid #CCC;
border-bottom: 1px solid #CCC;
}

table.list01 th.title {
background: #EDEDED;
color: #993399;
padding: 3px 5px; 
font-weight: bold;
font-size: 13px;
font-weight: bold;
}
 
table.list01 th.title a {
font-weight: bold;
}

table.list01 th {
padding: 3px 3px;
border-top: 1px solid #CCC;
border-left: 1px solid #CCC;
background: #fde1ff;
}

table.list01 td {
padding: 3px 3px;
border-top: 1px solid #CCC;
border-left: 1px solid #CCC;
}



table.list02 {
border-top: 1px solid #b2d9d7;
border-left: 1px solid #b2d9d7;
border-right: 1px solid #b2d9d7;
width: 490px;
margin: 5px auto;
}

table.list02 th,
table.list02 td {
padding: 5px 8px;
border-bottom: 1px solid #b2d9d7;
}

table.list02 th {
color: #00847b;
}

table.list02 td {
background: #edf6f6;
}

table.list02 td span {
font-size: 10px;
color: #666;
}

table.list03 {
width: 490px;
margin: 0px auto;
}

table.list03 th,
table.list03 td {
padding: 5px 8px;
border-bottom: 1px dotted #CCC;
border-left: 1px dotted #CCC;
}

table.list03 th {
color: #993399;
font-weight: bold;
}

table.list03 td {

}

table.list03 td span {
font-size: 10px;
color: #666;
}


table.listadmin {
border-top: 1px solid #cc66ff;
border-right: 1px solid #cc66ff;
margin: 5px auto;
}

table.listadmin th,
table.listadmin td {
padding: 5px 8px;
border-left: 1px solid #CC66ff;
border-bottom: 1px solid #CC66ff;
}

table.listadmin th {
color: #993399;
background: #fde1ff;
}

table.listadmin td {
}

/*-----TOP&Page: リストナビ -----*/

#top .colbody {
margin: 0;
padding: 0;
}

#listnavi {
line-height: 100%;
background: url(../images/listnavi_bg.gif) no-repeat center top;
height: 30px;
margin: 0px 0 10px 0;
}

#listnavi #counter {
line-height: 100%;
width: 200px;
float: left;
margin: 7px 0 0 155px;
font-size: 16px;
font-weight: bold;
color: #666;
text-align: left;
}

.ie6 #listnavi #counter {
margin-left: 80px;
}

#listnavi #search {
line-height: 100%;
width: 216px;
float: right;
margin: 6px 0 0 0;
padding: 0;
}

#listnavi #search input {
line-height: 100%;
width: 150px;
height: 15px;
font-size: 11px;
border: 1px solid #CCC;
margin: 1px 0 0 0;
padding: 0;
float: left;
}

#listnavi #search button {
float: right;
line-height: 100%;
width: 60px;
height: 18px;
border: 0;
background: url(../images/btn_search.gif) no-repeat top left;
margin: 0;
padding: 0;
}

#listnavi #sort {
line-height: 100%;
width: 320px;
float: right;
text-align: right;
margin: 9px 25px 0 0;
color: #666;
}

.ie #listnavi #sort {
margin: 7px 25px 0 0;
}

#listnavi #sort span {
font-weight: bold;
color: #666;
}

/*-----TOP&Page: リストボクス -----*/

.listbox {
background: url(../images/box_bg.gif) no-repeat;
width: 322px;
height: 175px;
float: left;
margin: 0 0 5px 0;
}

.listbox#box2 {
background: url(../images/box_bg2.gif) no-repeat;
}

.listboxin {
padding: 16px 0px 0px 16px;
}

.listimg {
width: 100px;
height: 100px;
overflow: hidden;
float: left;
}

.listinfo {
width: 200px;
float: right;
}

.listinfo h3 {
width: 190px;
height: 25px;
overflow: hidden;
}

.ie .listinfo h3 {height: 25px; padding: 0; margin: 0; line-height: 100%}

.listinfo p {
width: 185px;
height: 52px;
overflow: hidden;
margin: 0;
padding: 0;
font-size: 11px;
margin: 0 0 2px 0;
}

.ie .listinfo p { height: 55px; line-height: 160%; margin: 0;}

.listbtn {
margin-left: 4px;
}

.listusedimg {
line-height: 100%;
clear: both;
margin: 0px 0 0 110px;
padding-top: 13px;
}

.ie .listusedimg {
}

.listusedimgdiv {
 border: 1px solid #FFF; 
 width: 32px; 
 height: 32px; 
 text-align: center; 
 overflow: hidden;
 margin-right: 3px;
 }

.listusedimgdiv div {
text-align: center;
width: 32px;
height: 32px;
display: table-cell;
 vertical-align: middle; 
}
 
 .listusedimgdiv img {
margin: 0;
max-width: 32px; 
max-height: 32px;
 }

/*-----TOP&Page: リストボクス2 -----*/

.listbox2 {
background: url(../images/mytop_switch_bg.gif) no-repeat center center;
width: 970px;
height: 65px;
margin: 0 0 0px -8px;
}

.listboxin2 {
padding: 13px 0px 0px 16px;
}

.listimg2 {
margin: 0px 0 0 5px;
width: 40px;
height: 40px;
overflow: hidden;
float: left;
}

.listinfo2 {
width: 470px;
float: left;
margin: 0 0 0 20px;
overflow: hidden;
color: #CC0000;
}

.listinfo2 h3 span {
font-size: 12px;
font-weight: normal;
color: #666;
}

.listinfo2 p {
color: #333;
height: 20px;
overflow: hidden;
}

.listinfo2img {
width: 200px;
float: left;
overflow: hidden;
margin: 5px 0 0 10px;
}

.listbtn2 {
width: 185px;
float: right;
margin-right: 15px;
}

/*-----Page: Detail -----*/
#detail h1 span {
font-size: 12px;
margin-left: 530px;
}

#detailL {
width: 300px;
float: left;
}

#detailR {
width: 630px;
float: right;
}

#detailSample {
background: url(../images/detail_sample_bg.gif);
width: ;
}

#detail h2 {
color: #00847b;
border-bottom: 1px solid #00847b;
margin-bottom: 10px;
padding-bottom: 5px;
}

#detail h3 {
text-align: right;
font-size: 12px;
margin: -35px 0 20px 0;
padding: 0;
}

#detail p {
font-size: 14px;
padding-bottom: 5px;
}

#detail .widgettag {
border: 1px dotted #666;
margin: 0 0 10px 0;
padding: 5px 10px;
color: #666;
}

#detail .detailcounter {
margin-bottom: 20px;
text-align: right;
}

#detail #code {
margin: 0;
padding: 0;
background: url(../images/detail_code.gif) no-repeat left top;
}

#detail #code .help {
text-align: right;
}

#detail #code textarea {
 width: 630px;
 height: 95px;
 border: 1px solid #00847b;
 margin: 0;
 padding: 10px 0 0 0;
}

#detail #detailpolicy {
margin: 10px 0 0 0;
font-size: 10px;
background: #edf6f6;
padding: 15px 0 15px 30px;
color: #666;
}

/*-----Page: MyTop -----*/

#mytop h2.h2Image {
background: url(../images/mytop_h2_image.gif) no-repeat;
height: 30px;
line-height: 190%;
}

#mytop h2.h2Image span {
margin-left: 220px;
color: #FFF;
font-size: 12px;
}

.ie #mytop h2.h2Image span {
padding-top: 7px;
display: block;
}

#mytop h2.h2Image span a {
color: #FFF;
font-weight: normal;
}

#mytop .myimage {
border: 1px solid #666;
background: #EDEDED;
overflow: auto;
margin: 0 0 40px 0;
}

#mytop .myimage table {
overflow: auto;
}

#mytop .myimage .myimageinfo {
background: #FFF;
margin: 0;
padding: 2px 0;
width: 64px;
font-size: 10px;
}

#mytop h2.h2Switch {
background: url(../images/mytop_h2_switch.gif) no-repeat;
height: 30px;
line-height: 190%;
}

#mytop h2.h2Switch span {
margin-left: 270px;
color: #FFF;
font-size: 12px;
}

.ie #mytop h2.h2Switch span {
padding-top: 7px;
display: block;
}

#mytop h2.h2Switch span a {
color: #FFF;
font-weight: normal;
}


/*-----Page: Add image -----*/

#imageadd .imagebox {
text-align: center;
background: #b2d9d7 url(../images/editor_btm.gif) no-repeat center bottom;
width: 950px;
}

#imageadd .imagebox .editorin {
width: 936px;
margin: 5px auto;
padding: 20px 0;
border: 1px solid #FFF;
background: url(../images/editor_bg.gif);
}

#imageadd .imagebox .editorbtn {
padding: 5px 0 10px 0;
}

#imageadd .editorsize {
background: url(../images/editor_size_bg.gif) no-repeat;
height: 32px;
text-align: left;
padding: 0px 0 0 80px;
}

#imageadd .editorsize img {
padding-top: 4px;
}

#imageadd .zoomdown {
width: 73px;
height: 27px;
border: 0;
}

#imageadd .zoomup {
width: 73px;
height: 27px;
border: 0;
}

#imageadd .toolbar {
background: url(../images/editor_tool_bg.gif) repeat-y;
}

#imageadd .previewbox {
text-align: left;
background: #e5e5e5 url(../images/editor_preview_btm.gif) no-repeat center bottom;
width: 120px;
padding-bottom: 26px;
margin: 0 0 0 4px;
}

.ie6 #imageadd .previewbox,
.ie7 #imageadd .previewbox {
margin: 0 0 0 -5px;
}

#imageadd .toolbox {
margin: 0 0 5px 4px;
text-align: left;
}

#imageadd .frametitle {
text-align: left;
}

#imageadd .framebox {
margin: 0;
text-align: left;
}

.frame_icon { width: 128px; border-top: 1px solid #999; height: 25px; background-color: #EDEDED; cursor:pointer; cursor:hand;}
.frame_icon_active { width: 128px; height: 25px; background-color: #999; color: #FFF;}
.frame_icon_active td span { color: #FFF;}

.ie6 .frame_icon,
.ie7 .frame_icon,
.ie6 .frame_icon_active,
.ie7 .frame_icon_active {
margin: 0 0 0 0;
}

#imageadd #add_frame {
background: #999;
width: 128px;
font-size: 11px;
padding-top: 3px;
text-align: center;
}


/*-----Page: Create/Edit widget -----*/

#create h3 {
background: #EDEDED;
padding: 5px 0 5px 20px;
color: #00837A;
margin: 0 0 10px 0;
}

#create h2.h2Image {
background: url(../images/mytop_h2_image.gif) no-repeat;
height: 30px;
line-height: 190%;
}

#create h2.h2Image span {
margin-left: 220px;
color: #FFF;
font-size: 12px;
}

.ie #create h2.h2Image span {
padding-top: 7px;
display: block;
}

#create h2.h2Image span a {
color: #FFF;
font-weight: normal;
}

#create h2.h2Allimage {
background: url(../images/mytop_h2_allimage.gif) no-repeat;
height: 30px;
line-height: 190%;
}

#create h2.h2Allimage span {
margin-left: 220px;
color: #FFF;
font-size: 12px;
}

.ie #create h2.h2Allimage span {
padding-top: 7px;
display: block;
}

#create .myimage {
border: 1px solid #666;
background: #EDEDED;
overflow: auto;
margin: 0 0 20px 0;
}

#create .myimage table {
overflow: auto;
}

#create .myimage .myimageinfo {
background: #FFF;
margin: 0;
padding: 2px 0;
width: 64px;
font-size: 10px;
}

#create .createSample {
background: url(../images/detail_sample_bg.gif);
width: 300px;
height: 300px;
margin-bottom: 5px;
margin: 5px auto;
}

#create .createSample td {
padding: 0;
border-bottom: 0px solid #b2d9d7;
background: none;
}

#create .createSample td span {
font-size: 10px;
color: #666;
}

.ie #create #preview_iframe {
background: #EDEDED;
}


/*-----Page: Help -----*/

#help h2 {
color: #00655E;
font-size: 14px;
background: #DCEEED;
padding: 3px 10px;
margin: 0 0 10px 0;
}

#help ol {
margin: 0;
padding: 0;
}

#help li {
list-style-position: inside;
margin: 0;
padding: 5px 0 0 0px;
}

#help ol.question {
padding: 0 0 10px 0;
}

#help ol.answer li {
border-bottom: 1px dotted #00655E;
padding: 3px 0px 5px 0;
color: #00655E;
font-size: 15px;
margin: 10px 0 0px 0;
}

.answerdetail {
border-bottom: 1px solid #00655E;
margin: 0 0 10px 0;
padding: 10px 0;
}

.helptop {
display: block;
margin: -33px 10px 0 0px;
text-align: right;
}