body {
background: #ffcc00;
}

img {
border: none;
}

input {
border: none;
}

a {
color: #993333;
}

.clearfix:after { content: ""; display: block; clear: both; }

#main {
margin: 0 auto;
width: 900px;
}

#introduction {
background: url(../images/_index_l_bg.gif) no-repeat;
width: 900px;
height: 550px;
}

#trybtn {
position: relative;
top: 100px;
left: 360px;
text-align: center;
width:180px;
height:180px;
}

#trydog {
width: 144px;
height: 284px;
float: right;
potision: relative;
margin: 85px 24px 0 0px;
}

/* フォーム */

.formscreen {
 position:absolute; 
 top: 420px; 
 width: 500px;
height: 460px; 
background: url(../images/_form_bg.gif) no-repeat;
margin: 0 0 0 230px;
 }
 
 .error {
 background: #993333;
 padding: 1px 3px;
color #FFFFFF;
font-size: 10px;
margin-top: -2px;
 }
 
 .sample {
font-size: 10px; 
color: #CCC;
 }

#formtable {
margin: 30px 0 0 40px;
color: #FFF;
font-size: 12px;
width: 430px;
height: 350px;
}

#formtable th,
#formtable td {
text-align: left;
}

.formtext {
height: 14px;
}

#formbutton {
text-align: left;
margin: 15px 0 0 25px;
width: 450px;
}

#formbutton .btn {
background: url(../images/_btn_try.gif) no-repeat;
width: 293px;
height: 42px;
border: none;
margin: 0px 0 0 0;
float: right;
padding-bottom: 1px;
}

.ie7 #formbutton .btn {
margin-top: -45px;
}

#formbutton .btn span {
display: none;
}



/* 結果ページ */
#result {
background: url(../images/_result_l_bg.gif) no-repeat;
width: 900px;
height: 550px;
}

#resultin {
position: relative;
top: 0px;
text-align: center;
}

#progress_bar_container {
 position: absolute; 
 top: 170px; 
 left: 320px;
 width: 290px;
 text-align: center;
 background: #FFF;
 padding: 30px 10px;
 border: 1px dashed #999;
 }

#progress_bar_comment {
font-size: 11px;
color: #cc6600;
padding-bottom: 10px;
}

#resultimg {
margin-left: 35px;
padding-top: 70px;
}

#resultinfo {
position: relative;
margin: -465px 30px 0 0;
float: right;
width: 200px;
border: 2px solid #000;
background: #EDEDED;
font-size: 11px;
padding: 5px 0;
}

#r_name {
font-size: 16px;
font-weight: bold;
background: #333 url(../images/_r_name_bg.gif);
margin: 0 5px 1px 5px;
padding: 5px 0px 5px 0px;
color: #FFF;
}

#r_name span {
font-size: 12px;
}

#r_age {
background: #FFF url(../images/_r_age_bg.gif) no-repeat left 50%;
padding: 0px 20px;
text-align: right;
margin: 0px 5px 5px 5px;
}

#r_age h1 {
text-align: right;
font-size: 35px;
font-weight: bold;
margin: 0;
padding: 0;
color: #660000;
}

#r_age h1 span {
font-size: 12px;
color: #660000;
}

#r_info {
line-height: 150%;
margin-top: 5px;
padding: 0 2px;
}

#resultinfo input {
border: 1px solid #999;
width: 180px;
}

#btn_widget {
position: relative;
width: 850px;
clear: both;
margin: 10px auto 0px auto;
background: #FFF;
text-align: center;
}

#btn_widget #url {
background: #7e6500;
height: 32px;
}

#btn_widget #url img {
margin: 6px 0 0 85px;
width: 266px;
float: left;
}

#btn_widget #url .inputurl {
width:280px;
margin: 7px 5px 0 0;
float: right;
}

#btn_widget #url .inputbtn {
width: 120px;
margin: 6px 80px 0 0;
float: right;
}

#wbtn {
padding: 10px 0 5px 0;
}

#get_widget {
width: 850px;
clear: both;
margin: 0px auto 0px auto;
background: #FFF;
text-align: center;
padding: 20px 0;
}


.code_info {
text-align: left;
font-size: 12px;
padding: 0 0 10px 0;
}

.code_widget {
width:480px;
height:100px;
font-size: 11px;
border: 1px solid #666;
}

.code_policy {
font-size: 10px;
background: #EDEDED;
margin: 5px 0 0 0;
padding: 5px 0 5px 25px;
text-align: left;
color: #636363;
}

#widget_preview {
 width:180px; 
 height: 325px; 
 border: 0px solid #ffffff;
 }

/* エラーページ */
#no_pet {
width: 850px;
text-align: center;
margin: 0 auto;
background: #FFF;
padding: 30px 0;
}


/* Contact & List */
.col {
width: 850px;
text-align: center;
margin: 0 auto;
background: #FFF;
padding: 10px 0px;
}

.colhead {
text-align: left;
padding-left: 20px;
margin: 0;
line-height: 100%;
}

.colbody {
text-align: left;
padding-left: 20px;
font-size: 12px;
}

.colbody p {
padding-left: 5px;
}

#contact .errors {
text-align: center;
margin: 0 auto 10px auto;
color: #CC0000;
width: 650px;
padding: 10px 0 10px 0px;
background: #ffffcc;
}

#contact .errors li {
text-align: left;
margin-left: 40px;
}

#contact table {
background: #EDEDED;
width: 650px;
margin: 0 auto 10px auto;
text-align: left;
border-top: 1px solid #999;
border-left: 1px solid #999;
}

#contact table th {
border-bottom: 1px solid #999;
padding: 5px 0px 5px 20px;
background: #FFF;
}

#contact table td {
border-bottom: 1px solid #999;
border-right: 1px solid #999;
padding: 5px 0px 5px 20px;;
}

#contact table td input,
#contact table td textarea {
border: 1px solid #666;
}

#listin {
margin: 0 0 20px 5px;
}

#listin div {
width: 200px; 
float: left;
padding: 0 0 10px 0;
}

.pagination {
border-top: 10px solid #FFF;
border-bottom: 5px solid #FFF;
text-align: center;
clear: both;
width: 790px;
background: #EDEDED;
margin: 0;
padding: 5px 10px;;
}

.ie .pagination {
border-bottom: none;
}

.pagination span {
padding: 2px 3px;
text-align: center;
background: #FFF;
margin: 1px 0px;
border-bottom: 1px solid #EDEDED;
}

.pagination a {
padding: 2px 3px;
text-align: center;
text-decoration: none;
background: #666;
color: #FFF;
margin: 1px 0px;
border-bottom: 1px solid #EDEDED;
}


/* Copyright */
#copy {
width: 850px;
clear: both;
position: relative;
margin: 3px auto 10px auto;
text-align: center;
}

#count {
background: url(../images/_copy_count.gif) no-repeat;
text-align: right;
width: 340px;
height: 50px;
float: left;
margin-left: -10px;
}

#count div {
text-align: right;
color: #ffffcc;
padding: 13px 35px 0 0;
font-size: 25px;
font-weight: bold;
}

#count div a {
text-decoration: none;
color: #FFFFCC;
}

.mac.gecko #count div {
padding: 10px 35px 0 0;
}

#copyright {
width: 500px;
font-size: 10px;
color: #666;
text-align: right;
float: right;
padding-top: 8px;
}

/* mixi */

.mixiMain {
width: 850px;
text-align: center;
margin: 0 auto;
padding: 0px 0px;
}

.mixiMain div {
text-align: left;
}

.mixiUname {
width: 130px;
overflow: hidden;
font-size: 11px;
}

.mixiButtons {
margin: 20px auto 20px auto;
text-align: center;
}