@charset "UTF-8";


/* ################################################################################################ */
/* ################################################################################################ */
/* ########## 画面の幅 480pxまで ################################################################## */

/* 画面の幅 480px までの指定 */
.body{
display: block;
width:480px;	/* 幅サイズ 480px */
}

/* 背景画像を指定 */
.back_ground_image{
width: 100vw;	/* 幅サイズいっぱいに表示 */

}


/*  Startボタンの設定　*/
.start_btn{
    height: 35px;
    width: auto;
    display: inline-block;
    justify-content: normal;
    align-items: normal;
    cursor: pointer;   
    position: relative;
    bottom: 18vw;
    left: 53vw;
}

/*  facebookの設定　*/
.fb{
    height: 20px;
    width: auto;
    display: inline-block;
    justify-content: normal;
    align-items: normal;
    cursor: pointer;   
    position: relative;
    bottom: 11vw;
    left: 45vw;
}


/*  instagramの設定　*/
.it{
    height: 20px;
    width: auto;
    display: inline-block;
    justify-content: normal;
    align-items: normal;
    cursor: pointer;   
    position: relative;
    bottom: 11vw;
    left: 48vw;
}

/*  questionの設定　*/
.question_image{
width: 100vw;	/* 幅サイズいっぱいに表示 */
background-size: contain;		/*画像を切り取ったり縦横比を崩したりすることなく、画像ができるだけ大きくなるよう拡大縮小します。 */
text-decoration: none;			/*テキストの装飾的な線*/
background-position: center center;	/*背景画像の初期位置*/
background-repeat: no-repeat;		/*背景画像をどのように繰り返すかを設定*/
zoom: 0%; 				/*拡大率を制御*/
}

/*  質問1の内容を表示するボックス設定　*/
div.question_box1{
    width:300px; height:5px;			/*  ボックスのサイズ　*/
    background:rgba(255,0 0,0.5);		/*  ボックスの背景を透明　*/
    text-align:center;				/*  文字を中央配置　*/
    position: relative;
    bottom: 45vw;
    left: 10vw;
    font-style: italic;
    font-variant: normal;
    font-weight: bold;
    font-size: 20px;
    line-height: 10%;
    font-family: "メイリオ",sans-serif;
}

/*  yesボタンの設定　*/
.yes_btn{
    height: 30px;
    width: auto;
    display: inline-block;
    justify-content: normal;
    align-items: normal;
    cursor: pointer;   
    position: relative;
    bottom: 33vw;
    left: 25vw;
}



/*  noボタンの設定　*/
.no_btn{
    height: 30px;
    width: auto;
    display: inline-block;
    justify-content: normal;
    align-items: normal;
    cursor: pointer;   
    position: relative;
    bottom: 33vw;
    left: 40vw;
}

/*  facebookの設定　*/
.fb_q{
    height: 20px;
    width: auto;
    display: inline-block;
    justify-content: normal;
    align-items: normal;
    cursor: pointer;   
    position: relative;
    bottom: 10vw;
    left: 38%;
}


/*  instagramの設定　*/
.it_q{
    height: 20px;
    width: auto;
    display: inline-block;
    justify-content: normal;
    align-items: normal;
    cursor: pointer;   
    position: relative;
    bottom: 10vw;
    left: 41%;
}


/*  facebookの設定　*/
.fb_q2{
    height: 15px;
    width: auto;
    display: inline-block;
    justify-content: normal;
    align-items: normal;
    cursor: pointer;   
    position: relative;
    bottom: 10vw;
    left: 38%;
}


/*  instagramの設定　*/
.it_q2{
    height: 15px;
    width: auto;
    display: inline-block;
    justify-content: normal;
    align-items: normal;
    cursor: pointer;   
    position: relative;
    bottom: 10vw;
    left: 41%;
}

/*  質問2の内容を表示するボックス設定　*/
div.question_box2{
    width:350px; height:5px;			/*  ボックスのサイズ　*/
    background:rgba(255,0 0,0.5);		/*  ボックスの背景を透明　*/
    text-align:center;				/*  文字を中央配置　*/
    position: relative;
    bottom: 45vw;
    left: 2vw;
    font-style: italic;
    font-variant: normal;
    font-weight: bold;
    font-size: 15px;
    line-height: 10%;
    font-family: "メイリオ",sans-serif;
}

/* 結果画面の背景画像を指定 */
.ans_image{
width: 100vw;	/* 幅サイズいっぱいに表示 */
background-size: contain;		/*画像を切り取ったり縦横比を崩したりすることなく、画像ができるだけ大きくなるよう拡大縮小します。 */
text-decoration: none;			/*テキストの装飾的な線*/
background-position: center center;	/*背景画像の初期位置*/
background-repeat: no-repeat;		/*背景画像をどのように繰り返すかを設定*/
zoom: 0%; 				/*拡大率を制御*/
}



/*  aboutボタンの設定　*/
.about{
    height: 15px;
    width: auto;
    display: inline-block;
    justify-content: normal;
    align-items: normal;
    cursor: pointer;   
    position: relative;
    bottom: 21vw;
    left: 13%;
}


/*  GoTopボタンの設定　*/
.GoTop{
    height: 15px;
    width: auto
    display: inline-block;
    justify-content: normal;
    align-items: normal;
    cursor: pointer;   
    position: relative;
    bottom: 21vw;
    left: 18%;
}


/*  結果画面のfacebookの設定　*/
.fb_ans{
    height: 20px;
    width: auto;
    display: inline-block;
    justify-content: normal;
    align-items: normal;
    cursor: pointer;   
    position: relative;
    bottom: 7vw;
    left: 15%;
}


/*  結果画面のinstagram設定　*/
.it_ans{
    height: 20px;
    width: auto;
    display: inline-block;
    justify-content: normal;
    align-items: normal;
    cursor: pointer;   
    position: relative;
    bottom: 7vw;
    left: 18%;
}
}