@charset "Shift_JIS";

/* ########### ALL SET ########### */
a:link { color: #0066ff; }
a:visited { color: #2255cc; }
a:hover { color: #ff0000; }


img { border-width: 0px; }
.center { text-align: center; }
.right { text-align: right; }
.clear {clear: both;}

body {
color: #111;
text-align: center;
background-image: url(./img/til.gif);
padding: 0;
margin: 6px;
}


/* ########### base ########### */
#base {
width: 900px;
text-align: center;
background-color: #fff;
border-style: solid;
border-width: 1px 1px 0px 1px;
border-color: #555;
padding: 10px 0px 0px 0px;
margin: 0px auto;
}

h1 {
width: 900px;
color: #555;
font-size: 11px;
font-weight: normal;
letter-spacing: 2px;
text-align: left;
padding: 6px 0;
margin: 0 auto;
}



/* ########### header ########### */
#header {
margin-bottom: 2px;
}

#title {
width: 880px;
margin: 0 auto 4px;
}

.best-rank {
width: 880px;
font-size: 13px;
padding: 4px 0px;
margin: 0px auto 2px;
}
.best-rank img {
margin: 0px 3px;
}


/* ########### navi ########### */
.navi {
background-image: url(img/navi-bg.gif);
border: 1px solid #999;
margin: 0px 12px 6px 12px;
}
.navi table {
width: 98%;
margin: 0px auto;
}
.navi td {
font-size: 13px;
letter-spacing: 1px;
text-align: center;
padding: 8px 0px;
}
.navi a:link {color: #222;}
.navi a:visited {color: #222;}
.navi a:hover {color: #f00;}


/* パンクズ */
.pan {
font-size: 14px;
text-align: left;
letter-spacing: 1px;
padding: 0px 10px 0px 14px;
}
.pan span {
color: #d40;
font-size: 11px;
font-weight: bold;
margin: 0px 6px;
}
.pan-left {
float: left;
width: 470px;
padding-top: 4px;
}
.pan-right {
float: right;
width: 400px;
text-align: right;
vertical-align: top;
padding-bottom: 6px;
}



/* ########### left ########### */
#left {
float: left;
width: 663px;
}

/* ########### left2（２カラム用） ########### */
#left2 {
float: left;
width: 167px;
}



/* ########### main ########### */

#main {
float: right;
width: 496px;
font-size: 13px;
}
#main h2 {
color: #ffffff;
font-size: 14px;
line-height: 15px;
text-align: left;
letter-spacing: 1px;
background-color: #f54477;
background-image: url(./img/b01.gif);
background-repeat: no-repeat;
padding: 6px 0px 5px 24px;
margin: 0px 8px;
}

.contents-text {
font-size: 14px;
letter-spacing: 1px;
line-height: 22px;
text-align: left;
padding: 10px 12px;
margin-bottom: 2px;
}

.contents-text ul {margin-left: 24px;}
.contents-text li {margin-bottom: 4px;}

.contents-mail table {margin: 0px auto 20px auto;}
.contents-mail td {text-align: left;}
.contents-mail kbd {font-weight: bold;}


.link-table-sub {
color: #440;
font-size: 13px;
text-align: center;
background-color: #eea;
border: 1px solid #bb7;
padding: 5px;
margin: 4px 158px 6px 158px;
}
.link-table-color {
font-size: 14px;
text-align: center;
letter-spacing: 1px;
margin: 0px auto 14px;
}
.link-table-color td {
width: 70px;
font-size: 13px;
text-align: center;
background-color: #fafafa;
border: 1px solid #aaa;
padding: 5px;
}

.link-table-color a:link { color: #333; }
.link-table-color a:visited { color: #333; }
.link-table-color a:hover { color: #f00; }

.link-table-color2 {padding-bottom: 20px;}
.link-table-color2 table {font-size: 13px;}
.link-table-color2 td {text-align: center;}
.link-table-color2 img {margin-bottom: 3px;}


.link-table-img {
font-size: 12px;
text-align: left;
padding: 0px 0px 0px 20px;
}

.link-table-img img {margin-right: 2px;}


/* 素材のタイプを選ぶ部分・一覧 */
.type-table {
font-size: 14px;
line-height: 140%;
text-align: left;
padding: 8px 8px 8px 6px;
margin-bottom: 8px;
}
.type-table table {
width: 100%;
margin-bottom: 3px;
}
.type-table th {
text-align: left;
padding-top: 8px;
padding-bottom: 3px;
}
.type-table td {
vertical-align: top;
padding-left: 10px;
}

.type-table td ul {
list-style-type: square;
padding: 5px;
margin: 0px;
}

.type-table td li {
margin-bottom: 12px;
}

.type-table td a:link {color: #280;}
.type-table td a:visited {color: #060;}
.type-table td a:hover {color: #d0a;}

.top-img {
text-align: center;
padding: 10px 0px 0px 0px;
margin-bottom: 1px;
}
.top-img td img {
margin-bottom: 3px;
}

.top-link-table {
font-size: 13px;
text-align: left;
line-height: 20px;
padding: 0px 5px 2px 5px;
margin: 0px 12px;
}

.top-textarea {
width: 470px;
overflow: auto;
border-style: none;
scrollbar-base-color: #fff;
scrollbar-arrow-color: #aaa;
scrollbar-highlight-color: #ddd;
scrollbar-shadow-color: #bbb;
margin: 0px auto 16px auto;
}
.top-textarea p {
color: #333;
font-size: 13px;
line-height: 22px;
text-align: left;
background-image: url(./img/textarea-bg.gif);
background-repeat: repeat-y;
padding-left: 20px;
margin-left: 5px;
}

.link-table {
font-size: 12px;
text-align: left;
line-height: 19px;
padding: 6px;
margin: 0px 12px 10px 12px;
}

.sozai-about01 {
font-size: 13px;
letter-spacing: 1px;
line-height: 20px;
text-align: left;
background-image: url(./img/about-bg01.gif);
border: 1px solid #888;
padding: 20px 26px;
margin: 0px 14px 10px 14px;
}
.sozai-about01 strong {
display: block;
font-size: 14px;
letter-spacing: 1px;
text-align: left;
margin-bottom: 7px;
}
.sozai-about01 ul {margin-left: 20px;}
.sozai-about01 li {margin-bottom: 5px;}

.sozai-about02 {
font-size: 13px;
letter-spacing: 1px;
line-height: 20px;
text-align: left;
background-image: url(./img/about-bg02.gif);
border: 1px solid #888;
padding: 20px 26px;
margin: 0px 14px 10px 14px;
}
.sozai-about02 strong {
display: block;
font-size: 14px;
letter-spacing: 1px;
text-align: left;
margin-bottom: 7px;
}
.sozai-about02 ul {margin-left: 20px;}
.sozai-about02 li {margin-bottom: 5px;}

.sozai-about03 {
font-size: 13px;
letter-spacing: 1px;
line-height: 20px;
text-align: left;
background-image: url(./img/about-bg03.gif);
border: 1px solid #888;
padding: 20px 26px;
margin: 0px 14px 10px 14px;
}
.sozai-about03 strong {
display: block;
font-size: 14px;
letter-spacing: 1px;
text-align: left;
margin-bottom: 7px;
}
.sozai-about03 ul {margin-left: 20px;}
.sozai-about03 li {margin-bottom: 5px;}



/* リニューアル前用 */
#sozai-sapo {
font-size: 16px;
text-align: left;
padding: 10px 0px;
}
#sozai-sapo table {
margin: 0 auto;
}
#sozai-sapo table table {
margin: 0;
}

.mokuji {
text-align: right;
padding-right: 40px;
}



/* フレーム紹介ページ用 */
.frame-text1 {
background-color: #ddd;
font-size: 13px;
line-height: 140%;
border: solid 1px #aaa;
padding: 10px;
margin:8px 0px 6px 0px;
}
.frame-text2 {padding:4px;font:13px/130%;margin:8px 0px 6px 0px;text-align:center;}
.frame-table {font-size: 13px;}







/* ########### menu ########### */
#menu {
float: left;
width: 167px;
text-align: left;
padding-bottom: 10px;
}

#menu a { text-decoration: none; }
#menu a:link { color: #000; }
#menu a:visited { color: #000; }
#menu a:hover { color: #f00; }

.s1 { letter-spacing: 1px }
.s2 { letter-spacing: 2px }
.s3 { letter-spacing: 3px }
.s4 { letter-spacing: 4px }
.s5 { letter-spacing: 5px }
.s6 { letter-spacing: 6px }

div.list-sub {
color: #ffffff;
font-size: 14px;
font-weight: bold;
line-height: 13px;
letter-spacing: 2px;
text-align: center;
background-color: #f54477;
background-image: url(./img/a01.gif);
background-repeat: no-repeat;
padding-top: 7px;
padding-bottom: 6px;
margin: 0px 0px 0px 10px;
}
div.list-home {
text-align: center;
padding-top: 5px;
margin: 0px 0px 0px 14px;
}

#menu ul {
list-style-type: none;
font-size: 13px;
line-height: 13px;
background-image: url(./img/menu01.gif);
padding: 0px;
margin: 0px 0px 8px 10px;
}
#menu li {

}
#menu li a {
display: block;
text-align: left;
padding: 7px 5px 7px 30px;
margin: 0px;
}

#menu dl {
font-size: 13px;
padding: 4px 0px 0px 0px;
margin: 0px 3px 12px 13px;
}
#menu dt {
font-weight: bold;
border-bottom: 1px solid #666;
padding: 8px 0px 5px 2px;
margin-bottom: 6px;
}
#menu dd {
color: #d00;
background-image: url(./img/menu-list-arr.gif);
background-repeat: no-repeat;
padding: 4px 0px 4px 24px;
margin: 0px;
}

#menu dd a:link { color: #393; text-decoration: none;}
#menu dd a:visited { color: #272; text-decoration: none;}
#menu dd a:hover { color: #e0a; text-decoration: underline;}


div.left-sp {
background-color: #fafafa;
border: solid 1px #999999;
padding: 7px;
margin: 0px 0px 8px 10px;
}







/* ########### right ########### */
#right {
float: left;
width: 227px;
font-size: 13px;
text-align: left;
}

#right h2 {
color: #ffffff;
font-size: 14px;
line-height: 15px;
text-align: center;
letter-spacing: 1px;
background-color: #44cc00;
background-image: url(./img/c01.gif);
background-repeat: no-repeat;
padding: 6px 0px 5px 0px;
margin: 0;
}


#right ul {
list-style-type: none;
font-size: 13px;
line-height: 13px;
background-image: url(./img/menu03.gif);
padding: 0;
margin: 0px 0px 8px 0px;
}
#right li {
display: inline;
vertical-align: middle;
}
#right li a {
display: block;
text-align: left;
text-decoration: none;
padding: 7px 5px 7px 30px;
margin: 0px;
}
#right a:link { color: #000; }
#right a:visited { color: #000; }
#right a:hover { color: #f00; }


.tag-list {
line-height: 19px;
text-align: left;
padding: 10px 0px;
margin: 0px 0px 10px 10px;
}
.tag-list strong {
display: block;
letter-spacing: 1px;
margin-bottom: 6px;
}

.tag-list a:link { color: #333; text-decoration: none;}
.tag-list a:visited { color: #333; text-decoration: none;}
.tag-list a:hover { color: #f00; text-decoration: underline;}



/* 作成の流れ */
.nagare {
margin-bottom: 8px;
}
.nagare a:hover { background-color: #ffa; }



/* 自動作成 */
.test_page {
padding: 10px;
margin-bottom: 16px;
}

.test_page p {
text-align: center;
padding: 20px;
}

.test_page th {
text-align: center;
}

.test_page select {
width: 75px;
}



/* ########### right2（２カラム用） ########### */
#right2 {
float: right;
width: 724px;
text-align: left;
font-size: 13px;
}
#right2 h2 {
color: #ffffff;
font-size: 14px;
line-height: 15px;
text-align: left;
letter-spacing: 1px;
background-color: #44cc00;
background-image: url(./img/b02.gif);
background-repeat: no-repeat;
padding: 6px 0px 5px 24px;
margin: 0px 9px 0px 0px;
}

.contents-left {
float: left;
width: 404px;
font-size: 14px;
letter-spacing: 1px;
line-height: 21px;
text-align: left;
margin-bottom: 12px;
}

.contents-right {
float: right;
width: 160px;
text-align: right;
margin-bottom: 12px;
}

.links-table {
text-align: left;
padding: 4px 8px;
margin-bottom: 4px;
}
.links-table td {text-align: left;}
.links-table p {
padding: 5px 10px;
}

div.sample {
text-align: left;
padding: 26px;
margin: 0 auto;
}
div.sample div {margin: 0 auto;}
div.sample table {margin: 0 auto;}


/* ■タグ説明・効果 */
.tag-table {
padding: 12px 18px 2px 8px;
}
.tag-table a:link { color: #333; }
.tag-table a:visited { color: #333; }
.tag-table a:hover { color: #f00; }

.tag-main {
width: 100%;
font-size: 14px;
line-height: 22px;
background-color: #888;
margin-bottom: 14px;
}
.tag-main td {padding: 12px;}
.tag-main td td {padding: 2px;}

.h th {
text-align: center;
background-color: #fe6;
padding: 10px;
}
.h td {background-color: #fed;}
.e td {background-color: #fafafa;}
.kekka {background-color: #fff;}
.d td {background-color: #fffcf0;}
.f td {background-color: #f5f5ff;}
.g {padding: 22px;}



.tag-h3 {
font-size: 15px;
font-weight: bold;
border-bottom: 3px double #888;
padding: 10px 4px 5px 4px;
margin: 0 0 12px 0;
}

.tag-table li {margin-bottom: 6px;}

.tag-table table p{
padding: 0;
margin: 0 0 12px 0;
}

.tag-com {font-size: 13px;}
.red {color: #e00;}





/* ■タグ・CSSテストフォーム */
.form-test {padding: 0px 0px 18px 0px;}
.form-test table {
font-size: 13px;
letter-spacing: 1px;
}
.form-test th {
text-align: center;
background-color: #e5e5e5;
background-image: url(./img/about-bg01.gif);
border: 1px solid #aaa;
padding: 6px;
}
.form-test td {padding: 2px;}
.form-test strong {
display: block;
text-align: left;
margin-bottom: 6px
}
.form-test textarea {padding: 8px;}
.form-test input {padding: 4px 8px;}
.form-test-width {
width: 674px;
height: 250px;
}

/* ■外部サイトリンク集 */
.site-links {
padding: 8px 10px;
margin-bottom: 5px;
}
.site-links table {
font-size: 13px;
margin: 0 auto;
}


/* ■用語集 */
.yougo {
font-size: 15px;
line-height: 34px;
letter-spacing: 1px;
padding: 10px;
}

.yougo table {margin: 0px auto;}
.yougo td {padding: 24px;}

.yougo a:link {color: #000;}
.yougo a:visited {color: #000;}
.yougo a:hover {color: #f00;}




/* ■ブックマーク */
.bookmark {
font-size: 12px;
}
.bookmark table td img {
vertical-align: middle;
margin-right: 4px;
margin-bottom: 4px;
}





/* ########### ranking ########### */
#ranking {
text-align: center;
padding: 0px 10px 10px 10px;
}




/* ########### sozai ########### */
#sozai {
clear: both;
width: 900px;
text-align: center;
background-color: #ffffff;
border-style: solid;
border-width: 0px 1px 1px 1px;
border-color: #555;
padding: 0px 0px 10px 0px;
margin: 0px auto;
}
#sozai table {
text-align: left;
margin: 0px auto;
}

.html {
font-size: 13px;
text-align: left;
margin-bottom: 7px;
}

#sozai h2 {
color: #ffffff;
font-size: 14px;
line-height: 15px;
text-align: left;
letter-spacing: 1px;
background-color: #44cc00;
background-image: url(./img/b03.gif);
background-repeat: no-repeat;
padding: 6px 0px 5px 24px;
margin: 0px 10px 0px 10px;
}

#sozai h3 {
color: #c00;
font-size: 18px;
letter-spacing: 1px;
}

#sozai h4 {
color: #555;
font-size: 14px;
font-weight: normal;
letter-spacing: 2px;
}

.sozai-top-pan {
font-size: 14px;
letter-spacing: 2px;
padding: 6px 16px;
margin-bottom: 16px;
}


#sozai-tag {
font-size: 16px;
margin: 6px auto;
}
#sozai-tag td {
vertical-align: top;
}

#sozai-html {
margin: 0px auto 18px auto;
}
#sozai-html td {
font-size: 14px;
text-align: left;
vertical-align: top;
}
#sozai-html img {
vertical-align: middle;
margin-right: 5px;
margin-bottom: 10px;
}


#sozai textarea {
font-size: 13px;
}

/* ■素材の説明用メニュー */
.sozai_guide {
margin: 0px auto;
}

.sozai_guide td {
width: 130px;
font-size: 14px;
font-weight: bold;
text-align: center;
letter-spacing: 1px;
border: 1px solid #676;
background-color: #ffffe3;
}
.sozai_guide a:link { color: #280; }
.sozai_guide a:visited { color: #280; }
.sozai_guide a:hover { color: #f00; }


/* ■素材コピーフォーム */
.copy {
font-size: 13px;
background-color: #eee;
padding: 2px;
margin: 8px 2px 2px 2px;
}



/* ■次のページ 前のページ */
.next_page {
padding: 14px 10px 14px 2px;
}
.next_page table {
font-size: 14px;
}
.next_page th {
width: 76px;
text-align: center;
font-weight: normal;
}
.next_page td {
width: 310px;
}
.next_page span {
color: #d40;
font-size: 12px;
font-weight: bold;
margin: 0px 4px;
}

.next_page a:link { color: #333; }
.next_page a:visited { color: #333; }
.next_page a:hover { color: #f00; }


/* ■素材タイプを選ぶ */
.sozai-type {
font-size: 13px;
text-align: left;
letter-spacing: 1px;
word-spacing: 6px;
padding: 16px 22px;
}


/* ■カラーの種類＆一覧部分 */
.parts-color table {
font-size: 14px;
margin: 0 auto;
}
.parts-color td {
padding: 5px;
}


.group-color {
padding-bottom: 10px;
}
.group-color table {
font-size: 10px;
margin: 0 auto;
}
.group-color td {
text-align: center;
padding: 16px 2px;
}
.group-color td img {
margin-bottom: 5px;
}


/* ■よく使うHTMLとCSS */

.html-css {
margin: 0 64px;
}

.html-css h3 {
font-size: 15px;
text-align: center;
background-color: #fd2;
border: double 3px #444;
padding: 8px;
}

.html-css table {
width: 100%;
border: double 3px #888;
margin: 0 auto;
}
.html-css td {
font-size: 14px;
line-height: 22px;
vertical-align: top;
padding: 14px;
}
.html-css ul {
padding: 0 0 0 20px;
margin: 0;
}


/* ■素材ページの下、エントリー一覧 */
.mtentry-link {
font-size: 10px;
line-height: 22px;
padding: 10px 30px;
margin-bottom: 6px;
}

/* ■商取引法 */

.torihiki {
padding: 20px 0px 10px 16px;
}
.torihiki table {
width: 680px;
background-color: #aaa;
line-height: 22px;
}
.torihiki th {
background-color: #feb;
}
.torihiki td {
background-color: #fff;
}


/* ########### 検索フォーム ########### */
.search-top {
font-size: 13px;
font-weight: normal;
letter-spacing: 1px;
text-align: center;
padding: 2px 8px 6px 8px;
}

.search-top input,form {
display: inline;
padding: 0;
margin: 0;
}


.search-top-width {
width: 280px;
vertical-align: middle;
}

.search-top-width2 {
width: 460px;
vertical-align: middle;
}

.search-submit-width {
width: 44px;
text-align: center;
vertical-align: middle;
}

.search-long {
text-align: center;
vertical-align: middle;
padding-top: 0px;
margin: 0px 0px 8px 0px;
}
.search-long p {
color: #120;
text-align: center;
letter-spacing: 1px;
background-color: #efc;
border: 1px solid #9b6;
padding: 5px 5px;
margin: 0px 16px 10px 16px;
}

.search-long-width {
width: 400px;
vertical-align: middle;
}

.search-bottom {
padding: 14px;
}



/* ########### sp ########### */
.sp-main {
text-align: left;
padding: 5px;
margin: 0px 12px 12px 12px;
}

.sp-big_banner-yoko {
padding-top: 4px;
margin-bottom: 0px auto 12px auto;
}

.sp-middle_banner-yoko {
padding: 16px;
margin: 0px auto 14px auto;
}

.sp-big_banner-tate {
text-align: center;
padding: 36px 0px;
margin-bottom: 6px;
}

.sp-afi {
text-align: center;
padding: 10px 0px 0px 0px;
margin: 0px auto 0px auto;
}
.sp-afi td {
vertical-align: top;
padding-bottom: 5px;
}
.sp-afi p {
color: #540;
letter-spacing: 1px;
text-align: center;
background-color: #fffaaa;
border: 1px solid #b96;
padding: 5px;
margin: 0px 4px 6px 4px;
}
.sp-afi-link {
text-align: left;
line-height: 19px;
}
.sp-afi-link span {
color: #f00;
font-size: 11px;
font-weight: bold;
}

.sp-afi a:link { color: #333; }
.sp-afi a:visited { color: #333; }
.sp-afi a:hover { color: #ff0000; }

.sp-250_250 {
margin: 0px auto 20px auto;
}

.sp-250_250_waku {
width: 698px;
border: 1px solid #888;
margin: 0px 0px 0px 8px;
}
.sp-250_250_waku td {
padding: 14px;
}

.sp-160-600 {
padding-top: 30px;
margin-left: 10px;
margin-bottom: 6px;
}

.sp-120-600 {
text-align: center;
background-color: #fafafa;
border: solid 1px #aaa;
padding-top: 10px;
margin-left: 10px;
}



/* ■リンク型ユニット */
.sp-sozai-link01 {
text-align: center;
border: 2px dotted #aaa;
background-color: #fcfcfc;
padding: 16px;
margin: 0px 64px 10px 64px;
}
.sp-sozai-link01 p {padding: 2px; margin: 0;}

.sp-sozai-link02 {
text-align: center;
background-color: #fff;
padding: 14px;
margin: 0px 24px 40px 24px;
}
.sp-sozai-link02 p {padding: 4px;}


/* ■アフィリ広告サンプル */
.sp-sample {
width: 196px;
border: 1px solid #aaa;
margin: 12px auto;
}
.sp-sample img {
margin-bottom: 5px;
}
.sp-sample td {text-align: center;}
.sp-sample th {font-size: 14px;letter-spacing: 1px;}



/* ■下メニュー */
.bottom-menu {
color: #aaa;
font-size: 14px;
letter-spacing: 2px;
line-height: 26px;
text-align: left;
padding: 4px 3px;
margin: 0px 10px 16px 40px;
}

.bottom-menu a:link { color: #333; margin: 0px 6px; }
.bottom-menu a:visited { color: #333; margin: 0px 6px; }
.bottom-menu a:hover { color: #f00; margin: 0px 6px; }







/* ########### fotter ########### */

#footer {
background-color: #ffffff;
padding-top: 2px;
margin: 0px auto;
}

#copy {
color: #222222;
text-align: left;
background-color: #ffffff;
padding: 0px 13px 9px 13px;
margin: 0px auto;
}

#base-bottom {
width: 900px;
text-align: right;
padding: 12px 0;
margin: 0px auto 24px auto;
}