@media screen and (min-width:480px) {
	body{
		/*  フォントの種類  */
		font-family:"メイリオ", "Meiryo",-apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", sans-serif;

		/*  フォントのサイズ  */
		/*font-size: 16px;*/

		/*  フォントの色  */
		/*font-size: #333;*/

		/* カーニングの設定 */
		letter-spacing: 0.2px;

		/* 行間の設定 */
		/*line-height: 1.75;*/

		/* 表示幅の設定 */
		width:1024px;

		/* 中央に表示 */
		margin-right:auto;
		margin-left:auto;

		/* 背景色 */
		background-color:rgba(255,255,255,0);
	}

	header, nav, article, aside, section, footer {
		display:block;/*←新要素はデフォルトではinline要素なのでこの指定が必要。*/
	} 
	header, nav, article, aside, section, footer {
		/*border:1px solid #ccc;*/ /*←各ブロックに枠線をつけてわかりやすくしました。*/
		/*margin:0px 0px 5px;*/
	}

	#logo_area{
		max-width: 100%;
		margin: 0 auto;
		text-align:center;
	}

	section {
		/*background-color:rgba(250,244,253,1);*/
		padding:1px,0px;
	}

	#form_Main {
	overflow: hidden;/*そらの描画を枠内にするため記述*/
	height: 560px;/*そらの描画を枠内にするため記述*/
	}

	#section_area {
		/*FAQエリア背景色*/
		background-image: url(../img/backimage.png);
		background-size: cover;
		background-color:rgba(208,244,255,1);/*水色*/
		position:relative;
		z-index: 10;
	}

	#section_area2 {
		padding:1px,0px;
		position:relative;
		z-index: 20;
	}

	footer {
		position:relative;
		z-index: 30;
	}

	/*フッター 商標部分*/
	footer p {
		margin:-0.2em 1em;
		font-size: 8pt;/*フォントのサイズ*/
		color:#808080;/*濃いグレー*/
	}

	#main_area{
		text-align:center;
		font-size: 24pt;
		font-family:Meiryo;
	}

	#title_logo{
		text-align:center;
		font-size: 18pt;
		color:rgba(58,32,75,1);/*濃い紫色*/
		background-color:rgba(182,155,211,1);/*紫色*/
	}

	.title_logo{
		height:18px;/*タイトルロゴの高さ固定*/
		margin-top: 2px;
		margin-bottom: 3px;
	}

	#base-frame{
		height:470px;
		/*スクロールバーはY軸のみ表示固定*/
		overflow:hidden;
		overflow-y:scroll;
	}

	#faq_area{
		max-width:98%;
		min-width:300px;
		height:100%;/*JSからFAQエリアを拡張するため100％とする*/
		margin:10px auto;
		float:left;
	}

	#question_area{
		max-width:100%;
		min-width:150px;
		background-size: 100%
		margin:0 auto;
		/*質問エリア背景色*/
		background-color:rgba(0,177,234,0.24);/*水色*/
	}

	li a b {
		color: red;
	}

	li {
		border-bottom: thin solid #e0e0e0;
	}

	#queiton_table,th,td {
		width:100%;
	}

	.question1 {
		/*width:80%;*/
		width:70%;
	}

	.question3 {
		width:10%;
		padding-right: 7px;
	}

	#voice_btn{
		vertical-align: middle;
		background-color: rgba(240,220,253,1);/*薄い紫色*/
		color: rgb(35, 152, 235);/*青*/
		height: 33px;
		font-size: 12pt;
		text-decoration: none;
		text-align: center;
		vertical-align: middle;
		cursor: pointer;
		border-radius: 15px;
		border-bottom: solid 2px #627295;
		transition: all .3s;
	}

	#voice_btn:hover {
		background-color: #FFF;
		border-color: rgb(35,152,235);/*青色*/
		color: rgb(35,152,235);/*青色*/
		border-bottom: solid 2px #627295;
	}

	#queiton_text {
		width:80%;
		font-size:15pt;
		vertical-align: middle;
	}

	#question_btn {
		width:100%;
		font-size: 15pt;
		text-decoration: none;
		background: rgb(35, 152, 235);/*青色*/
		color: #FFF;
		border-bottom: solid 4px #627295;
		cursor: pointer;
		border-radius: 5px;
		transition: all .3s;
		margin-left: -5px;
	}

	#question_btn:hover {
		background-color: #fff;
		border-color: rgb(35, 152, 235);/*青色*/
		color: rgb(35, 152, 235);/*青色*/
		border-bottom: solid 4px #627295;
	}

	#question_clr {
		width:100%;
		font-size: 15pt;
		text-decoration: none;
		background: rgb(35, 152, 235);/*青色*/
		color: #FFF;
		border-bottom: solid 4px #627295;
		cursor: pointer;
		border-radius: 5px;
		transition: all .3s;
		margin-left: -5px;
	}

	#question_clr:hover {
		background-color: #fff;
		border-color: rgb(35, 152, 235);/*青色*/
		color: rgb(35, 152, 235);/*青色*/
		border-bottom: solid 4px #627295;
	}

	div.eval_comp{
		border: 1px solid rgba(255,187,211,1);
		/*border: 1px solid rgba(35,186,235,1);*/
		background-color: #fff;
		color: rgba(255,102,153,1);
		/*color:black;*/
		border-radius: 10px;
		text-align: left;
		padding: 1px 10px;
		margin-bottom: 5px;
		opacity: 1;
		transition: .3s;
	}

}

/*******************/
/*     iphone用    */
/*******************/

@media screen and (max-width:480px) {
	body{
		/*  フォントの種類  */
		font-family:"メイリオ", "Meiryo",-apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", sans-serif;

		/*  フォントのサイズ  */
		font-size: 10pt;

		/*  フォントの色  */
		/* //font-size: #333;/

		/* カーニングの設定 */
		letter-spacing: 0.2px;

		/* 行間の設定 */
		/* //line-height: 1.75;*/

		margin:0;
	}

	header, nav, article, aside, section, footer {
		display:block;/*←新要素はデフォルトではinline要素なのでこの指定が必要。*/
	} 
	header, nav, article, aside, section, footer {
		/*border:1px solid #ccc;*/ /*←各ブロックに枠線をつけてわかりやすくしました。*/
		/*margin:0px 0px 5px;*/
		padding:2px;
	}

	#section_area {
		/*FAQエリア背景色*/
		background-image: url(../img/backimage_m.png);
		background-size: cover;
	}

	#section_area2 {
		/*質問エリア背景色*/
		/*background-color:rgba(208,230,164,1);*//*濃い緑*/
	}

	footer {
	}

	footer p {
		margin:-0.2em 1em;
		font-size:6pt; /*  フォントのサイズ  */
		color:#808080;
	}

	#logo_area{
		max-width: 100%;
		margin: 0 auto;
		text-align:center;
	}

	.title_logo{
		width: auto; /*タイトルロゴ固定*/
		height:20px; /*タイトルロゴ固定*/
	}

	#main_area{
		text-align:center;
		font-size: 24pt;
		color:rgba(58,32,75,1);
		font-family:Meiryo;
	}

	#title_area{
		text-align:center;
		font-size: 12pt;
		color:rgba(58,32,75,1);
		background-color:rgba(182,155,211,1);
	}

	#base-frame{
		height:70vh;
		overflow:auto;
		/* padding-topを設定しないと吹き出しの上部が*/
		/* 2pxくらい欠けてしまう*/
		padding-top: 10px;
		padding-left: 20px;
	}

	#faq_area{
		min-width:320px;
		max-width:100%;
		height:100%;/*JSからFAQエリアを拡張するため100％とする*/
	}

	#voice_ico{
		zoom: 0.7;
	}

	#question_area{
		max-width:100%;
		min-width:80px;
		margin:0 auto;
		/*質問エリア背景色*/
		background-color:rgba(0,177,234,0.24);/*水色*/
	}

	#queiton_table,th,td {
		width:100%;
	}

	.question1 {
		width:80%;
	}

	.question3 {
		width:10%;
	}

	 #voice_btn {
		/*　縦中央揃え　*/
		vertical-align: middle;
		/*width: 20%;*/
		border: 1px solid #000;
		background-color: rgba(240,220,253,1);/*薄い紫*/
		margin-left: 0px;
		height: 20px;
		/*color: rgba(85, 85, 85, 1);*//*濃いグレー*/
		color: rgb(35, 152, 235);/*青*/
		font-size: 8pt;
		border: solid 1px rgb(221, 164, 236);/*濃い色*/
		text-decoration: none;
		text-align: center;
		vertical-align: middle;
		-webkit-appearance: none;/*iPhoneの丸角グラデ防止*/
		border-radius: 15px;
		font-weight: bold;/*太字*/
	}

	#queiton_text {
		width:65%;
		font-size: 8pt;
		margin-left: -5px;
		-webkit-appearance: none;/*iPhoneの丸角グラデ防止*/
	}

	#question_btn {
		width:100%;
		font-size: 9pt;
		text-decoration: none;
		background: rgb(35, 152, 235);/*青色*/
		color: #FFF;/*白色*/
		border: solid 0px #627295;
		margin-right: 12px;
		height: 22px;
		-webkit-appearance: none;/*iPhoneの丸角グラデ防止*/
		border-radius: 3px;
	}

	#question_clr {
		width:100%;
		font-size: 9pt;
		text-decoration: none;
		background: rgb(35, 152, 235);/*青色*/
		color: #FFF;/*白色*/
		border: solid 0px #627295;
		height: 22px;
		-webkit-appearance: none;/*iPhoneの丸角グラデ防止*/
		border-radius: 3px;
	}

	div.eval_comp{
		border: 1px solid rgba(255,187,211,1);
		/*border: 1px solid rgba(35,186,235,1);*/
		background-color: #fff;
		color: rgba(255,102,153,1);
		/*color:black;*/
		border-radius: 10px;
		text-align: left;
		padding: 1px 10px;
		margin-bottom: 5px;
		opacity: 1;
		transition: .3s;
	}

	li a b {
		color: red;
	}

	/* サジェストエリアの指定 */
	li{
		font-size: 9pt;
		list-style-type : none;
		padding:5px 10px;
		border-bottom: thin solid #e0e0e0;
	}

	.title_logo {
		/*width: 25%;*/
		/*height: auto;*/
		text-align: center;
		margin-top: 5px;
	}

	/*スマホの入力フォームをタップして*/
	/*入力しようとする時に拡大する現象を解消する*/
	.question1 input[type="text"] {
		font-size: 100%;
	}

}

/*******************/
/*     android用   */
/*******************/

@media (max-width:360px) {
	body{
		/*  フォントの種類  */
		font-family:"メイリオ", "Meiryo",-apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", sans-serif;

		/*  フォントのサイズ  */
		font-size: 10pt;

		/*  フォントの色  */
		/* font-size: #333; */

		/* カーニングの設定 */
		letter-spacing: 0.2px;

		/* 行間の設定 */
		line-height: 1.25;

		margin:0;
	}

	footer p {
		margin:-0.2em 1em;
		font-size:6pt; /*  フォントのサイズ  */
		color:#808080;
	}

}

/*ここから共通部分*/

	.ui-autocomplete {
		z-index: 20000 !important;
		font-size: 20pt;
	}

	/*サジェスト部分*/
	.ui-menu .ui-menu-item a {
		color: rgba(85, 85, 85, 1);/*濃いグレー*/
	}

	/*リンク部分*/
	a:hover, a:focus {
		text-decoration : none;
	}

	a:visited {
		color: #990099;
		text-decoration: underline;
	}

	a:link {
		color: #0000ff;
		text-decoration: underline;
	}

	/*選択ボタン*/
	.choice_button{
		border: 1px solid rgba(208,244,255,1); /*薄い水色*/
		background-color: rgba(208,244,255,1); /*薄い水色*/
		border-radius: 10px;
		text-align: left;
		padding: 1px 10px;
		cursor:pointer;
		margin-bottom: 5px;
	}

	.choice_button:hover{
		background-color:rgba(35,186,235,1); /*濃い水色*/
		color:#ffffff;/*白色*/
	}

	.choice_button-p{
		padding: 0px 0px;
	}

	/*独自選択ボタン*/
	.choice_button_over{
		border: 1px solid rgba(255,187,211,1);/*濃いピンク*/
		background-color: #fff; /*白色*/
		color: rgba(255,102,153,1);/*濃いピンク*/
		border-radius: 10px;
		text-align: left;
		padding: 1px 10px;
		cursor:pointer;
		margin-bottom: 5px;
	}
 
	.choice_button_over:hover{
		background-color:rgba(255,187,211,1);/*濃いピンク*/
		color:#FFF;/*白色*/
	}

	.choice_button_over-p{
		padding: 0px 0px;
	}

	/*問題解決YesNoエリア*/
	.prolem-solv{
		float:right;
		/*color:#000;*/
		color:#555555f7;/*濃いグレー*/
	}

	.prolem-solv-yn{
		float: right;
	}

	.prolem-solv-y{
		background-color:rgba(153,204,255,1); 
		width: 60px;
		color:#555555f7;/*濃いグレー*/
		background: rgba(35,186,235,1);/*濃い水色*/
		color: #FFF;/*白色*/
		-webkit-appearance: none;/*iPhoneの丸角グラデ防止*/
		border-radius: 3px;
		margin-right: 3px;
		cursor: pointer;
	}

	.prolem-solv-y:hover {
		background-color: #fff;/*白色*/
		border-color: rgba(35,186,235,1);/*濃い水色*/
		color: rgba(35,186,235,1);/*濃い水色*/
	}

	.prolem-solv-n{
		background-color:rgba(255,102,153,1);/*濃いピンク*/
		width: 60px;
		color:#555555f7;/*濃いグレー*/
		background: rgba(255,102,153,1);/*濃いピンク*/
		color: #FFF;/*白色*/
		-webkit-appearance: none;/*iPhoneの丸角グラデ防止*/
		border-radius: 3px;
		cursor: pointer;
	}

	.prolem-solv-n:hover {
		background-color: #fff;/*白色*/
		border-color: rgba(255,102,153,1);/*濃いピンク*/
		color: rgba(255,102,153,1);/*濃いピンク*/
	}

	/*フッター商標部分*/
	.syouhyou{
		margin-top:5px;
		background-color: white;
	}

