@charset "utf-8";



/*----------------------------------------
	style
----------------------------------------*/

body{
	background-color:#BAA669;
    background-image:url("../images/img_bg.jpg");
	background-position:center top;
	background-repeat:no-repeat;
    -webkit-text-size-adjust: 100%;
    
}

#mainImg img{width:100%;}
#wrapper{
	max-width:860px;
    min-width:320px;
	margin:0 auto 0;
	}


#content{
	position:relative;
	width:100%;
	max-width:860px;
    border-left:3px solid #DC2009;
    border-right:3px solid #DC2009;
	margin:0;
    margin-left:-3px;
    background:url(../images/shindan/kin_base.jpg) repeat-y;
    -webkit-background-size:contain; /* webkit系 */
    background-size: contain;
}




/*head*/

#head{
    background:#c0320d;
    padding:5px 0;
    text-align:center;
    width:100%;
    display:block;
    position:relative;
    color:#FFF;
}

/*top_sns*/

#top_sns{
    display:block;
    position:absolute;
    top:1%;
    right:1%;
    z-index:999;
}





/*main*/

#main{
    width:100%;
    display:block;
    position:relative;
    margin:0;

}


#main_wrap{
    display:block;
    position:relative;
    width:100%;
    background:url(../images/shindan/main.jpg) no-repeat;
    -webkit-background-size:contain; /* webkit系 */
    background-size:contain;
}


#top_logo{
    width:100%;
    min-height:230px;
    text-align:center;
    display:none;
    position:absolute;
}

#top_logo img{
    width:30%;
}

    
#top_intro{
    width:100%;
    max-height:64px;
    text-align:center;
    display:block;
    position:absolute;
    margin-top:65%;
}

#top_intro img{
    max-width:666px;
    width:95%;
}

#top_start{
    width:100%;
    max-height:64px;
    text-align:center;
    display:block;
    position:absolute;
    margin-top:75%;
}

#top_start img{
    max-width:721px;
    width:95%;
    cursor:pointer;
}

/*release reserve*/

#release{
    width:100%;
    margin-bottom:3%;
}

#jizen{
    display:block;
    width:100%;
}

#twcp_top{
    width:90%;
    margin:0 5% 40px;
}

/*appDl*/

#appDL{
    width:85%;
    max-width:700px;
    margin:2.5% auto 0;
    background:#FFF;
    border:#CF1C00 solid 2px;
    border-radius:10px;
    padding:1% 2% 0 4%;
    display:block;
    text-align:center;
    
}

#appDL .logo{
    width:60%;
    max-width:520px;
    padding-left:2%;
    display:inline-block;
    text-align:center;
}

#appDL .logo img{
    width:48%;
}


#appDL .kouhyo{
    width:35%;
    max-width:280px;
    display:inline-block;
}

#appDL .kouhyo img{
    width:100%;
}


/*question*/

#question{
    display:none;
    position:relative;
    width:100%;
}

#q_logo{
    display:block;
    width:15%;
    left:50%;
    top:6%;
    margin-left:-7.5%;
    z-index:900;
    position:absolute;
}

#q_base{
    width:100%;
    max-width:860px;
    padding-top:13%; 
    position:relative; 
    display:block;
}

#q_base img{
    display:block;
    width:100%;
}

#q_pic{
    position: absolute;
    display: block;
    width: 78%;
    top: 32.5%;
    left: 12%;
    max-height: 280px;
    text-align: center;
}

#q_pic img{
    width:100%;
    margin:0 auto;
    max-width:640px;
    top:0;
	left:0;
}



#qa_wrap{
    width:95%;
    max-width:640px;
    margin:0% auto;
}

.qa_base{
    width:100%;
    text-align:center;
    background:#FFF;
    border:solid 2px #DD390D;
    border-radius:4px;
    margin-bottom:2%;
}

.qa_base img{
    width:95%;
    max-width:620px;
    margin:0 auto;
}



.secNum{
    position:absolute;
    display:block;
    width:30%;
    left:9%;
    top:9%;
}

.secNum img{
    width:100%;
    max-width:280px;
}



/*app link*/

#applink{
    width:80%;
    background:#D1BA5D;
    border:#FFF solid 2px;
    border-radius:10px;
    text-align:center;
    display:block;
    margin:5% auto 0;
    max-width:600px;
    font-size:108%;
    color:#423813;
    padding:2%;
}

#applink p{
    font-size:120%;
    padding:2% 0 0;
}


#applink span{
    color:#423813;
}

.haishintyu img{
    width:30%;
    margin:0 auto;
    min-width:120px;
    max-width:230px;
}

#applink_bnr{
    display:inline-block;
    text-align:center;
    width:65%;
    max-width:560px;
}

#applink_bnr img{
    float:left;
    max-width:280px;
    width:50%;
    margin:0;
    padding:0;
}






/*offical_link*/

#offical_link{
    width:100%;
    text-align:center;
    margin:3% auto;
}

#offical_link img{
    width:80%;
    max-width:600px;
    
}



/*footer*/


#footer{	
	position:relative;
	width:100%;
	color:#300;
	font-size:10px;
	line-height:170%;
	text-align:center;
    background:#FFF;
    max-width:860px;
    padding-bottom:2%;
}

#kt{
    padding-top:2%;
    width:15%;
    margin:0% auto 1%;
    text-align:center;
}

#kt img{
    width:100%;
    max-width:80px;
}

#pic_back{
    background:none;
    width:100%;
}


/*---------------

	診断結果

---------------*/

#ans_pic{
    width:100%;
    background-image:;
    background-repeat:no-repeat;
    -webkit-background-size:100% auto; /* webkit系 */
    background-size:100% auto;
    display:block;
    position:relative;
    margin-bottom:8%;
}


#ans_logo{
    width: 30%;
    max-width: 220px;
    display: none;
    position: absolute;
    top: 15%;
    left:50%;
    margin-left:-15%;
    z-index:900;
}

#ans_logo img{
    width:100%;
}


/*解説ベース*/

#ans_kbase{
    width:87%;
    margin:0 auto;
    padding:67% 0 3%
}

#ans_kbase_top img{
    width:100%;
    max-height:20px;
}

#ans_kbase_mid{
    width:100%;
    max-width:840px;
    background:url(../images/shindan/ans_kbase_mid.jpg) repeat-y;
    -webkit-background-size:100% auto; /* webkit系 */
    background-size:100% auto;
}

#ans_kbase_mid p{
    padding:2% 7%;
    font-size:120%;
    color:#FFF;
}

#ans_kbase_bottom img{
    width:100%;
    max-height:20px;
}


/*shindan tw*/

#shindan_tw{
    width:100%;
    max-width:640px;
    margin:1% auto 2%;
    text-align:center;
}

#shindan_tw img{
    width:95%;
}


/*onemore*/

#onemore{
    width:75%;
    background:#C0320D;
    margin:0 auto 3%;
    max-width:280px;
}

#onemore img{
    margin:1% 5%;
    width:90%;
}

#char_name{
    display:block;
    position:absolute;
    top:4%;
    width:26%;
}

#char_name img{
    width:100%;
}






/*sns_area*/

#sns_area{
    width:100%;
    text-align:center;
    background:#BA2122;
    margin:2% 0 0%;
}

#sns_btn{
    display:inline-block;
}

#sns_area img{
    margin:1% 1% 0;
    max-height:40px;
}



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

body{
    background-image:none;
    background-color:#FFF;
}

#top_sns{
    display:none;
}

#content{
    border-left:none;
    border-right:none;
    margin-left:0;
}


#ans_kbase_mid p{
    font-size: 50%;
    font-size: 1rem;
}

#ans_kbase{
    width:95%;
}

#applink p{
    font-size: 1%;
    font-size: 1rem;
}

#sns_area img{
    margin:2% 2% 0;
    max-height:25px;
}

}


/*other*/


.clear{
    clear:both;
}

.disnone{
	display:none;
}