@charset "UTF-8";
/*======================================================================
reset
======================================================================*/
html {
  overflow-y: scroll;
}

body {
  line-height: 1;
  color: #000;
}

html,
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  font-style: normal;
  font-weight: normal;
  font-size: 100%;
  vertical-align: baseline;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}

blockquote,
q {
  quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: '';
  content: none;
}

input,
textarea,
select {
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  color: inherit;
}

input,
textarea {
  margin: 0;
  padding: 0;
}

ol,
ul {
  list-style: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

caption,
th {
  text-align: left;
}

img {
  vertical-align: bottom;
}

a:focus {
  outline: none;
}

input[type="button"],
input[type="submit"],
input[type="reset"],
button {
  -webkit-appearance: none;
}

/*======================================================================
foundation
======================================================================*/
* {
  box-sizing: border-box;
}

*:before, *:after {
  box-sizing: inherit;
}

html {
  font-size: 62.5%;
}
@media screen and (max-width: 749px){
	html{font-size:52.5%;}
}
@media screen and (max-width: 667px){
	html{font-size:48.5%;}
}
@media screen and (max-width: 568px){
	html{font-size:43.5%;}
}
@media screen and (max-width: 510px){
	html{font-size:38.5%;}
}
@media screen and (max-width: 430px){
	html{font-size:30.5%;}
}
@media screen and (max-width: 375px){
	html{font-size:27.5%;}
}
@media screen and (max-width: 320px){
	html{font-size:23.5%;}
}

body {
  min-width: 320px;
  width: 100%;
  max-width: 750px;
  margin: 0 auto 0 auto;
  padding: 0 0 calc(170%/750*100) 0;
  line-height: 1.5;
  font-family: "ヒラギノ角ゴPro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 1em;
  color: #262626;
  background: #FFFFFF;
  -webkit-text-size-adjust: 100%;
  overflow: hidden;
}

a {
  -webkit-transition: all 0.2s ease 0s;
  transition: all 0.2s ease 0s;
}

a:link {
  color: inherit;
}

a:visited {
  color: inherit;
}

a:active {
  color: inherit;
}

p {
  margin: 1.5em 0 0;
}

p:first-of-type {
  margin-top: 0;
}

img {
  max-width: 100%;
  height: auto;
}
.clear{
	clear:both;
	margin:0;
	padding:0;
}

.clearfix:after {
    content: ".";
    display: block;
    clear: both;
    height: 0;
    visibility: hidden;
}

.clearfix {
    min-height: 1px;
}

* html .clearfix {
    height: 1px; /*¥*/
    /*/ height: auto; overflow: hidden; /**/
}

/*======================================================================
layout
======================================================================*/
/*========================================
header
========================================*/
.header {
	height: 0;
	padding: 0 0 calc(100%/750*100) 0;
	width: 100%;
	max-width: 750px;
	position: fixed;
	background-color: #fff;
	z-index: 100;
}

.header .header_logo {
	margin: 0 0 0 calc(10%/750*100);
	width: calc(409%/750*100);
	text-indent: 100%;
	overflow: hidden;
	white-space: nowrap;
}
.header .header_logo a{
	background: url(../img/logo.jpg) no-repeat top;
	background-size: 100%;
	padding-bottom: calc(100%/409*100);
	width: 100%;
	display: block;
}
.header .header_logo a:hover {
	opacity: 0.75;
}

/*========================================
menu
========================================*/
.btn_menu {
	position: absolute;
	background-image: url(../img/menu.jpg);
	background-repeat: no-repeat;
	background-size: 100%;
	width: calc(110%/750*100);
	height: 0;
	padding-bottom: calc(100%/750*100);
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	display: block;
	top:0;
	right: 0;
	z-index: 100;	
}


.btn_menu.close {
  background-image: url(../img/close.jpg);
	background-size: 100%;
	width: calc(110%/750*100);
	z-index: 100;
}
nav {
	margin: calc(100%/750*100) 0 0 0;
	background-color: #b80004;
	width: 100%;
	overflow: auto;
	position: fixed;
	top: 0;
	right: -100%;
	bottom: 0;
	z-index: 99;
}

/*
@media screen and (max-width: 736px){
nav {
	}
}

@media screen and (max-width: 414px){
nav {
	top:calc(50%/750*100);
	}
}

@media screen and (min-height: 740px){
nav {
	top:calc(50%/750*100);
	}
}
@media screen and (min-height: 740px) and (min-width: 737px){
nav {
	top:calc(50%/750*100);
	}
}
*/
nav ul {
}
nav ul li {
	font-size: 3.0rem;
	 color: #fff;
}
 nav ul li a {
	font-weight: bold;
	 white-space: nowrap;
	 box-sizing: border-box;
	 padding: 0.5em 1em 0.5em 1em;
	 text-decoration: none;
	 color: #fff;
	 display: block;
	 border-bottom: #fff solid 0.1em;
}
nav ul li.tel a{
	padding: calc(10%/750*100) 0 calc(10%/750*100) 0;
	margin: calc(30%/750*100) auto 0 auto;
	width: calc(670%/750*100);
	background-color: #fff;
	border-radius: 5px;
	text-align: center;
	border: none;
}
nav ul li.tel a .txt1{
	font-size: 3.0rem;
	line-height: 120%;
	color: #333333;
	font-weight: bold;
}
nav ul li.tel a .num{
	font-size: 6.4rem;
	line-height: 120%;
	color: #b80004;
	font-weight: bold;
	background: url(../img/menu_tel.png) no-repeat 13%/5%;
	padding-left: 1em;
}
nav ul li.tel a .txt2{
	font-size: 3.0rem;
	line-height: 120%;
	color: #b80004;
	font-weight: bold;
}
.main_pct{
	margin: calc(100%/750*100) 0 0 0;
	padding: calc(30%/750*100) 0 calc(580%/750*100) 0;
	background: url(../img/main_bg.jpg) no-repeat top;
	width: 100%;
	background-size: 100%;
	height: 0;
}
h1 {
	margin: 0 auto 0 auto;
	height: 0;
	padding: 0 0 calc(198%/750*100) 0;
	background: url(../img/main_txt1.png) no-repeat ;
	width: calc(662%/750*100);
	background-size: 100%;
	text-indent: 100%;
	overflow: hidden;
	white-space: nowrap;
}
.main_txt1 {
	margin: calc(50%/750*100) 0 0 calc(15%/750*100);
	height: 0;
	padding: 0 0 calc(100%/750*100) 0;
	background: url(../img/main_txt2.png) no-repeat ;
	width: calc(514%/750*100);
	background-size: 100%;
	text-indent: 100%;  
	overflow: hidden;
	white-space: nowrap;
}
.main_txt2 {
	margin: calc(20%/750*100) 0 0 calc(15%/750*100);
	height: 0;
	padding: 0 0 calc(160%/750*100) 0;
	background: url(../img/main_txt3.png) no-repeat ;
	width: calc(500%/750*100);
	background-size: 100%;
	text-indent: 100%;  
	overflow: hidden;
	white-space: nowrap;
}

/*========================================
footer
========================================*/
.footer {
	color: #fff;
}

.footer .copyright {
	font-size: 2.0rem;
	display: block;
	line-height: 120%;
	text-align: center;
	background-color: #b80004;
	height: 0;
	padding: calc(30%/750*100) 0 calc(50%/750*100) 0;
}

.footer_nav {
	position: fixed;
	bottom: 0;
	z-index: 100;
	width: 100%;
	max-width: 750px;
	margin: 0 auto 0 auto;
	padding: calc(12%/750*100) 0 calc(16%/750*100) 0;
	box-sizing: border-box;
	text-align: center;
	background: rgba(255, 255, 255, 0.9);
}
.footer_nav .txt{
	font-size: 3.0rem;
	color: #333333;
	line-height: 100%;
	text-align: center;
	font-weight: bold;
}
.footer_nav .txt span{
	color: #b80004;
	font-weight: bold;
}
.footer_nav .btn{
	border: 2px solid #53b234;
	border-radius: 8px;
	box-shadow:0px 3px 0px 0px #194c03;
	font-weight: bold;
	width: calc(710%/750*100);
	margin: 1.4% auto 0 auto;
  background: #fff;
}

.footer_nav .btn .left_txt{
	float: left;
	font-size: 3.0rem;
	color: #04a000;
	width: calc(270%/710*100);
	text-align: center;
	font-weight: bold;
	padding-top: 1em;
	margin-top: 0;
	background-color: #fff;
	border-radius: 8px;
}
.footer_nav .btn .right_bg{
	float: right;
	background: url(../img/footer_bg.jpg) left no-repeat #53b234;
	width: calc(440%/710*100);
	text-align: center;
}
.footer_nav .btn .right_txt1{
	font-size: 4.4rem;
	color: #fff;
	padding-left: 1.3em;
	font-weight: bold;
	position: relative;
}
.footer_nav .btn .right_txt1:before{
	content: '';
	background: url(../img/tel_mark1.png) 12%/6% no-repeat;
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
}
.footer_nav .btn .right_txt2{
	font-size: 2.8rem;
	line-height: 120%;
	color: #fff;
	font-weight: bold;
}

/*========================================
CONTENTS
========================================*/
.contact {
	background-color: #f93d3d;
	padding: 0 0 calc(60%/750*100) 0;
}

.contact h2{
	padding-top: 1em;
	font-size: 3.5rem;
	line-height: 160%;
	color: #fff;
	font-weight: bold;
	text-align: center;
}
.contact h2 span.large{
	font-size: 4.2rem;
	font-weight: bold;
	-webkit-animation: flash 1s infinite;
	animation: flash 1s infinite;
}
@-webkit-keyframes flash {
  50%{
	  opacity: 0;
	}
}
@keyframes flash {
	50%{
		opacity: 0;
	}
}
.contact h2 span.yellow{
	color: #ffff00;
	font-weight: bold;
}
.contact .box{
	margin: calc(30%/750*100) auto 0 auto;
	width: calc(710%/750*100);
	padding: calc(30%/750*100) 0 calc(38%/750*100) 0;
	box-sizing: border-box;
	background-color: #fff;
	border-radius: 10px;
}
.contact .box .txt1 {
	font-size: 3.5rem;
	line-height: 200%;
	color: #1b2a75;
	font-weight: bold;
	text-align: center;
}
.contact .box .txt1 span{
	font-size: 4rem;
	color: #ffffff;
	font-weight: bold;
	background-color: #c48d35;
	padding: 0.3em;
	margin-right: 0.1em;
}
.contact .box .time{
	margin: 0.5em auto 0 auto;
	text-align: center;
}
.contact .box .time .time_now{
	font-size: 4.0rem;
	line-height: 200%;
	color: #f92b4e;
	font-weight: bold;
}
.contact .box .time .time_comment{
	font-size: 3.4rem;
	line-height: 200%;
	color: #6b2f2f;
	font-weight: bold;
}
.contact .btn{
	border-radius: 8px;
	box-shadow:0px 3px 0px 0px #194c03;
	font-weight: bold;
	width: calc(630%/710*100);
	margin: 2% auto 0 auto;
	background-color: #53b234;
	text-align: center;
	padding: calc(10%/710*100) 0 calc(10%/710*100) 0; 
}
.contact .btn a{
	text-decoration: none;
}
.contact .btn a .txt1{
	font-size: 6.4rem;
	line-height: 140%;
	color: #fff;
	padding-left: 1.3em;
	font-weight: bold;
	position: relative;
}
.contact .btn a .txt1:before{
	content: '';
	background: url(../img/tel_mark1.png) 12%/6% no-repeat;
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
}
.contact .btn a .txt2{
	font-size: 3.0rem;
	line-height: 100%;
	color: #fff;
	font-weight: bold;
}


.contact .box .link {
	margin: calc(39%/694*100) auto 0 auto;
	text-align: center;
}
.contact .box .link a{
	font-size: 2.7rem;
	line-height: 150%;
	color: #293e8c;
	text-decoration: underline;
	font-weight: bold;
}

.contact .box .txt3 {
	font-size: 2.2rem;
	line-height: 140%;
	color: #000909;
	text-align: left;
	margin: 1.4em 1em 0 1.4em;
	text-indent: -1.4em;
	padding-left: 1em;
}

.contact .box .box2 {
	border-radius: 8px;
	border: 2px solid #b80004;
	width: calc(670%/710*100);
	margin: 2% auto 0 auto;
	background-color: #fffbe9;
	padding: calc(10%/670*100) 0 calc(20%/670*100) 0; 
}
.contact .box .box2 .txt4 {
	font-size: 3.4rem;
	line-height: 140%;
	color: #b80004;
	text-align: center;
	padding: 0.5em 0 0 0;
	font-weight: bold;
}
.contact .box .box2 li{
	font-size: 3.2rem;
	line-height: 120%;
	color: #191919;
	padding: 0.5em 0 0 1em;
	font-weight: bold;
}
.contact .box .box2 li:before{
	content: '・';
}

#problem{
	margin: calc(-100%/750*100) 0 0 0;
	padding: calc(160%/750*100) 0 calc(100%/750*100) 0;
	background: url(../img/problem_bg.jpg);
	background-size: 5%;
	position: relative;
	z-index: -1;
}
#problem h2{
	background: url(../img/problem_txt1.png) no-repeat center;
	padding: 0 0 calc(140%/750*100) 0;
	height: 0;
	width: 100%;
	margin: 0 auto 0 auto;
	background-size: calc(660%/750*100);
	text-indent: -9999px;
	overflow: hidden;
	white-space: nowrap;
}
#problem ul{
	padding: calc(20%/750*100) 0 0 0;
}
#problem li{
	padding: 0 0 calc(110%/750*100) 0;
	height: 0;
	width: 100%;
	margin: calc(18%/750*100) auto 0 auto;
	background-size: calc(670%/750*100);
	text-indent: -9999px;
	overflow: hidden;
	white-space: nowrap;
}
#problem li:nth-of-type(1){
	background: url(../img/problem_txt2.png) no-repeat center;
	background-size: calc(670%/750*100);
}
#problem li:nth-of-type(2){
	background: url(../img/problem_txt3.png) no-repeat center;
	background-size: calc(670%/750*100);
}
#problem li:nth-of-type(3){
	background: url(../img/problem_txt4.png) no-repeat center;
	background-size: calc(670%/750*100);
}
#problem li:nth-of-type(4){
	background: url(../img/problem_txt5.png) no-repeat center;
	background-size: calc(670%/750*100);
}
#problem li:nth-of-type(5){
	background: url(../img/problem_txt7.png) no-repeat center;
	background-size: calc(670%/750*100);
}
#problem .txt{
	background: url(../img/problem_txt6.png) no-repeat center;
	padding: 0 0 calc(140%/750*100) 0;
	height: 0;
	width: 100%;
	margin: calc(40%/750*100) auto 0 auto;
	background-size: calc(710%/750*100);
	text-indent: -9999px;
	overflow: hidden;
	white-space: nowrap;
}

#merit{
	margin: calc(-100%/750*100) 0 0 0;
	padding: calc(160%/750*100) 0 0 0;
	background-size: 5%;
	position: relative;
	z-index: -1;
}
#merit h2{
	background: url(../img/merit_h2.png) no-repeat center;
	padding: 0 0 calc(240%/750*100) 0;
	height: 0;
	width: 100%;
	margin: calc(-120%/750*100) 0 0 0;
	background-size: 100%;
	text-indent: -9999px;
	overflow: hidden;
	white-space: nowrap;
}
#merit ul{
	background-color: #ff8d8d;
	padding: calc(10%/750*100) 0 calc(50%/750*100) 0;
}
#merit ul li{
	background-color: #fff;
	width: calc(710%/750*100);
	margin: calc(30%/750*100) auto 0 auto;
	padding: calc(20%/710*100) 0 0 0;
}
#merit li .title{
	border-bottom: 4px solid #b80004;
	font-size: 3.6rem;
	line-height: 120%;
	color: #000000;
	padding: 0 calc(30%/710*100) 0 calc(120%/710*100);
}
#merit li .title span{
	display: table-cell;
	vertical-align: middle;
	height: 3em;	
	font-weight: bold;
}
#merit li:nth-of-type(1) .title{
	background: url(../img/merit_num1.jpg) no-repeat 2% 20%/12%;
}
#merit li:nth-of-type(2) .title{
	background: url(../img/merit_num2.jpg) no-repeat 2% 20%/12%;
}
#merit li:nth-of-type(3) .title{
	background: url(../img/merit_num3.jpg) no-repeat 2% 20%/12%;
}
#merit li:nth-of-type(4) .title{
	background: url(../img/merit_num4.jpg) no-repeat 2% 20%/12%;
}
#merit li:nth-of-type(5) .title{
	background: url(../img/merit_num5.jpg) no-repeat 2% 20%/12%;
}
#merit li p{
	font-size: 2.8rem;
	line-height: 140%;
	color: #000000;
	padding: 1.2em;
}
#merit li p span{
	color:#b80004;
	font-weight: bold;
}
#merit .bg{
	background-color: #fff5f0;
	padding: calc(40%/750*100) 0 calc(50%/750*100) 0;
}
#merit .bg .txt{
	background: url(../img/merit_txt1.png) center no-repeat;
	padding: 0 0 calc(330%/750*100) 0;
	height: 0;
	width: 100%;
	background-size: calc(710%/750*100);
	text-indent: -9999px;
	overflow: hidden;
	white-space: nowrap;
}
#merit .bg .box{
	background-color: #fffaf3;
	width: calc(710%/750*100);
	border: double 2px #e28c1a;
	outline: 2px solid #e28c1a;
	outline-offset: -6px;
	margin: 0 auto 0 auto;
	padding-bottom: calc(30%/750*100);
	box-shadow:1px 2px 3px 0px #d4d4d4;
}
#merit .bg .box p{
	font-size: 2.8rem;
	color: #191919;
	line-height: 130%;
	padding: 1em 1em 0 1em;
}
#merit .bg .box ol{
	width: 94%;
	margin: 0.5em auto 0 auto;
}
#merit .bg .box ol li{
	font-size: 3.1rem;
	color: #b80004;
	line-height: 130%;
	padding: 0.3em;
	border-bottom: 1px solid #ffc200;
	background-color: none;
	font-weight: bold;
}

#privilege{
	margin-top: calc(-100%/750*100);
	padding: calc(160%/750*100) 0 calc(160%/750*100) 0;
	background-color: #fcf8f0;
	position: relative;
	z-index: -1;
}
#privilege h2{
	background: url(../img/privilege_top.jpg) no-repeat;
	padding: 0 0 calc(262%/750*100) 0;
	height: 0;
	width: calc(710%/750*100);
	background-size: 100%;
	text-indent: -9999px;
	overflow: hidden;
	white-space: nowrap;
	margin: 0 auto 0 auto;
}
#privilege .bg{
	background: url(../img/privilege_bg.jpg) repeat-y;
	padding: 0;
	width: calc(710%/750*100);
	background-size: 100%;
	margin: 0 auto 0 auto;
	position: relative;
}
#privilege .bg .title{
	font-size: 3.0rem;
	line-height: 140%;
	color: #543b3b;
	text-align: center;
	font-weight: bold;
	padding: 1.5em 0 1.5em 0;
}
#privilege .bg .title span{
	font-weight: bold;
	color: #b80004;
}

#privilege .bg p{
	font-size: 2.8rem;
	line-height: 150%;
	padding: 0 1.5em 0 1.5em;
	color: #000000;
}
#privilege .bg p span{
	color: #b80004;
	font-weight: bold;
}

#privilege .bg:after{
	content: '';
	background: url(../img/privilege_btm.jpg) repeat-y;
	padding: 0 0 calc(137%/710*100) 0;
	width: 100%;
	background-size: 100%;
	margin: 0;
	position: absolute;
	top: 100%;
}
#privilege .txt1{
	font-size: 3.8rem;
	line-height: 140%;
	color: #b80004;
	text-align: center;
	font-weight: bold;
	padding: calc(180%/710*100) 0 0 0;
}
#privilege .txt1 span{
	font-size: 3.6rem;
	line-height: 140%;
	color: #471f1f;
	font-weight: bold;
}
#privilege .txt2{
	font-size: 4.75rem;
	color: #b80004;
	text-align: center;
	font-weight: bold;
	padding: 0.5em 0 0 0;
}

#cost h2{
	background: url(../img/cost_h2.png) no-repeat;
	padding: 0 0 calc(240%/750*100) 0;
	height: 0;
	width: 100%;
	background-size: 100%;
	text-indent: -9999px;
	overflow: hidden;
	white-space: nowrap;
	margin: calc(-120%/750*100) 0 0 0;
}
#cost .box{
	background-color: #efe7d8;
	padding: calc(30%/750*100) calc(20%/750*100) calc(50%/750*100) calc(20%/750*100);
	width: 100%;
	margin: 0 auto 0 auto;
}

#cost table{
	margin: calc(40%/750*100) auto 0 auto;
	width: calc(710%/750*100);
	border-collapse: collapse;	
}
#cost table th,#cost table td{
	border: 0.2em solid #efe7d8;
	vertical-align: middle;
}
#cost table th{
	font-size: 3.0rem;
	width: calc(190%/710*100);
	background-color: #aa7777;
	color: #fff;
	padding: 0.6em;
	font-weight: bold;
}
#cost table td{
	font-size: 2.8rem;
	width: calc(516%/710*100);
	padding: 0.9em ;
	background-color: #fff;
	color: #000000;
}
#faq{
	margin: calc(-100%/750*100) 0 0 0;
	padding: calc(100%/750*100) 0 calc(40%/750*100) 0;
}
#faq h2{
	background: url(../img/faq_h2.jpg) no-repeat;
	padding: 0 0 calc(140%/750*100) 0;
	height: 0;
	width: 100%;
	background-size: 100%;
	text-indent: -9999px;
	overflow: hidden;
	white-space: nowrap;
	margin: 0;
}
.question-change {
	margin: 2em 0 0 0;
  text-align: center;
	width: 100%;
}
.question-change .txt {
  display: inline-block;
  font-weight: bold;
  vertical-align: middle;
	color: #191919;
}
.question-change ul {
  border-radius: 0.5em;
  display: inline-block;
  text-align: center;
  margin-left: 10px;
  background: #e25100;
}
.question-change li {
  display: inline-block;
  color: #fff;
  font-weight: bold;
  cursor: pointer;
  transition: .4s;
  margin-left: -3px;
	font-size: 2.8rem;
}
.question-change li:first-child {
  margin-left: 0;
}
.question-change li.current {
  color: #e25100;
  background: #fff;
  border-radius: 0.5em;
}
.question-list {
	margin-top: -2em;
}

#faq .question-list .question{
	background: url(../img/faq_q.png) no-repeat #f7f3ed;
	background-size: calc(41%/750*100);
	background-position: 1.5em center;
	padding: 2em 0 2em 0;
	width: 94.666%;
	margin: 2.816% auto 0 auto;
	position: relative;
	cursor: pointer;
}

#faq .question-list .question p{
	font-size: 2.8rem;
	line-height: 140%;
	color: #333333;
	font-weight: bold;
	padding: 0 5em 0 3.5em;
}
#faq .question-list .question.is-close .ico-toggle:after {
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
  animation: accordion-close 0.3s alternate linear;
  -ms-animation: accordion-close 0.3s alternate linear;
  -webkit-animation: accordion-close 0.3s alternate linear;
  -moz-animation: accordion-close 0.3s alternate linear;
}

#faq .question-list .question.is-open .ico-toggle:after {
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
  animation: accordion-open 0.3s alternate linear;
  -ms-animation: accordion-open 0.3s alternate linear;
  -webkit-animation: accordion-open 0.3s alternate linear;
  -moz-animation: accordion-open 0.3s alternate linear;
}

#faq .question-list .answer{
	display: none;
	background: url(../img/faq_a.png) no-repeat;
	background-size: calc(43%/750*100);
	background-position: 1.5em 1.5em;
	padding: 1.5em 0 2em 0;
	width: 94.666%;
	margin: 2.816% auto 0 auto;
	position: relative;
}
#faq .question-list .answer p{
	font-size: 2.8rem;
	line-height: 140%;
	color: #333333;
	padding: 0 1em 0 3.5em;
}
.question-list .ico-toggle {
  width: 40px;
  height: 40px;
  position: absolute;
}
.question-list .ico-toggle:before {
  content: "";
  display: block;
  background: #0a7220;
  border-radius: 6px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}
.question-list .ico-toggle:after {
  content: "";
  display: block;
  background: #0a7220;
  border-radius: 6px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
}

@keyframes accordion-open {
  0% {
    transform: rotate(90deg);
  }
  100% {
    transform: rotate(180deg);
  }
}

@keyframes accordion-close {
  0% {
    transform: rotate(180deg);
  }
  100% {
    transform: rotate(90deg);
  }
}
  .question-change {
    margin-bottom: 40px;
  }
  .question-change .txt {
    font-size: 3.8rem;
  }
  .question-change ul {
    padding: 1em;
  }
  .question-change li {
    padding: 3px 16px;
  }
  .question-list .ico-q {
    left: 23px;
    font-size: 40px;
  }
  .question-list .ico-a {
    font-size: 40px;
    left: 23px;
  }
.question-list .ico-toggle {
    right: 10px;
    top: 0;
    bottom: 0;
    margin: auto;
  }
  .question-list .ico-toggle:before {
    width: 23px;
    height: 3px;
  }
  .question-list .ico-toggle:after {
    width: 23px;
    height: 3px;
  }
#flow{
	margin: calc(-100%/750*100) 0 0 0;
	padding: calc(100%/750*100) 0 0 0;
}
#flow h2{
	background: url(../img/flow_h2.jpg) no-repeat;
	padding: 0 0 calc(140%/750*100) 0;
	height: 0;
	width: 100%;
	background-size: 100%;
	text-indent: -9999px;
	overflow: hidden;
	white-space: nowrap;
}
#flow ol{
	padding: calc(50%/750*100) calc(20%/750*100) calc(60%/750*100) calc(20%/750*100);
}
#flow li .step{
	float: left;
	height: 0;
	width: calc(160%/710*100);
	text-indent: -9999px;
	overflow: hidden;
	white-space: nowrap;
}
#flow li:nth-of-type(1) .step{
	background: url(../img/flow1.jpg) no-repeat;
	padding: 0 0 calc(190%/710*100) 0;
	background-size: 100%;
}
#flow li:nth-of-type(2) .step{
	background: url(../img/flow2.jpg) no-repeat;
	padding: 0 0 calc(221%/710*100) 0;
	background-size: 100%;
}
#flow li:nth-of-type(3) .step{
	background: url(../img/flow3.jpg) no-repeat;
	padding: 0 0 calc(139%/710*100) 0;
	background-size: 100%;
}
#flow li:nth-of-type(4) .step{
	background: url(../img/flow4.jpg) no-repeat;
	padding: 0 0 calc(50%/710*100) 0;
	background-size: 100%;
}

#flow li .txt{
	float: right;
	width: calc(530%/710*100);
}
#flow li .txt .title{
	font-size: 3.2rem;
	line-height: 140%;
	color: #471f1f;
	font-weight: bold;
	padding: 0.3em 0 0 0;
}
#flow li .txt p{
	font-size: 2.8rem;
	color: #333333;
	line-height: 140%;
	padding: 0.5em 0 0 0;
}
#outline{
	margin: calc(-100%/750*100) 0 0 0;
	padding: calc(100%/750*100) 0 0 0;
}
#outline h2{
	background: url(../img/outline_h2.jpg) no-repeat;
	padding: 0 0 calc(140%/750*100) 0;
	width: 100%;
	background-size: 100%;
	height: 0;
	text-indent: -9999px;
	overflow: hidden;
	white-space: nowrap;
}
#outline table{
	margin: calc(50%/750*100) auto 0 auto;
	width: calc(720%/750*100);
	border-collapse: collapse;	
}
#outline table th,#outline table td{
	border: 0.2em solid #fff;
	vertical-align: middle;
}
#outline table th{
	font-size: 3.0rem;
	width: calc(190%/710*100);
	background-color: #aa7777;
	color: #fff;
	padding: 0.5em 0.5em 0.5em 0.8em ;
}
#outline table td{
	font-size: 2.8rem;
	width: calc(516%/710*100);
	padding: 0.5em 0.5em 0.5em 0.8em ;
	background-color: #efeded;
	color: #000000;
}

#outline h3{
	font-size: 4.0rem;
	line-height: 140%;
	color: #333333;
	margin: calc(48%/750*100) auto calc(14%/750*100) auto;
	text-align: center;
}
#outline h3 span{
	padding: 0  calc(12%/750*100)  calc(8%/750*100) calc(12%/750*100);
	border-bottom: 4px solid #a0242a;
	font-weight: bold;
}
#outline h4{
	font-size: 2.8rem;
	line-height: 140%;
	color: #333333;
	font-weight: bold;
	border-left: 4px solid #a0242a;
	padding-left: calc(12%/750*100);
	width: calc(710%/750*100);
	margin: 0;
}
#outline ul{
	margin: calc(60%/750*100) 0 calc(80%/750*100) 0;
}
#outline li{
	border-bottom: 2px dotted #995c5c;
	width: calc(710%/750*100);
	margin: 0.8em auto 0 auto;
	font-size: 2.3rem;
	line-height: 140%;
	color: #333333;
}
#outline li div{
	padding: 0.7em 1em 0.7em 1em;
	font-size: 2.3rem;
	line-height: 140%;
	color: #333333;
}

#lawyer{
	margin: calc(-100%/750*100) 0 0 0;
	padding: calc(100%/750*100) 0 0 0;
	position: relative;
	z-index: -1;
}
#lawyer h2{
	background: url(../img/lawyer_h2.jpg) no-repeat;
	padding: 0 0 calc(140%/750*100) 0;
	width: 100%;
	background-size: 100%;
	height: 0;
	text-indent: -9999px;
	overflow: hidden;
	white-space: nowrap;
}
#lawyer .box{
	background-color: #fcf8f0;
	padding: calc(20%/750*100) 0 calc(80%/750*100) 0;
}
#lawyer ul{
	width: calc(710%/750*100);
	margin: 0 auto 0 auto;
}
#lawyer li{
	width: 100%;
	background-color: #fff;
	margin-top: calc(30%/750*100);
}
#lawyer li .txt{
	float: left;
	width: calc(430%/710*100);
	margin: calc(30%/710*100) 0 calc(30%/710*100) calc(20%/710*100);
}
#lawyer li .txt .name{
	font-size: 2.8rem;
	line-height: 170%;
	color: #000000;
	border-bottom: 2px solid #a0242a;
	padding: calc(8%/710*100) 0 calc(16%/710*100) 0;
}
#lawyer li .txt .name span{
	font-size: 4.0rem;
	font-weight: bold;
	margin-left: 0.2em;
}
#lawyer li .txt p{
	font-size: 2.8rem;
	line-height: 160%;
	color: #000000;
	padding: 0.8em 0.1em 0.1em 0.1em;
}

#lawyer li .pct{
	float: right;
	width: calc(220%/710*100);
	margin: calc(30%/710*100) calc(20%/710*100) calc(30%/710*100) 0;
}
#form{
	margin: calc(-100%/750*100) 0 0 0;
	padding: calc(100%/750*100) 0 calc(60%/750*100) 0;
}
#form h2{
	background: url(../img/form_h2.jpg) no-repeat;
	padding: 0 0 calc(140%/750*100) 0;
	width: 100%;
	background-size: 100%;
	height: 0;
	text-indent: -9999px;
	overflow: hidden;
	white-space: nowrap;
}
#form table {
	font-size: 3.0rem;
	border-collapse:collapse;
	width: 100%;
}
#form table tr th,
#form table tr td {
	display: block;
	width: 100%;
}
#form table tr th {
	padding: 2% 3% 2% 3%;
	background: #e5e8ea;
	vertical-align: baseline;
	color: #333333;
}
#form table tr th p {
	display: inline-block;
	font-weight: bold;
}
#form table tr th span {
	color: #fff;
	background: #ff0000;
	display: inline-block;
	padding: 2px 5px;
	font-size: 2.4rem;
	margin: 0 0 0 2%;
	vertical-align: bottom;
}
#form table tr th .error {
	background: transparent;
	color: #ff0000;
	font-size: 10px;
	float: right;
}
#form table tr td {
	padding: 15px 10px;
	background: #fff;
}
#form table tr td p {
	line-height: 1.5em;
	margin-bottom: 10px;
}
#form table tr td p span {
	display: inline-block;
	width: 88%;
	vertical-align: top;
}
#form table tr td label {
	display: block;
	margin: 0;
}
#form table tr td label + label {
	margin: 20px 0 0 0px;
}
#form table tr td input[type="text"],
#form table tr td input[type="email"] {
	width: 100%;
	border: 1px solid #666666;
	background: #fff;
	padding: 1% 2% 1% 2%;
}
#form table tr td input#form_debt {
	width: 80%;
	margin-right: 1%;
}

#form table tr td input[type="radio"] ,
#form table tr td input[type="checkbox"] {
	display: inline-block;
	margin: 0 10px;
	max-width: 1em;
	height: 1em;
	vertical-align: text-top;
}
#form table tr td .check_box{
	width: 50%;
	float: left;
}
#form table tr td textarea {
	width: 100%;
	vertical-align: text-top;
	border: 1px solid #666666;
	background: #fff;
	padding: 1% 2% 20% 2%;
}

#form .confirmation {
	margin: 0 auto 0 auto;
	width: 94.666%;
	font-size: 2.4rem;
}
#form .confirmation p{
	margin-top: 0;
	padding-top: 0;
}
input[type="submit"]{
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
	border-radius: 5px;
	border: 0;
	margin: 0;
	padding: 0;
	background: none transparent;
	vertical-align: middle;
	font-size: inherit;
	color: inherit;
}

input[type="submit"]{
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out; }

input[type="submit"]:hover{
    opacity: 0.5;
    filter: alpha(opacity=50);
}

#form input[type="submit"] {
  color: #fff;
  font-size: 4.0rem;
  font-weight: 600;
  text-align: center;
  width: 80%;
  padding: 3% 0 3% 0;
  display: block;
  margin: 20px auto 0;
  background: #ff4200;
  box-shadow:0px 5px 0px 0px #ad1c00;
}

#privacy{
	margin: 10% auto 0 auto;
	width: 94.666%;
	border: 0.2em solid #dddddd;
	box-sizing: border-box;
	padding: 5% 3% 5% 3%;
	font-size: 2.6rem;
	line-height: 160%;
	color: #262626;
}
#privacy p{
	margin-bottom: 1em;
}
#privacy h3{
	margin: 0 auto 5% auto;
	font-size: 3.4rem;
	text-align: center;
	font-weight: bold;
	color: #262626;
	border-bottom: 0.1em solid #dddddd;
	padding-bottom: 5%;
}
#privacy dl{
	margin:	1em 0 0 0;
}
#privacy dl dd li{
	margin-left: 2em;
	text-indent: -1em;
}
#privacy dl dd address{
	margin-left: 1em;
}
#privacy span{
	display: block;
}
#privacy li:before{
	content: '・';
}

/* thanks-page */
.thanks-comment {
  padding: 35% 0 55% 0;
  text-align: justify;
  font-size: 3.2rem;
  width: 93%;
  display: block;
  margin: 0 auto;
	}
@media screen and (max-height: 414px){
.thanks-comment {
  padding: 0;
  text-align: justify;
  font-size: 2.4rem;
  width: 93%;
  display: block;
  margin: 0 auto;
	}
.thanks-comment  p{
  margin-top: 0.5em;
	}	
}

.thanks {
  position: fixed;
  bottom: 0;
  right: 0;
  left: 0;
	z-index: 98;
}

.thanks .copyright{
  position: relative;
  bottom: 0;
  right: 0;
  left: 0;
}

.thanks .footer_nav  {
  position: unset;
}