@CHARSET "UTF-8";

/* 個人情報入力フォーム制御 */
#name_kanji_1,#name_kanji_2,#zip,#address_2,#address_3,#address_4,#address_5,#email,#tel {
	-webkit-appearance: none;
	border-radius: unset;
}
#name_kanji_1:focus,#name_kanji_2:focus,#zip:focus,#address_2:focus,#address_3:focus,#address_4:focus,#address_5:focus,#email:focus,#tel:focus {
	border: 2px solid #4387e9;
	box-shadow: 0 0 0 0 #4387e9;
	outline: 0;
}
/* フォーカスぶるるん */
a.focusBorder ,input.focusBorder {
	border: 1px solid #FF5E28!important;
	box-shadow: 0 0 0 1px #FF5E28;
	-webkit-box-shadow: 0 0 0 1px #FF5E28;
	outline: 0;
	animation-name: focusWave;
	animation-duration: 1s;
	animation-timing-function: ease;
	animation-iteration-count: infinite;
	-moz-animation-name: focusWave;
	-moz-animation-duration: 1s;
	-moz-animation-timing-function: ease;
	-moz-animation-iteration-count: infinite;
	-webkit-animation-name: focusWave;
	-webkit-animation-duration: 1s;
	-webkit-animation-timing-function: ease;
	-webkit-animation-iteration-count: infinite;
	-o-animation-name: focusWave;
	-o-animation-duration: 1s;
	-o-animation-timing-function: ease;
	-o-animation-iteration-count: infinite;
}
@keyframes focusWave {
	0% {
		box-shadow: 0 0 0 1px #f12, 0 0 0 1px #fff, 0 0 0 2px #FF5E28
	}
	100% {
		box-shadow: 0 0 0 1px #f12, 0 0 0 8px rgba(255, 255, 255, 0), 0 0 0 10px rgba(100, 37, 16, 0)
	}
}
@-moz-keyframes focusWave {
	0% {
		box-shadow: 0 0 0 1px #f12, 0 0 0 1px #fff, 0 0 0 2px #FF5E28
	}
	100% {
		box-shadow: 0 0 0 1px #f12, 0 0 0 8px rgba(255, 255, 255, 0), 0 0 0 10px rgba(100, 37, 16, 0)
	}
}
@-webkit-keyframes focusWave {
	0% {
		box-shadow: 0 0 0 1px #f12, 0 0 0 1px #fff, 0 0 0 2px #FF5E28
	}
	100% {
		box-shadow: 0 0 0 1px #f12, 0 0 0 8px rgba(255, 255, 255, 0), 0 0 0 10px rgba(100, 37, 16, 0)
	}
}
@-o-keyframes focusWave {
	0% {
		box-shadow: 0 0 0 1px #f12, 0 0 0 1px #fff, 0 0 0 2px #FF5E28
	}
	100% {
		box-shadow: 0 0 0 1px #f12, 0 0 0 8px rgba(255, 255, 255, 0), 0 0 0 10px rgba(100, 37, 16, 0)
	}
}


/* 767px以下用（スマートフォン用）の記述 */
@media screen and (max-width: 767px) {
	#modal_overlay {
		position: fixed;
		top: 0;
		left: 0;
		height: 100%;
		width: 100%;
		background-color: rgba(0, 0, 0, .5)
	}

	#modal_optimize, #modal_question {
		overflow: hidden;
		border-radius: 5px;
		position: absolute;
		top: 100px;
		left: 50%
	}

	#modal_overlay {
		z-index: 100;
		display: block;
		font-size: 15px;
	}
	#modal_question {
		padding: 3% 0 7%;
		width: 90%;
		display: block;
		background-color: #fff;
		border-radius: 5px;
		box-shadow: 0 0 4px rgba(0,0,0,.7);
		-moz-transform: translateX(-50%);
		-webkit-transform: translateX(-50%);
		-o-transform: translateX(-50%);
		transform: translateX(-50%);
	}

	#modal_question .text {
		width: 90%;
		margin: auto;
		/*padding-bottom: 5%;*/
		margin-bottom: 5%;
		text-align: center;
		font-size: 93%;
		border-bottom: 1px solid #a0a0a0;
	}

	#modal_question .text span {
		display: block;
		width: 100%;
		/*padding-bottom: 2%;*/
		margin-bottom: 3%;
		font-size: 124%;
		font-weight: 700;
		/*border-bottom: 1px solid #a0a0a0*/
	}

	#modal_question .button {
		width: 90%;
		margin: auto;
		font-size: 90%;
	}

	#modal_question .button a {
		display: block;
		width: 100%;
		box-shadow: 0 2px 0 0 #6D767B;
		border-radius: 5px;
		background-color: #458015;
		text-align: center;
		font-size: 127%;
	}

	#modal_question .button .sell {
		background-color: #6ABA1B
	}

	#modal_question .button .consider{
		background-color: #458015
	}

	#modal_question .button .no{
		background-color: #46C5EE
	}

	#modal_question .button a:not(:last-child) {
		margin-bottom: 6%
	}

	#modal_question .button a span {
		width: 100%;
		box-sizing: border-box;
		display: inline-block;
		padding: 1em 0 1em 16%;
		color: #fff
	}
	#modal_question .button a span {
		width: 100%;
		box-sizing: border-box;
		display: inline-block;
		padding: 1em 1em 1em 1em;
		color: #fff;
		//background-image: url(../img/icon_modal_btn_arrow.png);
		background-size: 2vw auto;
		background-repeat: no-repeat;
		background-position: 13% center;
	}
	#modal_question .button .sell span {
		//background: url(../img/icon_modal_sell.png) left 6% center no-repeat;
		//background-size: auto 48%
	}

	#modal_question .button .consider span {
		background-position: 7% center;
		//background: url(../img/icon_modal_rate.png) left 6% center no-repeat;
		//background-size: auto 48%
	}

	#modal_optimize {
		padding: 12% 0;
		width: 90%;
		display: none;
		background-color: #fff;
		box-shadow: 0 0 4px rgba(0, 0, 0, .7);
		-moz-transform: translateX(-50%);
		-webkit-transform: translateX(-50%);
		-o-transform: translateX(-50%);
		transform: translateX(-50%)
	}

	#modal_optimize .loader {
		text-align: center
	}

	#modal_optimize .loader img {
		width: 20%
	}

	#modal_optimize .loader span {
		padding-top: 3%;
		display: block;
		margin: auto
	}

	#modal_optimize.sell .loader span {
		color: #72BE27
	}

	#modal_optimize.consider .loader span {
		color: #458015
	}

	#modal_optimize.no .loader span {
		color: #46C5EE
	}

	#modal_optimize .text {
		padding-top: 5%;
		text-align: center;
		font-weight: 700;
		font-size: 124%
	}

	#modal_question .intro {
	width: 90%;
	padding: 2% 0 5%;
	margin: auto;
	letter-spacing: -1em;
	display: flex;
	justify-content: center;
	align-items: center;
}
#modal_question .intro .message {
	width: 80%;
	padding-right: 3%;
	display: inline-block;
	vertical-align: middle;
	text-align: left;
	line-height: 1.5;
	font-size: 112%;
	box-sizing: border-box;
}
#modal_question .message span {
	display: block;
	width: 100%;
	font-size: 110%;
	font-weight: 700;
}
#modal_question .intro .icon {
	max-width: 100px;
	display: inline-block;
	vertical-align: middle;
}
#modal_question .intro * {
	letter-spacing: normal;
}
#modal_question .button_not{
	text-align: center;
	padding-top: 15px;
}
#modal_question .button_not a{
	text-decoration: underline;
}
#modal_question .intro em{
	color: #458015;
	font-weight: bold;
}
}

/* 768px以上用（PC・タブレット用）の記述 */
@media screen and (min-width: 768px) {
	#modal_optimize, #modal_question {
		overflow: hidden;
		border-radius: 5px;
		position: absolute;
		top: 29%;
		left: 50%;
		box-sizing: border-box
	}

	#modal_question .text span, .formArea .toLandlineMsg .text em {
		display: block;
		/*border-bottom: 1px solid #a0a0a0;*/
		font-weight: 700
	}

	#modal_overlay {
		position: fixed;
		z-index: 9999;
		top: 0;
		left: 0;
		height: 100%;
		width: 100%;
		background-color: rgba(0, 0, 0, .5);
		display: block;
		font-size:13px;
	}

	#modal_question {
		padding: 30px;
		width: 700px;
		display: block;
		background-color: #fff;
		box-shadow: 0 0 4px rgba(0, 0, 0, .7);
		-moz-transform: translateX(-50%);
		-webkit-transform: translateX(-50%);
		-o-transform: translateX(-50%);
		transform: translateX(-50%)
	}

	#modal_question .text {
		padding-bottom: 10px;
		text-align: center;
		font-size: 114%;
		border-bottom: 1px solid #a0a0a0;
		margin-bottom: 30px;
	}

	#modal_question .text span {
		width: 100%;
		/*padding-bottom: 10px;
		margin-bottom: 15px;*/
		font-size: 124%
	}

	#modal_question .button {
		text-align: center
	}

	#modal_question .button a {
		display: inline-block;
		vertical-align: middle;
		width: 250px;
		box-shadow: 0 2px 0 0 #6D767B;
		border-radius: 5px;
		background-color: #46C5EE;
		text-align: center;
		font-size: 129%
	}

	#modal_question .button .sell {
		margin-right: 20px;
		background-color: #6ABA1B
	}

	#modal_question .button .consider{
		margin-right: 20px;
		background-color: #458015
	}

	#modal_question .button a span {
		width: 100%;
		box-sizing: border-box;
		display: inline-block;
		padding: 20px 20px 20px 20px;
		color: #fff
	}
	#modal_question .button a span {
		width: 100%;
		box-sizing: border-box;
		display: inline-block;
		padding: 20px 20px 20px 20px;
		color: #fff;
		//background-image: url(../img/icon_modal_btn_arrow.png);
		background-size: 9px auto;
		background-repeat: no-repeat;
		background-position: 15px center;
	}
	#modal_question .button .sell span {
		background-position: 32px center;
		//background: url(../img/icon_modal_sell.png) left 6% center no-repeat;
		//background-size: auto 48%;
	}

	#modal_question .button .consider span {
		//background: url(../img/icon_modal_rate.png) left 6% center no-repeat;
		//background-size: auto 48%;
	}

	#modal_optimize {
		padding: 30px 40px;
		width: 670px;
		display: none;
		background-color: #fff;
		box-shadow: 0 0 4px rgba(0, 0, 0, .7);
		-moz-transform: translateX(-50%);
		-webkit-transform: translateX(-50%);
		-o-transform: translateX(-50%);
		transform: translateX(-50%)
	}

	#modal_optimize .loader {
		text-align: center
	}

	#modal_optimize .loader img {
		width: 100px
	}

	#modal_optimize .loader span {
		padding-top: 15px;
		display: block;
		margin: auto
	}

	#modal_optimize.sell .loader span {
		color: #72BE27
	}

	#modal_optimize.consider .loader span {
		color: #458015
	}

	#modal_optimize.no .loader span {
		color: #46C5EE
	}

	#modal_optimize .text {
		padding-top: 20px;
		text-align: center;
		font-weight: 700;
		font-size: 122%
	}
	#modal_question .intro {
	width: 90%;
	padding: 2% 0 5%;
	margin: auto;
	display: flex;
	justify-content: center;
	align-items: center;
	letter-spacing: normal;
}

	#modal_question .intro em{
	color: #458015;
	font-weight: bold;
}
#modal_question .intro .icon {
	max-width: 100px;
	}
#modal_question .button_not{
	text-align: center;
	padding-top: 15px;
}
#modal_question .button_not a{
	text-decoration: underline;
	font-size: 130%;
}
}

#modal_optimize.modalAttention {
	padding: 30px 10px
}

#modal_optimize.modalAttention p {
	display: block;
	margin-bottom: 15px;
	box-sizing: border-box;
	line-height: 1.5em;
	color: #333;
	background: 0 0;
	font-size: 114%;
	text-align: center
}

#modal_optimize.modalAttention p span {
	display: block;
	margin: auto;
	text-align: center;
	font-weight: 700
}

#modal_optimize.modalAttention p em {
	color: red;
	font-weight: 700
}

#modal_optimize.modalAttention .button {
	display: block;
	margin: auto;
	width: 200px;
	box-shadow: 0 2px 0 0 #6D767B;
	border-radius: 5px;
	background-color: #46C5EE;
	text-align: center;
	font-size: 120%;
	text-decoration: none
}

#modal_optimize.modalAttention .button span {
	width: 100%;
	box-sizing: border-box;
	display: inline-block;
	padding: 15px 0 15px 20px;
	color: #fff;
	//background-image: url(../img/icon_modal_btn_arrow.png);
	background-size: 9px auto;
	background-repeat: no-repeat;
	background-position: 58px center
}


