@media only screen and (min-width:769px) {
	.top {
		position: relative;
		background: url(../imgs/top_bg.png) repeat-x bottom center #ABDFF4;
		padding-bottom: 60px;
	}
	.top .box {
		background-color:rgba(255,255,255,0.8);
		width: 720px;
		border-radius: 20px;
		margin: 0 auto;
	}
	.top .box h1 {
		text-align: center;
		font-size: 60px;
		font-weight: 700;
		line-height: 60px;
		color: #6599FF;
		padding-top: 20px;
	}
	.top .box h2 {
		text-align: center;
		font-size: 36px;
		font-weight: 700;
		line-height: 50px;
		padding-top: 20px;
	}
	.top .box h2 b {
		font-size: 40px;
		color: #6599FF;
	}
	.top .box ul {
		display: flex;
		justify-content: center;
		padding: 20px 0;
	}
	.top .box li {
		background: #6599FF;
		border-radius: 5px;
		padding: 0 15px;
		margin: 0 5px;
		color: #FFF;
		font-weight: 700;
		font-size: 18px;
		line-height: 40px;
	}
	.top .chara {
		position: absolute;
		top: -30px;
		left: 50%;
		margin-left: -600px;
		z-index: 10;
	}
	.chat {
		position: relative;
		background: url(../imgs/chat_bg.png) repeat-x top center;
		margin-top: -10px;
		padding: 90px 0 0;
		min-height: 740px;
	}
	.chat .step {
		width: 100%;
		float: left;
		padding-bottom: 90px;
	}
	.chat .talk {
		background: url(../imgs/chat_chara.png) no-repeat top left;
		min-height: 120px;
	}
	.chat .talk .fukidashi {
		position: relative;
		margin: 0 0 30px 160px;
		background: #FFF;
		padding: 20px;
		border-radius: 10px;
		font-size: 20px;
		line-height: 20px;
		top: 30px;
	}
	.chat .fukidashi::before {
		content: "";
		position: absolute;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 0 20px 20px 0;
		border-color: transparent #FFF transparent transparent;
		left: -20px;
		top: 20px;
	}
	.chat .input_area {
		background: #ABDFF4;
		border-radius: 10px;
		width: 100%;
		float: left;
		margin-top: 60px;
		padding: 20px;
		box-sizing: border-box;
	}
	.chat .input_area .icon {
		background: #6599FF;
		color: #FFF;
		margin-right: 10px;
		padding: 0 15px;
		font-size: 12px;
		border-radius: 5px;
		display: inline-block;
	}
	.chat .input_area .red {
		background: #E32449;
		color: #FFF;
		margin-right: 10px;
		padding: 0 15px;
		font-size: 12px;
		border-radius: 5px;
		display: inline-block;
	}
	.chat .input_area ul {
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
		padding: 0 0 20px;
	}
	.chat .input_area li {
		width: 320px;
		font-size: 20px;
		line-height: 20px;
		font-weight: 700;
		margin: 20px 20px 0;
		text-align: center;
		box-sizing: border-box;
	}
	.chat .input_area li input[type=radio],
	.chat .input_area li input[type=checkbox] {
		display: none;
	}
	.chat .input_area li label {
		display: block;
		border: solid 1px #5EC3ED;
		border-radius: 30px;
		color: #5EC3ED;
		background: #FFF;
		padding: 20px;
		cursor: pointer;
	}
	.chat .input_area li input[type=radio]:checked+label,
	.chat .input_area li input[type=checkbox]:checked+label {
		color: #FFF;
		background: #5EC3ED;
	}
	.chat .input_area dl {
		background: #FFF;
		border-radius: 5px;
		float: left;
		width: 100%;
		margin: 0 0 20px;
		padding: 20px;
		box-sizing: border-box;
	}
	.chat .input_area dl dt {
		width: 200px;
		padding-top: 5px;
		line-height: 25px;
		font-weight: 700;
		box-sizing: border-box;
		float: left;
	}
	.chat .input_area dl dd {
		width: 500px;
		line-height: 25px;
		font-weight: 700;
		box-sizing: border-box;
		float: left;
	}
	.chat .input_area dl.full dt {
		width: 100%;
	}
	.chat .input_area dl.full dd {
		width: 100%;
	}

	.chat .input_area dd input,
	.chat .input_area dd select {
		display: block;
		border: solid 1px #5EC3ED;
		border-radius: 5px;
		font-size: 16px;
		line-height: 40px;
		height: 40px;
		padding: 0 10px;
		width: 100%;
		box-sizing: border-box;

	}
	.chat .input_area dd textarea {
		display: block;
		border: solid 1px #5EC3ED;
		border-radius: 5px;
		font-size: 16px;
		height: 200px;
		padding: 10px;
		width: 100%;
		box-sizing: border-box;
		margin: 10px 0 20px;

	}
	.chat .input_area .button_wrap {
		clear: both;
		padding: 20px 0;
	}
	.chat .input_area .button_wrap button {
		border: none;
		background: #FF9A66;
		color: #FFF;
		font-size: 24px;
		font-weight: 700;
		line-height: 30px;
		padding: 15px 0;
		margin: 0 auto;
		display: block;
		width: 320px;
		text-align: center;
		border-radius: 30px;
		cursor: pointer;

	}
	.chat .input_area .button_wrap button:disabled {
		background: #D6D6D6;
	}

	.thanks .talk .fukidashi {
		font-size: 16px;
		line-height: 2em;
	}
}
@media only screen and (max-width:768px) {
	.top {
		position: relative;
		background: url(../imgs/top_bg.png) repeat-x bottom center #ABDFF4;
		background-size: contain;
		padding-bottom: 60px;
	}
	.top .box {
		background-color:rgba(255,255,255,0.8);
		width: calc(100% - 60px);
		border-radius: 15px;
		margin: 0 auto;
	}
	.top .box h1 {
		text-align: center;
		font-size: 8vw;
		font-weight: 700;
		line-height: 1.5em;
		color: #6599FF;
		padding-top: 10px;
	}
	.top .box h2 {
		text-align: center;
		font-size: 4vw;
		font-weight: 700;
		line-height: 1.5em;
		padding-top: 5px;
	}
	.top .box h2 b {
		font-size: 5vw;
		color: #6599FF;
	}
	.top .box ul {
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
		padding: 10px 40px 5px;
	}
	.top .box li {
		background: #6599FF;
		border-radius: 5px;
		padding: 5px;
		margin: 0 5px 5px;
		color: #FFF;
		font-weight: 700;
		font-size: 3vw;
		line-height: 1em;
		white-space: nowrap;
	}
	.top .chara {
		position: absolute;
		bottom: -75px;
		left: 0px;
		z-index: 10;
		width: 120px;
	}
	.chat {
		position: relative;
		background: url(../imgs/chat_bg.png) repeat-x top center;
		margin-top: -10px;
		padding: 45px 15px;
		min-height: 400px;

	}
	.chat .step {
		width: 100%;
		float: left;
		padding-bottom: 60px;
	}

	.chat .talk {
		background: url(../imgs/chat_chara.png) no-repeat top left;
		background-size: 60px;
		min-height: 70px;
	}
	.chat .talk .fukidashi {
		position: relative;
		margin: 0 0 10px 75px;
		background: #FFF;
		padding: 10px;
		border-radius: 5px;
		line-height: 20px;
		top: 0;
	}
	.chat .fukidashi::before {
		content: "";
		position: absolute;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 0 10px 10px 0;
		border-color: transparent #FFF transparent transparent;
		left: -10px;
		top: 15px;
	}

	.chat .input_area {
		background: #ABDFF4;
		border-radius: 10px;
		width: 100%;
		float: left;
		margin-top: 10px;
		padding: 10px;
		box-sizing: border-box;
	}
	.chat .input_area .icon {
		background: #6599FF;
		color: #FFF;
		margin-right: 10px;
		padding: 0 15px;
		font-size: 12px;
		border-radius: 5px;
		display: inline-block;
	}
	.chat .input_area .red {
		background: #E32449;
		color: #FFF;
		margin-right: 10px;
		padding: 0 15px;
		font-size: 12px;
		border-radius: 5px;
		display: inline-block;
	}
	.chat .input_area ul {
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
		padding: 0;
	}
	.chat .input_area li {
		width: 50%;
		font-size: 13px;
		line-height: 30px;
		font-weight: 700;
		margin: 10px 0 0;
		padding: 0 5px;
		color: #5EC3ED;
		text-align: center;
		box-sizing: border-box;
	}
	.chat .input_area li input[type=radio],
	.chat .input_area li input[type=checkbox] {
		display: none;
	}
	.chat .input_area li label {
		display: block;
		border: solid 1px #5EC3ED;
		border-radius: 30px;
		color: #5EC3ED;
		background: #FFF;
		cursor: pointer;
	}
	.chat .input_area li input[type=radio]:checked+label,
	.chat .input_area li input[type=checkbox]:checked+label {
		color: #FFF;
		background: #5EC3ED;
	}
	.chat .input_area dl {
		background: #FFF;
		border-radius: 5px;
		float: left;
		width: 100%;
		margin: 0 0 10px;
		padding: 10px;
		box-sizing: border-box;
	}
	.chat .input_area dl dt {
		width: 100%;
		font-weight: 700;
		box-sizing: border-box;
		float: left;
	}
	.chat .input_area dl dd {
		width: 100%;
		font-weight: 700;
		box-sizing: border-box;
		float: left;
	}
	.chat .input_area dl.full dt {
		width: 100%;
	}
	.chat .input_area dl.full dd {
		width: 100%;
	}

	.chat .input_area dd input,
	.chat .input_area dd select {
		display: block;
		border: solid 1px #5EC3ED;
		border-radius: 5px;
		font-size: 16px;
		line-height: 40px;
		height: 40px;
		padding: 0 10px;
		margin-top: 10px;
		width: 100%;
		box-sizing: border-box;

	}
	.chat .input_area dd textarea {
		display: block;
		border: solid 1px #5EC3ED;
		border-radius: 5px;
		font-size: 16px;
		height: 200px;
		padding: 10px;
		width: 100%;
		box-sizing: border-box;
		margin: 10px 0 20px;

	}
	.chat .input_area .button_wrap {
		clear: both;
		margin: 20px 0 10px;
	}
	.chat .input_area .button_wrap button {
		border: none;
		background: #FF9A66;
		color: #FFF;
		font-size: 16px;
		font-weight: 700;
		line-height: 40px;
		margin: 0 auto;
		display: block;
		width: 100%;
		text-align: center;
		border-radius: 20px;
		cursor: pointer;

	}
	.chat .input_area .button_wrap button:disabled {
		background: #D6D6D6;
	}
}