@charset "utf-8";
/* CSS Document */
p, table, blockquote, address, pre, iframe, form, figure, dl, h1, h2, h3, h4, h5, h6, li {
  margin: 0;
  padding: 0;
  line-height: 0;
}
header {
  padding: 24px 3% 0 3%;
}
.outer {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 640px;
  text-align: center;
}
.sec02__wrap {
  background: #f1a4b8;
  padding: 46px 3%;
}
.sec03__wrap {
  padding: 120px 5%;
}
.sec03__wrap iframe {
  margin-top: 90px;
}
.sec04__wrap {
  padding: 70px 3% 120px 3%;
  background: #fdf0f3;
}
.sec04__wrap .ttl {
  position: relative;
  z-index: 1;
}
.mt-20 {
  margin-top: -20px;
}
.sec04_sub__wrap {
  padding: 0 3% 65px 3%;
  margin-top: -12px;
}
.sec05__wrap {
  background: #f3adbf;
  padding: 0 3% 90px 3%;
}
.sec05__wrap .img01 img {
  margin-top: -30px;
}
.sec06__wrap {
  padding: 90px 3% 80px 3%;
}
.sec07__wrap {
  padding: 100px 3%;
  position: relative;
  background: #ffeeee;
}
.sec07__wrap .arrow {
  position: absolute;
  left: calc(50% - 31.5px);
  bottom: -10px;
}
.slick-prev, .slick-next {
  top: 56% !important;
  width: 58px !important;
  height: 142px !important;
  z-index: 9999 !important;
}
.slick-prev {
  left: 5px !important;
}
.slick-next {
  right: 5px !important;
}
.slick-prev:before, .slick-next:before {
  content: '' !important;
  background: url(../images/salons/arrow_left.png) no-repeat;
  width: 58px;
  height: 142px;
  display: block;
}
.slick-next:before {
  background: url("../images/salons/arrow_right.png") no-repeat;
}
.slick-list.draggable {
  max-width: 679px;
  margin: 60px auto;
}
.slick-dots {
  bottom: 0 !important;
}
.slick-dots li button:before {
  font-size: 20px !important;
}
.slick-dots li {
  margin: 0 15px !important;
}
.slick-dots li.slick-active button:before {
  color: #9f8a80 !important;
}
.slick-dotted.slick-slider {
  margin-bottom: 0px !important;
}
.sec08__wrap {
  padding: 100px 3%;
}
.sec09__wrap {
  padding: 0px 3% 70px 3%;
  background: rgb(239, 244, 251);
  background: linear-gradient(90deg, rgba(239, 244, 251, 1) 0%, rgba(252, 243, 244, 1) 100%);
}
.sec09__wrap img {
  margin-top: -40px;
}
.sec10__wrap {
  padding: 130px 3% 0px 3%;
}
.faq {
  margin-top: 100px;
  text-align: left;
  color: #333333;
}
.faq dt {
  font-weight: 900;
  font-family: 'Noto Sans JP';
  line-height: 1.4;
  /*border-top: 2px solid #333333;*/
  padding-top: 40px;
  padding-left: 80px;
  background: url("../images/salons/icon_q.png") no-repeat left top 30px;
  min-height: 100px;
}
.faq dd {
  font-family: 'Noto Sans JP';
  line-height: 1.4;
  border-bottom: 2px solid #333333;
  padding-top: 10px;
  padding-bottom: 40px;
  margin-top: 20px;
  padding-left: 80px;
  background: url("../images/salons/icon_a.png") no-repeat left top;
}
footer {
  background: #cacaca;
  padding: 40px 5% 260px 5%;
  text-align: center;
  font-size: 1.4rem;
  margin-top: 40px;
}
footer p, address, .fix_contact p {
  line-height: 1.4;
}
footer a {
  text-decoration: underline;
}
address {
  margin-top: 30px;
}
.fix_contact {
  background: #e96d8c;
  padding: 20px 5%;
  color: #fff;
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  box-sizing: border-box;
  text-align: center;
  font-size: 2.4rem;
  z-index: 9999;
}
.fix_contact .btn {
    display: flex;
    justify-content: center;
	align-items: center;
    grid-column-gap: 15px;
    max-width: 640px;
    margin: 10px auto 0 auto;
}
.fix_contact .btn li:nth-child(2) {
	line-height: 1.5em;
	font-size: 0.9em;
	font-weight: 700;
	text-align: left;
	display: inline-block;
	width: auto;
}
.fix_contact .btns {
	display: flex;
	justify-content: space-between;
	max-width: 640px;
	margin: auto;
}
.fix_contact .btns li {
	width: 48%;
	line-height: 1.8em;
	font-size: 20px;
	font-weight: 600;
}
.fix_contact .btns li br {
	display: none;
}
.fix_contact .btns li a {
	display: block;
}
.fix_contact .btns li img {
	margin-top: 5px;
}
@media screen and (max-width: 620px){
	.fix_contact .btns li {
		line-height: 1.4em;
		font-size: 16px;
	}
	.fix_contact .btns li br {
		display: block;
	}
	.fix_contact .btns li img {
		margin-top: 10px;
	}
}
@media screen and (max-width: 620px) {
  .sec03__wrap iframe {
    height: 200px;
  }
  .mt20 {
    margin-top: 10px;
  }
  .mt30 {
    margin-top: 15px;
  }
  .mt40 {
    margin-top: 20px;
  }
  .mt60 {
    margin-top: 30px;
  }
  .mt70 {
    margin-top: 35px;
  }
  header {
    padding: 12px 3% 0 3%;
  }
  .sec02__wrap {
    padding: 23px 3%;
  }
  .sec03__wrap {
    padding: 60px 7%;
  }
  .sec03__wrap iframe {
    margin-top: 45px;
  }
  .sec03__wrap .ttl img {
    max-width: 77%;
  }
  .sec04__wrap {
    padding: 35px 5% 60px 5%;
  }
  .mt-20 {
    margin-top: -15px;
  }
  .sec04_sub__wrap {
    padding: 0 5% 35px 5%;
    margin-top: -8px;
  }
  .sec05__wrap {
    padding: 0 5% 45px 5%;
  }
  .sec05__wrap .img01 img {
    margin-top: -15px;
  }
  .sec06__wrap {
    padding: 45px 3% 40px 3%;
  }
  .sec07__wrap {
    padding: 50px 5%;
  }
  .sec07__wrap .arrow {
    left: calc(50% - 15.5px);
    width: 31.5px;
  }
  .slick-prev, .slick-next {
    top: 51% !important;
    width: 29px !important;
    height: 71px !important;
  }
  .slick-prev {
    left: 0px !important;
  }
  .slick-next {
    right: 0px !important;
  }
  .slick-prev:before, .slick-next:before {
    background: url(../images/salons/arrow_left.png) no-repeat;
    background-size: 29px auto;
    width: 29px;
    height: 71px;
  }
  .slick-next:before {
    background: url("../images/salons/arrow_right.png") no-repeat;
    background-size: 29px auto;
  }
  .slick-list.draggable {
    margin: 30px auto;
  }
  .slick-dots li button:before {
    font-size: 12px !important;
  }
  .slick-dots li {
    margin: 0 4px !important;
  }
  .sec08__wrap {
    padding: 50px 5%;
  }
  .sec08__wrap .ttl img {
    max-width: 60%;
  }
  .sec09__wrap {
    padding: 0px 5% 35px 5%;
  }
  .sec09__wrap img {
    margin-top: -20px;
  }
  .sec10__wrap {
    padding: 65px 5% 0px 5%;
  }
  .sec10__wrap .ttl img {
    max-width: 60%;
  }
  .faq {
    margin-top: 50px;
    font-size: 1.6rem;
  }
  .faq dt {
    padding-top: 15px;
    padding-left: 50px;
    background: url("../images/salons/icon_q.png") no-repeat left top 15px;
    background-size: 34px auto;
    min-height: 50px;
  }
  .faq dd {
    padding-top: 0;
    padding-bottom: 20px;
    margin-top: 10px;
    padding-left: 50px;
    background: url("../images/salons/icon_a.png") no-repeat left top;
    background-size: 34px auto;
  }
  footer {
    padding: 20px 5% 30vw 5%;
    font-size: 1.3rem;
    margin-top: 20px;
  }
  address {
    margin-top: 15px;
  }
  .fix_contact {
    padding: 15px 5%;
    font-size: 1.2rem;
  }
  .fix_contact .btn {
    grid-column-gap: 10px;
    margin-top: 0;
  }
  .fix_contact .btn li {
	width: 48%;
  }
  .txt_s {
    font-size: 1.3rem !important;
  }
}
/* contact */
.bg_contact *, .errow * {
  line-height: inherit;
}
.bg_contact {
  background: linear-gradient(90deg, rgba(239, 244, 251, 1) 0%, rgba(252, 243, 244, 1) 100%);
  margin-top: 15px;
  padding: 60px 45px;
}
.contact__wrap {
  background: #fff;
  padding: 80px 40px;
}
.contact__wrap a {
  color: #007194;
  text-decoration: underline;
}
.contact__form {
  border-top: 2px solid #cacaca;
  margin-top: 50px;
  padding-top: 50px;
  text-align: left;
}
.requirement {
  color: #ff0000;
  margin-left: 5px;
}
input[type=text], select, textarea {
  background: #f5f0f0;
  width: 100%;
  box-sizing: border-box;
  padding: 10px 20px;
}
select {
  border-radius: 100px;
  padding: 20px 30px;
  font-size: 2.0rem;
}
.contact__form dl {
  margin-bottom: 40px;
}
.contact__form dt {
  margin-bottom: 10px;
}
.gray__box {
  border: 1.5px solid #cacaca;
  height: 300px;
  overflow-y: scroll;
  padding: 20px;
  font-size: 1.4rem;
}
input[type=submit], input[type=button] {
  background: #163667;
  font-weight: 900;
  color: #fff;
  font-family: 'Noto Sans JP';
  padding: 15px;
  width: 100%;
}
@media screen and (max-width: 620px) {
  input[type=image] {
    width: 100%;
  }
  .bg_contact {
    margin-top: 8px;
    padding: 30px 22px;
  }
  .bg_contact p {
    font-size: 1.6rem;
  }
  .contact__wrap {
    padding: 40px 20px;
  }
  .contact__wrap img {
    max-width: 80%;
  }
  .contact__wrap .ttl img {
    max-width: 75%;
  }
  .contact__form {
    margin-top: 25px;
    padding-top: 25px;
  }
  .requirement {
    margin-left: 3px;
  }
  input[type=text], select, textarea {
    padding: 5px;
    font-size: 1.4rem;
  }
  select {
    padding: 7px 15px;
  }
  .contact__form dl {
    margin-bottom: 20px;
  }
  .contact__form dt {
    margin-bottom: 5px;
  }
  .gray__box {
    height: 150px;
    padding: 10px;
    font-size: 1.2rem;
  }
  p.pry {
    font-size: 1.2rem;
  }
}
/* 矢印 */
select {
  -webkit-appearance: none;
  appearance: none; /* デフォルトの矢印を非表示 */
}
select::-ms-expand {
  display: none; /* デフォルトの矢印を非表示(IE用) */
}
/* セレクトボックスの矢印デザイン変更 */
.select {
  position: relative;
}
.select::before {
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 12.5px solid #e96d8c;
  content: "";
  position: absolute;
  right: 26px;
  top: 21px;
  width: 0;
}
@media screen and (max-width: 620px) {
  .select::before {
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 7.5px solid #e96d8c;
    right: 16px;
    top: calc(50% - 1px);
  }
}
/* ボタン */
.cvbtn img {
	animation: btn_anime 0.5s ease 0s infinite alternate;
	transform-origin:center;
}
@keyframes btn_anime {
  from {
    transform: scale(0.9,0.9);
  }
  to {
    transform: scale(1,1);
  }
}
/* お客様にもご満足いただけます */
.medical_quality {
	background: url("../images/salons/quality_bg.jpg") center top no-repeat;
	background-size: cover;
	padding-top: 24px;
	padding-bottom: 13px;
}
.medical_quality .inbox {
	width: 90%;
	margin: auto;
}
.medical_quality h3 {
	padding-bottom: 18px;
}
.medical_quality ul {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.medical_quality ul li {
	display: block;
	width: 49.4%;
	padding-bottom: 8px;
}
.salon_name {
	background: #FDF1F5;
	padding: 33px 0;
}
.salon_name h3 {
	width: 54%;
	margin: auto;
}
.needs {
	background: url("../images/salons/needs_bg.jpg") center top no-repeat;
	background-size: cover;
	padding:33px 0;
}
.needs .inbox {
	width: 90%;
	margin: auto;
	text-align: center;
}
.needs h3 {
	width: 76%;
	margin: auto;
	padding-bottom: 28px;
}
.needs p {
	font-size: 28px;
	font-family: 'Noto Sans JP';
	font-weight: 500;
	color: #926E3A;
	line-height: 2em;
	padding-bottom: 30px;
}
@media screen and (max-width: 620px) {
	.needs p {
		font-size: 16px;
	}
}
.salontype {
	background: url("../images/salons/salon_bg.jpg") center top no-repeat;
	background-size: cover;
	padding-top: 24px;
	padding-bottom: 3px;
}
.salontype ul {
	width: 85%;
	margin: auto;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.salontype ul li {
	display: block;
	width: 31.25%;
	padding-bottom: 16px;
}
.inventory_risk {
	background: #F6CAD5;
	padding: 32px 0;
}
.inventory_risk .inbox {
	width: 90%;
	margin: auto;
	background: #fff;
	border-radius: 16px;
	padding-top: 15px;
	padding-bottom: 25px;
	text-align: center;
}
.inventory_risk h3 {
	width: 66%;
	margin: auto;
	padding-bottom: 15px;
}
.inventory_risk h4 {
	font-family: 'Noto Sans JP';
	font-size: 20px;
	font-weight: 400;
	line-height: 2em;
	color: #163667;
	padding-bottom: 15px;
}
.inventory_risk h4 b {
	font-size: 28px;
	font-weight: 700;
	display: block;
}
.inventory_risk p {
	color: #163667;
	font-size: 16px;
	line-height: 1.5em;
}
@media screen and (max-width: 620px) {
	.inventory_risk h4 {
		font-size: 14px;
		padding-bottom: 10px;
	}
	.inventory_risk h4 b {
		font-size: 18px;
	}
	.inventory_risk p {
		font-size: 12px;
	}
}
.self_whitening {
	background: #E2F1F5;
}
.self_whitening .lead {
	background: #fff;
	text-align: center;
	padding: 30px 0;
}
.self_whitening .lead h4 {
	width: 63.2%;
	margin: auto;
	padding-bottom: 16px;
}
.self_whitening .lead p {
	font-family: 'Noto Sans JP';
	font-size: 30px;
	font-weight: 700;
	color: #AB1459;
	line-height: 2em;
}
.self_whitening .inbox {
	padding-top: 32px;
	padding-bottom: 40px;
	width: 90%;
	margin: auto;
}
.self_whitening .inbox img {
	display: block;
	margin-bottom: 24px;
}
.self_whitening .inbox p {
	font-family: 'Noto Sans JP';
	font-size: 18px;
	font-weight: 400;
	line-height: 2em;
	text-align: left;
}
.self_whitening .inbox p b {
	font-weight: 700;
	color: #AB1459;
}
.self_whitening .inbox p:first-of-type {
	padding-bottom: 38px;
}
.self_whitening .inbox a {
	display: block;
	width: 87%;
	margin: 50px auto 0 auto;
}
@media screen and (max-width: 620px) {
	.self_whitening .lead p {
		font-size: 18px;
	}
	.self_whitening .inbox p {
		font-size: 15px;
	}
	.self_whitening .inbox a {
		margin-top: 30px;
	}
}