/* ===================================================================
CSS information
 file name  :  style.css
 style info :  All Page Desining
=================================================================== */
@charset "UTF-8";

body{
background: #455ebc;
height: auto!important;
}

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

br {
letter-spacing: normal; /*  IE6・7 */
}

body, textarea {
font-family: 'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'Meiryo', 'sans-serif';
font-size: 100%;
line-height: 100%;
min-width: 980px;
width: 100%;
}


#main_visual h1{
background: url('../img/main_bg.jpg') no-repeat;
background-position: center top;
height: 458px;

}


/* タロットコンテンツ*/

#buckground0{
  background: url(../img/card_top_bg.jpg);
  background-repeat: no-repeat;
  background-position: center;
  height: 411px;
}




#talot{
  width: 980px;
  margin: 0 auto;
}

#talot .center {
  width: 716px;
  height: 353px;
  margin: 0 auto;
}

#talot .under {
  width: 700px;
  margin: 0 auto;
}

#talot .under img{
  margin: 0 auto;

}


#talot .under ul{
  margin: 0 auto;
}

#talot .under li{
  list-style-position: outside;
  list-style-type: none;
  margin-left: 30px;
  width: 100px;
  height: 190px;
  float: left;
  display: block;
}

.card{
  margin: 0 auto;
  width: 100%;
  padding-top: 10px;
  margin-left: 0px;
}

#talot .clear{
  clear: both;
}



/*--------
nav
--------*/

#followupWrap{
margin: 0 0 0 0;
position: fixed;
z-index: 10100;
top: 0px;
left: auto;
right: 20px;
}

#followupbt{
width: 200px;
height: 350px;
background: url("../img/followup_bk.png") no-repeat top left;
position: relative;
}

.foll{
    position: absolute;
    top: 90px;
    line-height: 2.5em;
    left: 27px;

}


/*---------------------------------------------------------------------
  main_culumn
---------------------------------------------------------------------*/


#contents {
  background: url(../img/contents_bg.jpg) no-repeat fixed;
  background-size: cover;
  min-width:980px;
  margin: 0 auto;

}

/*====== box01 ======*/
#box01 {
  text-align: center;
}


/*====== box02 ======*/


#box02 .title_02 {
  text-align: center;
}

#box02 .kanteisi{
    width: 980px;
    margin: 0 auto;
    height: 550px;
}

#box02 .kanteisi1{
    float: left;
    position: relative;
    width: 490px
    height:550px;

}
#box02 .kanteisi2{
    float: right;
    position: relative;
    width: 490px
    height:550px;
}

#box02 .soudan_btn{
    position: absolute;
    bottom: 60px;
    left: 65px;
}



/*====== box03 ======*/


#box03 .title_03 {
  text-align: center;
}

.taikendan1 {
    width: 980px;
    margin: 0 auto;
    height: 250px;
    margin-top: 50px;
}

.taikendan1 img{
  float: left;
}
.taikendan1 p{
    display: block;
    line-height: 1.6em;
    font-size: 17px;
    color: #fff;
}

.taikendan2 {
    width: 980px;
    margin: 0 auto;
    height: 250px;
    margin-top: 50px;
}

.taikendan2 img{
  float: right;
}
.taikendan2 p{
    display: block;
    padding-top: 30px;
    line-height: 1.6em;
    font-size: 17px;
    color: #fff;
    text-align: right;
}


.taikendan3 {
    width: 980px;
    margin: 0 auto;
    height: 250px;
    margin-top: 50px; 
    margin-bottom: 50px;
}

.taikendan3 img{
  float: left;
}
.taikendan3 p{
    display: block;
    padding-top: 30px;
    line-height: 1.6em;
    font-size: 17px;
    color: #fff;
}


/*====== box04 ======*/


#box04 .title_04 {
  text-align: center;
  margin-top: 30px;
}

#box04 .step {
  text-align: center;
}

#box04 .box04_txt {
  text-align: center;
}


/*====== footer ======*/
#f_area {

  text-align: center;
  height: 246px;
  color: #c1c1ff;
}

p.f_link {
font-size: 15px;
padding-top: 50px;
}
p.f_link a:link {
padding-top:30px;
font-size: 13px;
color: #c1c1ff;
text-decoration: none;
}
p.f_link a:hover, a:active, a:visited {
color: #c1c1ff;
text-decoration: underline;
}

#footer{
padding-top: 30px;
font-size: 13px;
color:#c1c1ff;
}

/*---------------------------------------------------------------------
  other
----------------------------------------------------------------
/*====== banner ======*/
#banner{
text-align: center; /* ie7*/
}

#banner2{
margin:0 auto;
padding-top: 35px;
text-align: center; /* ie7*/
}




/*--------
form.second
--------*/

#box06 {
display: table;
height: auto;
*height: auto !important;/*for IE7*/
width: 100%;
min-width: 980px;
position: relative;
}

#wrap {
text-align: center;
}

#wrap .form_top{
  padding-top: 30px;
}


#wrap p.form_txt {
  font-size: 18px;
  color: rgb(62, 62, 62);
  line-height: 1.5em;
}

#box06 #p_center, #p_center {
background: url('../img/form_center.png') repeat-y;
background-position: center top;
max-width: 980px;
width: 100%;
margin: 0 auto;
padding: 0 0 15px 0;
}

.form_bottom {
vertical-align: top;
}

#box06 h1 {
width: 980px;
margin: 0 auto;
}

#box06 table {
margin: 0px auto 30px;
}

#box06 table th {
padding: 35px 0 0 0;
text-align: center;
vertical-align: middle;
}

#box06 table input[type="text"] {
height: 30px;
vertical-align: middle;
}

#box06 table td {
padding: 40px 0 0 30px;
width: 424px;
color: rgb(62, 62, 62);
vertical-align: middle;
}

#box06 select {
vertical-align: middle;
}

p.domain_txt {
font-size: 14px;
line-height:1.4em;
color: rgb(20, 29, 74);
padding-top: 20px;
}

p.d_link {
padding-top: 50px;
}


/*--------
second text
--------*/

#s_txt {
width: 630px;
font-size: 14px;
text-align: left;
line-height: 1.4em;
margin: 0 auto;
color: rgb(20, 29, 74);
font-family: 'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'Meiryo', 'sans-serif';
letter-spacing: 1px;
padding-bottom: 20px;
}

#s_txt h3 {
padding:20px 0 0 1px;
font-size: 15px;
margin:0;
color:#d8007f;
font-family: 'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'Meiryo', 'sans-serif';
border-bottom: 1px dotted #d8007f;
}

#s_txt p, #s_txt ul, #s_txt ol {
padding-top: 15px;
}

#s_txt p, #s_txt ul{
padding-left: 20px;
}

#s_txt ul {
list-style:none;
}

#s_txt ol {
padding-left: 30px;
}

#s_txt a:link {
font-size: 13px;
line-height: 1.2em;
color: #0032a3;
text-decoration:none;
}

#s_txt a:visited {
font-size: 13px;
line-height: 1.2em;
color: #0032a3;
text-decoration:none;
}

#s_txt a:hover {
font-size: 13px;
line-height: 1.2em;
color: #A119CB;
text-decoration:none;
}

#s_txt a:active {
font-size: 13px;
line-height: 1.2em;
color: #A119CB;
text-decoration:none;
}

.mark_clr {
color:#d8007f;
}


/*--------
form input
--------*/

div.radio-group {
margin-top: 5px;
}

div.radio-group input {
  opacity: 0;
    /*
  opacity: 0;
     filter: alpha(opacity=0);
  */
}

div.radio-group div {
  position: relative;
}

div.radio-group input {
  position: absolute;
  left: 0px;
  outline:none;
}

div.radio-group label {
cursor: pointer;
padding: 8px 0px 0px 0px;
float: left;
background: url('../img/index1_off.png') no-repeat;
width:210px;
height:40px;
color:#ffffff;
font-family: "Big Caslon", "Book Antiqua", "Palatino Linotype", Georgia, serif;
font-size: 18px;
text-shadow: 2px 2px 0px #2f197e;
line-height: 1.6;
text-align:center;
vertical-align:middle;
}

div.radio-group label.checked  {
background: url('../img/index1_on.png') no-repeat;
width:210px;
height:40px;
}

div#blood div.radio-group label {
cursor: pointer;
padding: 8px 0px 0px 0px;
float: left;
background: url('../img/index2_off.png') no-repeat;
width:105px;
height:40px;
color:#ffffff;
font-family: "Big Caslon", "Book Antiqua", "Palatino Linotype", Georgia, serif;
font-size: 18px;
text-shadow: 2px 2px 0px #2f197e;
line-height: 1.8;
text-align:center;
vertical-align:middle;
}

div#blood div.radio-group label.checked  {
background: url('../img/index2_on.png') no-repeat;
width:105px;
height:40px;
}

input[type="text"]:focus {
outline: 0;
border-color:#ffd800;
}