@charset "utf-8";
/* ----------------------------------------
 page-cmn
------------------------------------------- */
.left-img{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.left-img .box01{
  width: 40%;
}
.left-img .box02{
  width: 55%;
}
.img-border{
border: 1px solid #ccc;
}

/*品目テーブル*/
.hinmoku{
	width:100%;
	
}

.thead{
	margin-top:5%;
	background-color:#203563;
	color:#fff;
	padding:2%;
	width:100%;
}

.hinmoku td{
	border:solid 1px #ccc;
	padding:2%;
}

/*item-box*/
.item-box {
	display:flex;
	flex-wrap: wrap;
	align-content: center;
	
}
.item-box li{
	width:24%;
	margin-right:1%;
	margin-top:2%;
	margin-bottom:2%;
	text-align:center;

	
}
.item-box h3{
	margin-top:1%;
}
/* ----------------------------------------
 faq
------------------------------------------- */
#faq ul li{
  border-bottom: 1px dotted #ccc;
  padding-bottom: 30px;
  margin-bottom: 30px;
}
#faq ul li:last-child{
  border-bottom: none;
  padding-bottom: 0;
  margin-bottom: 0;
}
#faq ul li h3{
position: relative;
font-size: 1.8rem;
font-weight: 500;
padding-left: 4.5em;
margin-bottom: 40px;
}
#faq ul li h3 span{
position: absolute;
display: inline-block;
color: #a11410;
font-size: 3.6rem;
font-weight: 500;
line-height: 1;
top: -3px;
left: 0;
}
#faq ul li p{
position: relative;
padding-left: 4.5em;
margin-left: 40px;
}
#faq ul li p span{
position: absolute;
display: inline-block;
color: #203763;
font-size: 3.6rem;
font-weight: 500;
line-height: 1;
top: -3px;
left: 0;
}


/* ----------------------------------------
 flow
------------------------------------------- */
.flow .box01{
  position: relative;
}

.flow li:last-child{
  margin-bottom: 0;
}
.flow .box01::after{
  position: absolute;
  display: block;
  font-family: 'Lato', sans-serif;
  color: #ef7802;
  font-size: 8rem;
  font-weight: 700;
  line-height: 1;
  top: -0.5em;
  left: 0;
  z-index: 100;
}
.flow li:nth-child(1) .box01::after{
  content: "1";
}
.flow li:nth-child(2) .box01::after{
  content: "2";
}
.flow li:nth-child(3) .box01::after{
  content: "3";
}
.flow li:nth-child(4) .box01::after{
  content: "4";
}
.flow li:nth-child(5) .box01::after{
  content: "5";
}
.flow li:nth-child(6) .box01::after{
  content: "6";
}

.flow{
	display:flex;
	justify-content: space-between;
	flex-wrap:wrap;
}

.flow li{
  width:30%;
  margin-bottom: 60px;
  dislay:block;
}
/* ----------------------------------------
 faq
------------------------------------------- */
.faq {
  border: 1px solid #aaabab;
  padding: 80px;
}
.faq li {
  border-bottom: 1px solid #aaabab;
  margin-bottom: 30px;
  padding-bottom: 30px;
}
.faq li:last-child {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
}
.faq dt {
  position: relative;
  font-size: 2.0rem;
  font-weight: 700;
  line-height: 1.6;
  padding: 10px 0 0 70px;
  margin-bottom: 30px;
}
.faq dd {
  position: relative;
  line-height: 1.6;
  padding: 10px 0 0 70px;
}
.faq dt::before {
  position: absolute;
  content: "Q";
  display: block;
  top: 0;
  left: 0;
  font-size: 30px;
  font-weight: 700;
  text-align: center;
  vertical-align: middle;
  line-height: 50px;
  width: 55px;
  height: 55px;
  border-radius: 55px;
  color: #fff;
  background-color: #ef7802;
}
.faq dd::before {
  position: absolute;
  content: "A";
  display: block;
  top: 0;
  left: 0;
  font-size: 30px;
  font-weight: 700;
  text-align: center;
  vertical-align: middle;
  line-height: 50px;
  width: 55px;
  height: 55px;
  border-radius: 55px;
  color: #fff;
  background-color: #444649;
}
/* ----------------------------------------
 table
------------------------------------------- */
.office-table{
width: 100%;
}
.office-table th{
width: 25%;
}
.office-table th,.office-table td{
box-sizing: border-box;
font-weight: 400;
text-align: left;
vertical-align: top;
line-height: 1.6;
border-bottom: 1px solid #ccc;
padding: 15px 0;
}
.office-table tr:last-child th,.office-table tr:last-child td{
border-bottom: none;
}
/* ----------------------------------------
 cmn-list
------------------------------------------- */
.cmn-list01 {
  list-style: none;
  margin-left: 2em;
  margin-bottom: 30px;
}
.cmn-list01 li {
  position: relative;
  text-indent: -1em;
  margin-bottom: 15px;
}
.cmn-list02 {
  list-style: none;
  margin-left: 2.5em;
  margin-bottom: 30px;
}
.cmn-list02 li {
  position: relative;
  text-indent: -1.5em;
  margin-bottom: 15px;
}
/* ----------------------------------------
 balloon
------------------------------------------- */
.balloon-top {
  position: relative;
  display: block;
  margin: 50px auto 0 auto;
  padding: 7px 10px;
  box-sizing: border-box;
  width: 100%;
  max-width: 1000px;
  color: #fff;
  background: #ef7802;
}
.balloon-top:before {
  content: "";
  position: absolute;
  top: -28px;
  left: 50%;
  margin-left: -15px;
  border: 15px solid transparent;
  border-bottom: 15px solid #ef7802;
}
.balloon-top p {
  font-size: 3rem;
  font-weight: 700;
  text-align: center;
  margin: 0;
  padding: 0;
}
/* ----------------------------------------
 check-list
------------------------------------------- */
.check-list li{
  font-size: 2rem;
  line-height: 36px;
  border-bottom: 1px dotted #ccc;
  background: url("../images/infidelity-images/check.png") 0 3px no-repeat;
  background-size: 33px auto;
  padding-left: 40px;
  padding-bottom: 5px;
  margin-bottom: 5px;
}
/* ----------------------------------------
 price
------------------------------------------- */
.price{
  display: flex;
  flex-wrap: wrap;
}
.price li{
  width: 31%;
  box-sizing: border-box;
  border: 1px solid #aaabab;
  margin-right: 3.5%;
  padding: 30px;
}
.price li:nth-child(3n){
  margin-right: 0;
}
.price li h3{
  font-size: 2rem;
  text-align: center;
  border-bottom: 1px solid #aaabab;
  padding-bottom: 10px;
}
.price li h4{
  font-size: 2rem;
  text-align: right;
  border-top: 1px solid #aaabab;
  padding-top: 10px;
}
.price li table{
  width: 100%;
}
.price li table th{
  width: 50%;
  text-align: left;
}
.price li table td{
  text-align: right;
}
.price li table th,.price li table td{
  box-sizing: border-box;
  border-bottom: 1px solid #aaabab;
  padding: 10px 0;
}

/* =======================
  PC
======================== */
@media screen and (min-width: 1400px) {
}
/* =======================
  TABLET
======================== */
@media screen and (max-width:1399px) {
}
/* =======================
  SP
======================== */
@media screen and (max-width: 799px) {
/* ----------------------------------------
 page-cmn
------------------------------------------- */
.left-img .box01{
  width: 100%;
  margin-bottom: 30px;
}
.left-img .box02{
  width: 100%;
}
/* ----------------------------------------
 flow
------------------------------------------- */
.flow .box01{
  position: relative;
}

.flow li:last-child{
  margin-bottom: 0;
}
.flow .box01::after{
  font-size: 6rem;
  top: -0.5em;
}
.flow li{
  width:98%;
  margin-bottom: 60px;
  dislay:block;
}
  /* ----------------------------------------
 faq
------------------------------------------- */
  .faq {
    padding: 30px;
  }
  .faq li {
    margin-bottom: 30px;
    padding-bottom: 30px;
  }
  .faq li:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
  }
  .faq dt {
    font-size: 1.6rem;
    padding: 0 0 0 40px;
    margin-bottom: 15px;
  }
  .faq dd {
    line-height: 1.5;
    padding: 0 0 0 40px;
  }
  .faq dt::before {
    font-size: 20px;
    line-height: 30px;
    width: 35px;
    height: 35px;
    border-radius: 35px;
  }
  .faq dd::before {
    font-size: 20px;
    line-height: 30px;
    width: 35px;
    height: 35px;
    border-radius: 35px;
  }
/* ----------------------------------------
 balloon
------------------------------------------- */
.balloon-top {
  margin: 50px auto 0 auto;
  padding: 7px 10px;
}
.balloon-top p {
  font-size: 1.6rem;
}
/* ----------------------------------------
 check-list
------------------------------------------- */
.check-list li{
  font-size: 1.7rem;
  line-height: 26px;
  background-size: 20px auto;
  padding-left: 30px;
}
/* ----------------------------------------
 price
------------------------------------------- */
.price li{
  width: 100%;
  margin-right: 0;
  padding: 20px;
  margin-bottom: 30px;
}
.price li:nth-child(3n){
  margin-right: 0;
}
.price li h3{
  font-size: 1.7rem;
  padding-bottom: 10px;
}
.price li h4{
  font-size: 1.7rem;
  padding-bottom: 10px;
}
.price li table th,.price li table td{
  padding: 10px 0;
}
/* ----------------------------------------
 faq
------------------------------------------- */
#faq ul li{
  padding-bottom: 20px;
  margin-bottom: 20px;
}
#faq ul li:last-child{
  border-bottom: none;
  padding-bottom: 0;
  margin-bottom: 0;
}
#faq ul li h3{
position: relative;
font-size: 1.5rem;
padding-left: 3.5em;
margin-bottom: 20px;
}
#faq ul li h3 span{
font-size: 2.4rem;
top: -3px;
left: 0;
}
#faq ul li p{
padding-left: 3.5em;
margin-left: 0;
}
#faq ul li p span{
font-size: 2.4rem;
top: -3px;
left: 0;
}
	
.item-box li{
	width:45%;
	margin-right:3%;
	margin-top:2%;
	margin-bottom:2%;
	text-align:center;

	
}
}