*,
*:before,
*:after {
  -webkit-box-sizing: inherit;
  box-sizing: inherit;
}

html {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 62.5%;/*rem算出をしやすくするために*/
}

body{
	font-family:'Noto Sans JP', sans-serif;
}

.btn,
a.btn,
button.btn {
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  padding: 1rem 4rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #fff;
  border-radius: 1.5rem;
}

/* swiper */

.swiper-container {
    padding: 30px 0 50px;
    background: #eeeeee;
}

    .s-fade-wrap {
    position: relative;
    max-width: 640px;
    margin: 0 auto;
}

.s-fade-text {
    position: absolute;
    top: 20%;
    left: 0;
    width: 100%;
    text-align: center;
    color: white;
    font-size: 5vw;
}

.swiper-slide-active .s-fade-text {
    animation: slideTextFade 1.75s ease 0s 1 normal;
}

@keyframes slideTextFade {
    0%, 25% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

/* アコーディオン */
.toggle_contents {
	border: 1px solid #d9d9d9;
	border-radius: 40px;
	width: 1100px;
	margin: 0 auto;
	background-color: #e22469;
	
}
.toggle_title {
	position: relative;
	padding: 15px;
	cursor: pointer;
	font-size: 16px;
	text-align: center;
	line-height: 1.4;
	color: white;
	margin-top: -1px;
}
.toggle_btn {
	position: absolute;
	top: 50%;
	right: 20px;
	transform: translateY(-50%);
	background: #e22469;
	display: block;
	width: 24px;
	height: 24px;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	border-radius: 50%;
}
.toggle_btn:before, .toggle_btn:after {
	display: block;
	content: '';
	background-color: #fff;
	position: absolute;
	width: 10px;
	height: 2px;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
.toggle_btn:before {
	width: 2px;
	height: 10px;
}
.toggle_title.selected .toggle_btn:before {
	content: normal;
}
.toggle_contents dd {
	display: none;
}


/* カギかっこ */
.frame-box-001 {
	padding: 30px;
	position: relative;
}

.frame-box-001::before, .frame-box-001::after {
	content: '';
	width: 30px;
	height: 30px;
	position: absolute;
}

.frame-box-001::before {
	/* border-left: solid 2px #000000; */
	border-image: linear-gradient(to left, #e0d08b,  #f2728d) 1;
	border-left: solid 3px #000000;
	border-top: solid 3px #000000;
	border-bottom: none;
    border-right: none;
	top: 0;
	left: 0;
	height: 50px;
}

.frame-box-001::after {
	border-image: linear-gradient(to right, #e0d08b,  #f2728d) 1;
	border-right: solid 3px #000000;
	border-bottom: solid 3px #000000;
	border-left: none;
    border-top: none;
	bottom: 0;
	right: 0;
	height: 50px;
}

/* ホバーボタン設定 */

.btn-square-soft {
	margin-top: 10px;
	display: inline-block;
	position: relative;
	text-decoration: none;
	color: #fff;
	width: 207px;
	height: 70px;
	line-height: 70px;
	border-radius: 15px;
	text-align: center;
	overflow: hidden;
	font-weight: bold;
	background: linear-gradient(#9dc7f6 0%, #5097E7 100%);
	/* text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.66); */
	box-shadow: 0 1px 1px rgba(0, 0, 0, 0.28);
  }
  
  .btn-square-soft:active {
	/*押したとき*/
	-webkit-transform: translateY(2px);
	transform: translateY(2px);/*沈むように*/
	box-shadow: 0 0 1px rgba(0, 0, 0, 0.15);
	background-image: linear-gradient(#9dc7f6 0%, # 100%);/*グラデーションを明るく*/
  }

.btn-square-soft-gr {
	margin-top: 10px;
	margin-left: 15px;
	display: inline-block;
	position: relative;
	text-decoration: none;
	color: #fff;
	width: 458px;
	height: 70px;
	line-height: 70px;
	border-radius: 15px;
	text-align: center;
	overflow: hidden;
	font-weight: bold;
	background: linear-gradient(#53e653 0%, #00CA00 100%);
	/* text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.66); */
	box-shadow: 0 1px 1px rgba(0, 0, 0, 0.28);
  }
  
  .btn-square-soft-gr:active {
	/*押したとき*/
	-webkit-transform: translateY(2px);
	transform: translateY(2px);/*沈むように*/
	box-shadow: 0 0 1px rgba(0, 0, 0, 0.15);
	background-image: linear-gradient(#53e653 0%, #00CA00 100%);/*グラデーションを明るく*/
  }

  .round_arrow > span {
	top: -15%;
    left: -5%;
	color: #6BC61E;
    font-size: 1.6rem;
    background-color: #fff;
    border-radius: 10px;
    line-height: 25px;
    width: 82px;
	padding-top: 2px;
	padding-bottom: 2px;
	position: absolute;
  }
  .round_arrow span >span{
	margin-top: 0;
	font-size: 2.2rem;
  }
  .round_arrow {
	position: relative;
	padding-left: 50px;
  }
   
  .round_arrow::before { /* 背景の表示設定 */
	content: "";
	position: absolute;
	margin: auto;
	top: 0;
	bottom: -3px;
	right: -15px;
	top:5px;
	width: 23px; /* 横幅 */
	height: 23px; /* 高さ */
	border-radius: 50%; /* 角の丸み */
	background: #00CA00;
	border: 2px solid #fff;
  }
   
  .round_arrow::after { /* くの字の表示設定 */
	content: "";
	position: absolute;
	margin: auto;
	top: 0;
	bottom: -13px;
	right: -7px;
	top: -7px;
	width: 10px;
	height: 10px;
	border-top: 3px solid #fff;
	border-right: 3px solid #fff;
	transform: rotate(45deg);
  }

  
a.btn--pink {
	color: #fff;
	background-color: #e22469;
  }
  
  a.btn--pink:hover {
	color: #fff;
	background: #f2728d;
  }
  
  a.btn--pink.btn--cubic {
	border-bottom: 5px solid #f2728d;
	width: 267px;
  }
  
  a.btn--pink.btn--cubic:hover {
	margin-top: 3px;
	border-bottom: 2px solid #f2728d;
  }
  
  a.btn-c {
	font-size: 2rem;
	position: relative;
	padding: 1.5rem 3rem 1.5rem 2rem;
	border-radius: 100vh;
  }
  
  a.btn-c i.fa {
	margin-right: 1rem;
  }

  .triangle {
	float: right;
	display: inherit;
	background: #ffffff;
	height: calc(tan(60deg) * 16px / 2);
	width: 16px;
	clip-path: polygon(0 0, 100% 0, 50% 100%);
	margin-top: 8px;
  }

/* リボン風見出し */
  h2.ribbon {
	top: -20px;
    left: 105px;
	position: absolute;
	height: 60px;
	margin: 0 auto;
	padding: 0 2rem;
	text-align: center;
	color: #fff;
	background: #e22469;
	width: 700px;
	margin-bottom:25px;

  }
  
  h2.ribbon:before,
  h2.ribbon:after {
	position: absolute;
	top: 0;
	display: block;
	height: 48px;
	content: '';
	border: 30px solid #e22469;
  }
  
  h2.ribbon:before {
	left: -40px;
	border-left-width: 15px;
	border-left-color: transparent;
  }
  
  h2.ribbon:after {
	right: -40px;
	border-right-width: 15px;
	border-right-color: transparent;
  }
  
  h2.ribbon span {
	position: relative;
	display: block;
	font-size:3.6rem;
  }
/* PCレイアウト */
@media screen and (min-width: 767px) {
	.white_back{
		background-color: #FFF;
		padding:5px 10px;
		border-radius: 5px;
		color: #F2728D;
		font-weight: bold;
		font-size: 1.6rem;
		width: 104px;
	}

	.header_link_area > table{
		margin: 0 auto;
		max-width: 689px;
	}

	.header_link_area > table >tbody > tr > td > span:nth-of-type(1) {
		margin-right:5px;
	}

	.header_link_area > table >tbody > tr > td > p {
		display:inline;
		font-size:3.0rem;
	}

	.one_month {
		color: #5097E7;
		text-stroke-color: 1px #FFF; 
		-webkit-text-stroke: 1px #FFF;
		font-size: 3.8rem;
		font-weight: bold;
	}

	.header_link_area{
		color: #fff;
		background-color: #f2728d;
		height: auto;
		text-align: center;
		font-size: 2.6rem;
		padding-bottom: 15px;
	}    

	.header_link_area > table > tr > td > button{
		display: inline-block;
		font-size: 	26px;
	}

	/* ボタン本体 */
	.header_link_area table tr td a.btn {
		font-size: 2.6rem;
		display: inline-block;
		padding-top: 13px;
		/* padding: 0.8em 3em; */
		background: linear-gradient(#a5c7ee 0%, #5097E7 100%); /* 背景色 */
		box-shadow: 0 5px 0 #3d70ab; /* 影の太さ・色 */
		border-radius: 0.5em;
		color: #fff;
		cursor: pointer;
		text-decoration: none; /* 文字の下線を消す */
		height: 70px;
		width:207px;
	}
	.header_link_area table tr td:nth-of-type(2) a.btn {
		position: relative;
		font-size: 2.6rem;
		display: inline-block;
		padding-top: 13px;
		margin-left: 23px;
		/* padding: 0.8em 3em; */
		background: linear-gradient(#61bf61 0%, #00CA00 100%); /* 背景色 */
		box-shadow: 0 5px 0 #029302; /* 影の太さ・色 */
		border-radius: 0.5em;
		color: #fff;
		cursor: pointer;
		text-decoration: none; /* 文字の下線を消す */
		height: 70px;
		width:458px;
	}
	
	/* ホバー時 */
	.header_link_area table tr td a.btn:hover {
		box-shadow: none;
		transform: translateY(5px);
	}
	
	/* クリック時 */
	.header_link_area table tr td a.btn:active {
		box-shadow: none;
		transform: translateY(5px);
	}

	/* box01 */

	.box01{
		background-image: url(https://repittebeauty.cnctor.jp/wp-content/themes/repitte-b/images/box01_bg.png);
		background-position: inherit;
		background-size: cover;
		background-repeat: no-repeat;
		padding-bottom: 30px;
	}
	
	.box01 > div {
		margin:0 auto;
		padding-top: 30px;
		max-width: 80%;
	}

	.box01 > div > img {
		margin: 0 auto;
	}

	.box01 > div > img:nth-of-type(1){
		margin-bottom: 60px;
	}
	.box01 > div > img:nth-of-type(2){
		margin-bottom: 60px;
	}

	/* box02 */

	.box02{
		background-image: url("https://repittebeauty.cnctor.jp/wp-content/themes/repitte-b/images/box02_bg.png");
		height: 589px;
		padding-top: 20px;
		padding-bottom: 20px;

	}

	.box02 > div {
		padding-top: 80px;
		max-width: 900px;
		margin: 40px auto;
		background-color: rgba(255, 255, 255, 0.5);
		position: relative;
	}
	
	.box02 > div > img {
		margin: 0 auto;
		margin-bottom: 30px;
	}
	.box02 > div > div:nth-of-type(2) {
		padding-top: 15px;
		margin: 0 auto;
		text-align: center;
	}
	.box02 > div > div > img {
		display: inline
	}
	
	.box02 > div > p {
		font-size: 	1.8rem;
	}

	.box02 > div > p,
	.box02 > div > h2{
		text-align: center;
		font-weight: bold;
	}

	.box02 > div > p:nth-of-type(1) > span {
		background-color: #FFF;
		color: #e22469;
		padding:1px;
	}

	.box02 > div > p:nth-of-type(2){
		font-size: 26px;
	}

	.box02 > div > h2 > span {
		color: #e22469;
	}

	.box02 > div > h2 {
		margin: 0 auto;
		position: relative;
		padding: 0.8rem 0;
		margin-bottom: 0.2rem;
		border-bottom: 2px solid #e22469;
		color: black;
		font-weight: bold;
		font-size: 26px;
		text-align: center;
		width: 300px;
	}

	.box02 > div > h2:before,
	.box02 > div > h2:after {
		position: absolute;
		top: 100%;
		left: 50%;
		content: "";
		height: 0;
		width: 0;
	}

	.box02 > div > h2:before {
		border: 12px solid;
		border-color: transparent;
		border-top-color: #e22469;
		margin-left: -12px;
	}

	.box02 > div > h2:after {
		border: 10px solid;
		border-color: transparent;
		border-top-color: white;
		margin-left: -10px;
	}

	.SNS{ 
		text-align: center;
		padding-bottom: 20px;
	}

	
	/* box03 */

	.box03 {
		background-image: url("https://repittebeauty.cnctor.jp/wp-content/themes/repitte-b/images/box03_bg.png");
		background-position: center;
		background-repeat: no-repeat;
		padding-top: 100px;
		padding-bottom: 100px;
		
	}
	
	.box03 div {
		max-width: 1100px;
		margin: 0 auto;
		text-align: center;
	}


	.box03 > div > div {
		display: flex;
		vertical-align: middle;
		margin-bottom: 60px;
	}

	.box03 > div > div > p {
		padding-left: 15px;
		font-size: 3.8rem;
		line-height: 85px;
		font-weight: bold;
		color: #3a3a3a;
	}

	.box03 > div > p:nth-of-type(1) {
		color:#3A3A3A;
		font-weight: bold;
		font-family:'Noto Sans JP', sans-serif;
		width: 732px;
		margin: 0 auto;
		text-align: center;
		font-size: 3.8rem;
		padding-top: 0;
		padding-bottom: 0;
		margin-bottom: 40px;
	}

	.box03 > div p:nth-of-type(2) {
		color: #3a3a3a;
		margin-top: 16px;
		margin-bottom: 32px;
		font-size: 1.8rem;
		font-weight: bold;
	}

	.box03 > div > img {
		margin: 0 auto;
	}

	/* box04 */

	.case {
	margin: 0 auto;
	}

	.case__list {
	margin: 2rem;
	width:1100px;
	margin: 0 auto;
	}

	.case__item {
		display: flex;
		margin: 11rem auto;
		position: relative;
	}

	.case__item:nth-child(even){
		flex-direction: row-reverse;
	}
	
	.case__item:nth-child(even) table{
		margin-left: 70px;
	}

	.case__item:nth-child(odd) .case__item__img{
		width: 911px;
		position: absolute;
    	left: 55%;
	}
	
	.case__item:nth-child(even) .case__item__img{
		width: 911px;
		position: absolute;
		left: -40%;
		top: -13%;
	}

	.case__item:nth-child(odd) table{
		margin-right: 70px;
	}

	.case__item__text,.case__item__img {
		width: 47%;

	}


	.case__item > table {
		max-width: 548px;

	}
	.case__item > table tr td p span {
		color: #e22469;
	}
	
	.case__item > table > tbody > tr:nth-child(1) td{
		padding-bottom: 15px;
	}
	
		.case__item > table > tbody > tr:nth-child(2) td{
			border-top: 2px solid #DA7280;
			padding-top: 30px;
		}
	
		.case__item > table > tbody > tr:nth-child(2) td h1{
			
			padding-top: 30px;
		}
	
	.case__item > table > tbody > tr:nth-child(1) > td:nth-child(1) img{
		width: 70px;
		margin-top: 10px;
		margin-right: 30px;
	}
	.case__item > table > tbody > tr:nth-child(1) > td:nth-child(2) h1{
		font-size: 3.0rem;
		color: #3a3a3a;
	}
	.case__item > table > tbody > tr:nth-child(2) > td{
		font-size: 1.6rem;
		color: #3a3a3a;
	}

	.case__item > div > p{
		font-size: 1.7rem;
	}

	.case__item > div > img {
		width: auto;
		height: 80px;
	
	}
	.case__item > table {
		font-size: 1.6rem;
		display: flex;
		width: 55%;
		justify-content: flex-end;
	}

	.case__item > table > tr > td:nth-of-type(1) {
		font-size: 1.6rem;
		display: flex;
		width:80px;
	}


	.case__item > div:nth-of-type(2) {
		position: absolute;
		margin-top: 120px;
		width: 450px;
	}
	.case__item:nth-of-type(2) > div:nth-of-type(2) {
		margin-left: -160px;
	}

	.box04 > h2{
		margin-top: 120px;	
		margin-bottom:100px;
		font-size: 4.0rem;
		color: #f2728d;
		font-weight: bold;
		text-align: center;
	}

	.box04 {
		margin-bottom: 120px;
	}

	/* box05 */
	.box05{
		position: relative;
		padding-bottom: 80px;
		background-size: 100% 95%;
		background-position: bottom center;
		background-image: url(https://repittebeauty.cnctor.jp/wp-content/themes/repitte-b/images/box05_bg.png);
		background-repeat: no-repeat;
	}

	.box05 > img {
		width: 100%;
		height: 280px;
		object-fit: none;
		object-position: 52% -25px;
	}


	.box05 > div:nth-of-type(1) {
		margin-top: 0;
	}

	.box05 > div{
		width: 900px;
		margin: 40px auto;
		background-color: #FFF;
		padding: 40px;
	}
	
	.box05 > div > div {
		display: inline-flex;
	}
	
	.box05 > div > div > img {
		width: 400px;
	}
	
	.box05 > div > h1 {
		text-align: center;
		font-size:3.0rem;
		margin-bottom: 40px;
	}

	.box05 > div > h1 > span {
		color: #F2728D;
	}
	
	.box05 > div > div > ul {
		font-size: 1.8rem;
	}
	
	.box05 > div > div > ul > li::marker {
		color:#F2728D;
		font-size: 3.0rem;
	}
	




	/* box06 */
	.dli-plus {
		display: inline-block;
		vertical-align: middle;
		color: #fff;
		line-height: 1;
		width: 0.9em;
		height: 0.09em;
		background: currentColor;
		border-radius: 0.1em;
		position: relative;
		margin-left: 15px;
	  }
	  
	  .dli-plus::before {
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: inherit;
		border-radius: inherit;
		transform: rotate(90deg);
	  }

	.box06{
		background-image: url(https://repittebeauty.cnctor.jp/wp-content/themes/repitte-b/images/box06_bg.png);
		padding-top: 80px;
	}

	.box06 > img {
		margin: 0 auto;
	}

	.box06 > h1 {
		text-align: center;
		font-size: 4.6rem;
		margin-bottom: 60px;
	}

	.box06  ul.slider li div {
		width: 140px;
		background: linear-gradient(#e0b08b 0%, #f2728d 100%);
		color:white;
		border-radius: 25px;
		text-align: center;
		padding: 5px 20px;
		margin: 0 auto;
		font-size: 3.0rem;
	}
	
	.box06 ul.slider li p {
		text-align: center;
		font-size: 2.4rem;
	}

	.box06 div li div{
		display: flex;
		background-color: rgba(255, 255, 255, 0.5);
		height: 50px;
		margin-right: 15px;
		margin-bottom: 15px;
		border-radius: 10px;
	}

	.box06 div img {
		max-width: 1100px;
		margin: 0 auto;
	}

	.job_area {
		position: relative;
	}

	.job_area a{
		position: absolute;
		top:85%;
		left:50%;
		transform: translate(-50%,-50%);
		padding:15px;
		margin:0;
		font-size:1.8rem;
		color: #fff;
	}

	a.btn--red.btn--cubic {
		border-bottom: 5px solid #e22469;
		background-color: #F2728D;
	  }
	  
	  a.btn--red.btn--cubic:hover {
		margin-top: 3px;
		border-bottom: 2px solid #9f000c;
	  }
	  
	  a.btn--radius {
		border-radius: 100vh;
	  }
	  
	  .fa-position-right {
		position: absolute;
		top: calc(50% - .5em);
		right: 1rem;
	  }
	
	.box06 div ul div p{
		font-size:3.0rem;
	}
	
	.box06 div li {
		vertical-align: middle;
	}
	.box06 div li p {
		margin: 0 auto;
		/* margin-left: 5px; */
	}

	.box06 div li div{
		height: auto;
		width: 330px;
		margin: 0 auto;
	}


	/*--------------------------------------
  カード型_01
--------------------------------------*/
.l-wrapper_01 {
	margin: 1rem auto;
	width: 95%;
  }
  
  .l-wrapper_01:hover {
	transform: translateY(-3px);
	box-shadow: 0 7px 14px rgba(50,50,93,.1), 0 3px 6px rgba(0,0,0,.08);
	transition: all .5s;
  }
  
  .card_01 {
	background-color: #fff;
	box-shadow: 0 0 8px rgba(0, 0, 0, .16);
	color: #212121;
	text-decoration: none;
  }
  
  .card__header_01 {
	display: flex;
	flex-wrap: wrap;
  }
  
  .card__title_01 {
	padding: 1rem 1.5rem 0;
	font-size: 1.6rem;
	order: 1;
	margin-bottom: 0.6rem;
	font-weight: bold;
	text-decoration: none;
  }
  
  .card__thumbnail_01 {
	margin: 0;
	order: 0;
  }

  .card__thumbnail_01 img{
	width: 330px;
	height:180px;
	object-fit: cover; 
  }
  
  .card__image_01 {
	width: 100%;
  }
  
  .card__body_01 {
	padding: 0 1.5rem;
  }
  
  .card__text_01 {
	font-size: .8rem;
	text-align:center;
	text-decoration: none;
	padding-bottom: 0;
  }

  .box06 div.job_slider_area {
	padding-top: 60px;
	background-image: url(https://repittebeauty.cnctor.jp/wp-content/themes/repitte-b/images/job_slider_bg.svg);
	background-repeat: no-repeat;
	background-position: center;
	background-size:cover;
  }

  .box06 div.job_slider_area > h1{
	margin-top:60px;
	text-align: center;
	font-size: 46px;
  }
  
	.box06 div ul.slider_job  {
		height: 700px;
		vertical-align: middle;
	} 

  .box06 div ul div p.card__text2_01 {
	font-size: 1.8rem;
	margin-top: 0;
	margin-bottom: 2rem;
  }
  
  .card__text_01 + .card__text_01 {
	margin-top: .5rem;
  }
  
  .card__footer_01 {
	padding: 2rem;
  }
  
  .card__footer_01 p a{
	font-size: 1.8rem;
  }

  a.btn--detail {
	color: #e22469;
	background-color: #fff;
	border: 1px solid #e22469;
	border-bottom: 5px solid #e22469;
	border-radius: 25px;
	margin: 0 auto;
  }

  a.btn--detail:hover {
	margin-top: 3px;
  }
  a.btn--shadow {
	-webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, .3);
	box-shadow: 0 3px 5px rgba(0, 0, 0, .3);
  }
  
  .button_01 {
	display: inline-block;
	text-decoration: none;
	transition: background-color .3s ease-in-out;
	text-align: center;
  }
  
  .button_01 a {
	text-decoration: none;
  }
  
  
  .button_01.-compact:hover,
  .button_01.-compact:focus {
	background-color: #e22469;
	color: #fff;
  }
	/* box07 */
  	.box07 {
		padding-bottom:100px;
		max-width: 1100px;
		margin: 0 auto;
	}

	.box07 ul.slider_tw li.slider_post{
		width: 360px;
	}

	.box07 div{
		/* max-width: 1100px; */
		margin: 0 auto;
	}

	.box07 div table {
		width: 100%;

	}

	.box07 div table td h1{
		font-size: 4.6rem;
		color: #e22469;
	}

	.box07 div table td p{
		font-size: 1.8rem;
	}

	.box07 div table img{
		float: right;
	}


	/* box08 */
	.box08 > div:nth-of-type(1){
		background-image: url(https://repittebeauty.cnctor.jp/wp-content/themes/repitte-b/images/job_list_bg.png);
		background-repeat: no-repeat;
		margin: 0 auto;
		width: 100%;
	}
	
	.box08 > div > h1{
		text-align: center;
		padding-top: 70px;
		margin-bottom: 50px;
		font-size: 3.0rem;
		color: #e22469;
	}
	
	.box08 > div> img {
		margin: 0 auto;
	}
	
	.box08 > div > div {
		max-width: 1100px;
		width: 100%;
		margin: 0 auto;
		text-align: center;
		border: 1px solid #f2728d;
		border-radius: 5px;
		margin-bottom: 10px;
		margin-top: 10px;
		background-color: #fff;
	}
	
	.box08 > div > div > p{
		font-size: 2.4rem;
	}

	.box08 > div > div:nth-of-type(2) > p {
		margin-top: 20px;
		margin-bottom: 20px;
	}

	.box08 > div > div:nth-of-type(1) > p:nth-of-type(2){
		font-family: 'Roboto', sans-serif;
	}
	.box08 > div > div:nth-of-type(1) > p:nth-of-type(1),
	.box08 > div > div:nth-of-type(2) > p:nth-of-type(1){
		color: #F2728D;

	}

	.box08 > div > div:nth-of-type(1) > p:nth-of-type(1){
		color: #F2728D;
	}
	.box08 > div > div:nth-of-type(3) > table > tbody > tr > th,
	.box08 > div > div:nth-of-type(2) > table > tbody > tr > th {
		font-size: 1.8rem;
	}
	.box08 > div > div:nth-of-type(3) > table > tbody > tr > td,
	.box08 > div > div:nth-of-type(2) > table > tbody > tr > td {
		font-family: 'Roboto', sans-serif;
	}
	.box08 > div > div:nth-of-type(3) > table > tbody > tr:nth-of-type(2) > td > span:nth-child(1){
		display: inline-block;
		width: 80%;
		border-radius: 15px;
		border: 1px solid lightgray;
		color: gray;
		font-size: 14px;
	}
	.box08 > div > div:nth-of-type(3) > table > tbody > tr:nth-of-type(2) > td > span:nth-child(2),
	.box08 > div > div:nth-of-type(2) > table > tbody > tr:nth-of-type(2) > td > span {
		color: #000;
		display:inline;
		border: none;
		font-size: 1.9rem;
	}
	
	.box08 > div > div:nth-of-type(2) > table > tbody > tr > td ,
	.box08 > div > div:nth-of-type(3) > table > tbody > tr > th,
	.box08 > div > div:nth-of-type(2) > table > tbody > tr > th {
		border: 1px solid #F2728D;
	}
	.box08 > div > div:nth-of-type(3) > table {
		margin-bottom:30px;
	}

	.box08 > div > div:nth-of-type(2) > table > tbody > tr:nth-of-type(3) > td{
		border: none;
	}
	.box08 > div > div:nth-of-type(2) > table > tbody > tr > td > span {
		display: block;
		font-size:1.4rem;
		border: 1px solid #F2728D;
		border-radius: 10px;
		color: #F2728D;
	}

	.box08 > div >div:nth-of-type(4) {
		border: none;
		margin-bottom: 45px;
	}

	.box08 > div > div:nth-of-type(4) > h1 {
		font-size: 30px;
		color: #F2728D;
		margin-top: 70px;
		margin-bottom: 70px;
	}
	
	.box08 > div > button{
		background-color: #f2728d;
		border-radius: 30px;
	}
	
	/* box09 */

	.card {
		width: 350px;
		height: 390px;
		background: #fff;
		border-radius: 5px;
		box-shadow: 0 2px 5px #ccc;
	  }
	  .card-img {
		border-radius: 5px 5px 0 0;
		max-width: 100%;
		height: auto;
		margin: 0 auto;
	  }
	  .card-content {
		padding: 20px;
	  }
	  .card-title {
		font-size: 20px;
		margin-bottom: 20px;
		text-align: center;
		color: #333;
	  }
	  .card-text {
		color: #777;
		font-size: 14px;
		line-height: 1.5;
	  }
	.box09 > div {
		width: 900px;
		border: solid 1px black ;
		border-radius: 5px;
		margin: 0 auto;
	}	

	.box09 > div > h1{
		color: #F2728D;
		text-align: center;
		font-size:2.4rem;
		margin-top: 20px;
		margin-bottom: 20px;
	}

	.box09 > div > p {
		margin-left: 290px;
		font-size: 1.6rem;
	}

	.box08 > div > div > table,
	.box09 > div > table {
		margin: 0 auto;
		border-collapse:collapse;
		table-layout: fixed;
	}

	.box09 > div > table { 
		margin-top: 20px;
	}
	.box09 > div > table > tbody > tr > th { 
		border: 1px solid #F2728D;
	}
	.box08 > div > div >table > tbody > tr > th ,
	.box09 > div > table > tbody > tr > th { 
		width: 210px;
		background-color: #f2728d;
		color: #FFF;
		font-weight: bold;
		font-size: 1.8rem;
		height: 40px;
	}
	.box08 > div > div >table > tbody > tr > td ,
	.box09 > div > table > tbody > tr > td { 
		border: solid 1px #f2728d ;
		padding-left: 0px;
		padding-right: 0px;
	}
	.box08 > div > div >table > tbody > tr > th:nth-of-type(2), 
	.box08 > div > div >table > tbody > tr > td:nth-of-type(2),
	.box09 > div > table > tbody > tr > th:nth-of-type(2), 
	.box09 > div > table > tbody > tr > td:nth-of-type(2) { 
		width: 30px;
		background-color: #fff;
		border:#fff;
	}


	.box08 > div > div >table > tbody > tr > td,
	.box09 > div > table > tbody > tr > td { 
		width: 210px;
		height: 120px;
		/* background-color: #e22469; */
		color: #000;
		font-weight: bold;
		text-align: center;
		font-size: 30px;
	}

	.box09 > div:nth-of-type(1) {
		border: none;
		text-align: center;
		margin-top: 30px;
	}
	.box09 > div:nth-of-type(1) > a {
		color: #fff;
	}

	.box10 .container{
		position: relative;
	}

	.box10 .container h1,
	.box10 .container div a img,
	.box10 .container p{
		position: absolute;
		transform: translate(-50%,-50%);
		padding:0;
		margin:0;
	}
	.box10 .container h1{
		font-size: 2.6rem;
		top: 77%;
		left: 50%;
	}
	.box10 .container div{
		margin-top: 20px;
	}

	.box10 .container div a:nth-of-type(1) > img{
		margin: 0 auto;
		width: 40px;
		top: 80%;
		left: 44%;
	}
	.box10 .container div a:nth-of-type(2) > img{
		width: 40px;
		top: 80%;
		left: 50%;
	}
	.box10 .container div a:nth-of-type(3) > img{
		width: 40px;
		top: 80%;
		left: 56%;
	}
	.box10 .container p{
		font-size: 1.7rem;
		top: 92%;
		left: 50%;
	}

	.box10 > div > img {
		margin: 0 auto;
	}

	.box10 > div > div > img {
		width: 60px;
		height: auto;
	}

	.box10 > img:nth-of-type(1){
		margin-bottom:-15px;

	}



	.box11{
		text-align: center;
		background-image: url(https://repittebeauty.cnctor.jp/wp-content/themes/repitte-b/images/box11_bg.png);
		padding-top: 46px;
		padding-bottom:80px;
	}

	.box11 > img {
		margin :0 auto;
	}

	.box11 h1 {
		margin-bottom: 46px;
		font-size:4.6rem;
		font-family:'Noto Sans JP', sans-serif;
	}

	.box12 div.container {
		position: relative;
	}
	
	.box12 div a {
		position: absolute;
		transform: translate(-50%,-50%);
		padding:0;
		margin:0;
		top: 85%;
		left: 50%;
		font-size:2.6rem;
		width: 430px;
		border-radius: 50px;
	}


	.pcnone{
		display: none;
	}



}
.company-info {
	margin-top: 0;
}

.company-info-content-bg {
	margin: 0 calc(50% - 50vw);
	width: 100vw;
	background: #F2728D;
	justify-content: center;
}

.company-info-content {
	display: flex;
	width: 100%;
	max-width: 1080px;
	margin: 0 auto;
	justify-content: center;
	padding: 5% 0;
	gap: 3%;
	color: white;
	flex-wrap: wrap;
}

.company-info-content-left {
	width: 95%;
	max-width: 400px;
	text-align: left;
}

.company-info-content-right {
	width: 95%;
	max-width: 400px;
	text-align: left;
}

.company-info-content-left-title {
	text-align: center;
	font-size: 2.4rem;
}

.company-info-content-left a {
	font-size: 1.8rem;
}

.company-info-content-left-content-box {
	display: flex;
	margin-top: 7.5%;
	gap: 3%;
	align-items: center;
	color: white;
}

.company-info-content-left-content-box img {
	display: block;
}


/* footer contact ボタン */

.footer-contact-button-box {}

.footer-contact-link-text {
    transition: 0.3s;
}

.footer-contact-link-text:hover {
    text-decoration: underline;
}

.footer-contact-button {
    display: block;
    text-align: center;
    margin: 0 auto;
    padding: 16px 32px;
    line-height: 1.6em;
    color: #F2728D;
    font-size: 1.6rem;
    border-radius: 10px;
    background-color: white;
    box-shadow: rgba(51, 51, 51, 0.3) 0 0 10px;
    transition: 0.3s;
}

.footer-contact-button:hover {
    box-shadow: rgba(51, 51, 51, 0.2) 0 0 20px 7.5px;
}

.company-info-content-right-content-box {
    margin-top: 5%;
}

.company-info-content-right-content-box {
    margin-top: 5%;
	font-size: 1.6rem;
}

.footer-company-name {
    font-size: 2.4rem;
    font-weight: bold;
}

.customer-harassment {
    text-decoration: underline solid white;
    -webkit-text-decoration: underline solid white;
}



/* コピーライト */

.copy-write-wrapper {
    width: 100vw;
    margin: 0 calc(50% - 50vw);
    background-color: white;
}

.copy-write {
    display: flex;
    height: auto;
    bottom: 0;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    padding: 20px 0;
    max-width: 1080px;
    margin: 0 auto;
}

.copy-write-reference-box {
    display: flex;
    justify-content: space-between;
    gap: 0;
    flex-wrap: wrap;
}

.copy-write-reference {
    display: flex;
    align-items: center;
    border-right: #333 1px solid;
    text-align: center;
    padding: 0 20px;
}

.copy-write-reference a {
    display: block;
    text-decoration: underline;
    font-size: 1.6rem;
	color: #000;
}

.copy-write-reference a:hover {
    opacity: 0.7;
}

.copy-write-text {
    display: flex;
    height: 75%;
    align-items: center;
}

.copy-write-text p {
    display: block;
}

@media (max-width:768px) {
    .copy-write {
        height: auto;
    }
    .copy-write-reference-box {
        width: 100%;
        justify-content: center;
        margin-top: 10%;
        gap: 25px;
    }
    .copy-write-reference:last-child {
        border-right: none;
    }
    .copy-write-reference {
        border: 0;
        padding: 0;
    }
    .copy-write-text {
        display: block;
        text-align: center;
        margin: auto;
        margin-top: 10%;
    }
}

@media screen and (max-width: 767px) {

	html {
		width: 100%;
	}
	p {
		font-size:16px;
	}

	.white_back{
		font-size: 12px;
		padding: 3px 5px;
	}

	header img{
		width: 100%;
		height: auto;
	}

	.spnone {
		display: none;
	}

	.wrapper{
		max-width: 100%;
	}
	
	.header_link_area span {
		font-size:16px
	}

	button.btn_blue {
		width: 91px;
		font-size: 0.5em;
	}

	button.btn_green {
		width: 342px;
		font-size: 0.5em;
	}

	.box01 {
		width:100%;
	}

	.box01 img{
		width: 100%;
	}

	
	h2.ribbon {
		width: 327px;
		margin-left: -30px;
		font-size: 1.25em;
	}

	.box02{
		background-repeat: no-repeat;
		background-image: url(https://repittebeauty.cnctor.jp/wp-content/themes/repitte-b/images/ios/1x/box02_bg_sp.png);
		width: 100%;
	}

	.box02 > div > div:nth-of-type(2) >img {
		width: 145px;
	}

	.box03 > div div{
		display: flex;
		margin-bottom: 15px;
	}
	.box03 > div div > img{
		width: 161px;
	}
	.box03 > div div > p{
		font-size: 30px;
		font-weight: bold;
	}

	.frame-box-001{
		margin: 15px;
		font-size: 26px;
	}

	.box04{
		width: 100%;
	}

	.box04 >img{
		width: 100%;
	}

	.box04 >h2{
		margin-top:40px;
		font-size:30px;
		text-align: center;
		color: #e22469;
	}

	.box05 {
		margin-top:50px;
		background-image: url(https://repittebeauty.cnctor.jp/wp-content/themes/repitte-b/images/ios/1x/box_bg_sp.png);
	}

	.box05 > div {
		width:95%;
		background-color: #FFF;
		padding-top: 10px;
		margin: 0 auto;
	}

	.box05 > div > h1 {
		margin: 10px auto;
		text-align: center;
	}

	.box05 > div > div >img{
		margin: 0px auto;
		text-align: center;
	}

	.box06{
		margin-top: 50px;
	}

	.box06 > h1{
		text-align: center;
	}

	.box06 img {
		width: 100%;
	}

	.slider {
		padding-left: 0;
	}

	.slider img {
		width: 60vw !important;;/*スライダー内の画像を60vwにしてレスポンシブ化*/
		height:auto;
	}

	.slider li p {
		text-align: center;
		font-size: 20px;
		font-weight: bold;
	}

	.slider li div {
		margin: 0 auto;
		width: 80px;
		background-color: #f2728d;
		text-align: center;
		border-radius: 15px;
		color: #fff;
	}

	.company-info-content-right img {
        width: 100%;
    }
	.toggle_contents{
		width:175px;
		margin-top:-90px;
		margin-bottom: 50px;
	}

	.toggle_title {
		font-size: 12px;
	}

	.box08 img {
		margin: 0 auto;
	}

	.box08 div:nth-of-type(1),
	.box08 div:nth-of-type(2),
	.box08 div:nth-of-type(3){
		border:2px solid #F2728D;
		width: 95%;
		margin: 0 auto;
		text-align: center;
		font-size: 20px;
	}

	.box08 div > table{
		margin: 0 auto;
	}

	
	.box08 div:nth-of-type(4) > div {
		height: 350px;
	}
	.box08 div:nth-of-type(4) > div > p:nth-of-type(1){
		font-size: 20px;
		color:#F2728D;
		font-weight: bold;
	}

	.box10 h1 {
		text-align: center;
		margin-top: -180px;
	}

	.box10 div img{
		width: 100%;
	}
	.box11 h1 {
		text-align: center;
		margin-top: 60px;
	}

	.box11 {
		width: 95%;
		margin: 0 auto;
	}
}