@charset "utf-8";
/* CSS Document */
@media only screen and (max-width:768px) {
  /*----------------------------------------
スマホ用レイアウト（768px以下のスクリーン）
----------------------------------------*/
  /*----------------------------------------
共通設定（スマホ）
----------------------------------------*/
  .contents {
    padding: 0rem 20px;
  }
  /*----------------------------------------
見出しタグ設定（スマホ）
----------------------------------------*/
  h2 {
    margin: 0rem 0rem 1rem;
    font-size: 1.8rem;
  }
  h3 {
    font-size: 1.3rem;
  }
  /*----------------------------------------
全体レイアウト/背景設定（スマホ）
----------------------------------------*/
  /*----------------------------------------
上部固定ヘッダー設定
----------------------------------------*/
  /*上部固定ヘッダー全体*/
  /*ヘッダー内部をカラム幅にする*/
  /*ヘッダーのロゴの設定*/
  .header_logo {
    width: 34%;
    padding-left: 0.5em;
    padding-top: 0.2em;
    padding-bottom: 0.2em;
  }
  /*ヘッダーCTAの設定*/
  .header_cta {
    width: 66%;
  }
  .header_txt {
    width: 36%;
    padding-top: 0em;
    padding-right: 0em;
	  align-self: flex-end;
  }
  .header_tel {
    width: 32%;
    padding-right: 0em;
  }
  .header_mail {
    width: 32%;
    padding-right: 0em;
  }
  .header_tel img, .header_mail img {
    -webkit-filter: none;
  }
/*----------------------------------------
セクションの設定
----------------------------------------*/
/*----------------------------------
セクション（共通）
------------------------------------*/
/*スライダー設定*/
.slider1 li{
	width:200px;
	list-style: none;
	margin: 0 0px;
}	
/*----------------------------------
セクション（CTA）
------------------------------------*/
.sec_cta {
  padding-top: 1.5em;
  padding-bottom: 1.5em;
}

.box_cta {
	border: 5px solid #007dc9;
}
.box_ctaInr {
	padding: 1.2em 1.5em;
}
.sub_cta {
	padding: 0.5em 1em 0.7em;
}
.sub_cta img {
	width: 100%;
}
.box_btn {
	display: block;
	margin-bottom: 0.7em;
	
}
.btn_tel {
  width: auto;
	margin-bottom: 1em;
}


.btn_mail {
  width: auto;
}


/*----------------------------------------
セクション（悩み）
----------------------------------------*/
.sec_nayami {
  background-image: url("../images/bg_nayami_sp.webp");
	background-repeat: no-repeat;
	background-position: top center;
	background-size: 100%;
}
.secInr_nayami {
  padding-top: 3em;
  padding-bottom: 0em;
}	
	.txt_nayami {
		margin: 0 -20px;
	}
.cta_remark li {
	text-indent: -0.5em;
	padding-left: 0.5em;
	margin-top: 0.5em;
}
	.cta_remark {
		line-height: 1;
	}
	
/*----------------------------------------
セクション（サービス）
----------------------------------------*/
.sec_service {
 background-color: #fff574;
background-image: url("../images/bg_service_staff_sp.webp"),
	url("../images/bg_service_town.webp"),
	url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23ffffff' fill-opacity='0.47' fill-rule='evenodd'%3E%3Ccircle cx='3' cy='3' r='3'/%3E%3Ccircle cx='13' cy='13' r='3'/%3E%3C/g%3E%3C/svg%3E");
	background-repeat: no-repeat, no-repeat, repeat;
	background-position: top center, center bottom 1em, center;
	background-size: 100%, 400%, auto;
}
.secInr_service {
  padding-top: 3em;
  padding-bottom: 5em;
}
.title_service {
	position: static;
	margin-bottom: 0em;
}
.title_service:before {
	position: static;
	display: inline-block;
	content: '';
	background-image:none;
	background-repeat: no-repeat;
	width: 0px;
	height: 0px;
	top: -4em;
	left: -8em;
	z-index: -1;
}
.title_service:after {
	position: static;
	display: inline-block;
	content: '';
	background-image:none;
	background-repeat: no-repeat;
	width: 0px;
	height: 0px;
	top: -2em;
	right: -8em;
	z-index: -2;
}
	.sub_service {
	position: static;
	margin-bottom: 0em;
}
.img_place {
	margin-top: -1em;
	margin-bottom: 3em;
}
.img_place img {
	width: 48%;
	margin-bottom: 1em;
}
.img_job {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-start;
	position: relative;
	z-index: 1;
	margin-top: -1em;
}
.img_job img {
	width: 48%;
	margin-bottom: 1em;
}	
/*----------------------------------------
セクション（特徴）
----------------------------------------*/
.sec_tokucho {
  background-color: #fac839;
 background-image: url("../images/bg_tokucho.webp"),
	 url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23ffffff' fill-opacity='0.47' fill-rule='evenodd'%3E%3Ccircle cx='3' cy='3' r='3'/%3E%3Ccircle cx='13' cy='13' r='3'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: no-repeat, repeat;
  background-position: top center, center;
	background-size: 240%, auto;
}
.secInr_tokucho {
  padding-top: 2em;
  padding-bottom: 3em;
}
.txt_attouteki {
	margin-bottom: 1em;
}
.title_tokucho {
	margin-bottom: 1em;
}
.txt_tokucho {
	margin-bottom: 1em;
}
.txt_tokucho:last-child {
	margin-bottom: 0;
}
.re_tokucho {
	text-align: right;
	line-height: 1.1;
	margin-top: 0.2em;
}	
/*----------------------------------------
セクション（秘密）
----------------------------------------*/
.sec_secret {
 background-color: #fff574;
background-image: url("../images/bg_secret.webp"),
	url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23ffffff' fill-opacity='0.47' fill-rule='evenodd'%3E%3Ccircle cx='3' cy='3' r='3'/%3E%3Ccircle cx='13' cy='13' r='3'/%3E%3C/g%3E%3C/svg%3E");
	background-repeat: no-repeat, repeat;
	background-position: center top, center;
	background-size: 350%, auto;
}
.secInr_secret {
  padding-top: 2em;
  padding-bottom: 3em;
}
.txt1_secret {
	width: auto;
	margin: 0 -20px;
}
	.txt2_secret {
		margin: 0 -20px;
	}	
.txt3_secret p {
	background-color: #FFFFFF;
	border: 3px solid #000000;
	padding: 1.5em;
}
/*----------------------------------------
セクション（約束）
----------------------------------------*/
.secInr_promise {
  padding-top: 3em;
  padding-bottom: 3em;
}
.fukidashi_promise {
	width: 70%;
	margin: 0 auto;
	margin-bottom: 0.5em;
}
.title_promise {
	margin-bottom: 4em;
}
.box_promiseInr {
	background-color: #FFFFFF;
	border: 3px solid #000000;
	padding: 3.5em 1.5em 1.5em;
}
.box_promise {
	position: relative;
	z-index: 1;
	margin-bottom: 4.5em;
}
.box_promise:last-child {
	margin-bottom: 0;
}
.box_promise::before {
	content: '';
	position: absolute;
	bottom: -10px;
	right: -10px;
	width: 100%;
	height: 100%;
	border: 3px solid #000000;
	z-index: -2;
}
.bp_pink::before {
	background-color: #e4007f;
}
.bp_blue::before {
	background-color: #00a0e9;
}
.bp_orange::before {
	background-color: #f08300;
}
.bp_green::before {
	background-color: #009944;
}
.nmb_promise {
	position: absolute;
	width: 28%;
	top: -3.5em;
	left: 50%;
	transform: translate(-50%, 0);
}
.sub_promise {
	display: inline-block;
	font-size: 1.4em;
	font-weight: bold;
	margin-left: 0rem;
	position: relative;
	margin-bottom: 0.7em;
}
.sub_promise::after {
	content: '';
	position: absolute;
	background-image: url("../images/kirakira@2x.webp");
	background-repeat: no-repeat;
	background-size: 44px;
	width: 98px;
	height: 102px;
	right: -5em;
	top: 0;
}

.flex_promise {
	display: block;
}
.txt_promise {
	width: auto;
	margin-bottom: 0.7em;
}

.img_promise {
	width: auto;
}	

/*----------------------------------------
セクション（声）
----------------------------------------*/

.secInr_voice {
  padding-top: 3em;
  padding-bottom: 3em;
}
.title_voice {
	margin-bottom: 4em;
}
.flex_voice {
	display: block;
	margin: 0 auto;
}
.box_voiceInr {
	background-color: #FFFFFF;
	border: 3px solid #000000;
	padding: 3.5em 1.5em 1.5em;
	position: relative;
}
.box_voice {
	width: auto;
	position: relative;
	z-index: 1;
	margin-bottom: 4.5em;
	display: flex;
	align-items: stretch;
}
	.box_voice:last-child {
		margin-bottom: 0;
	}	
.box_voice::before {
	content: '';
	position: absolute;
	bottom: -10px;
	right: -10px;
	width: 100%;
	height: 100%;
	border: 3px solid #000000;
	z-index: -2;
}
.bv_blue::before {
	background-color: #00a0e9;
}
.bv_orange::before {
	background-color: #f08300;
}
.bv_green::before {
	background-color: #009944;
}
.icon_voice {
	position: absolute;
	width: 28%;
	top: -3.5em;
	left: 50%;
	transform: translate(-50%, 0);
}
.sub_voice {
	margin-bottom: 0.7em;
}
.name_voice {
	width: auto;
	margin-bottom: 0.7em;
}	
/*----------------------------------------
セクション（ステップ）
----------------------------------------*/

.secInr_step {
  padding-top: 3em;
  padding-bottom: 3em;
}
.title_step {
	margin-bottom: 1.5em;
}

.box_stepInr {
	background-color: #FFFFFF;
	border: 3px solid #000000;
	padding: 1.5em 1.5em 1.5em;
}
.box_step {
	position: relative;
	z-index: 1;
	margin-bottom: 1.5em;
}
.box_step:last-child {
	margin-bottom: 0;
}
.box_step::before {
	content: '';
	position: absolute;
	bottom: -10px;
	right: -10px;
	width: 100%;
	height: 100%;
	background-image: repeating-linear-gradient(-45deg, #000000, #000000 3px, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) 6px);
	border: 3px solid #000000;
	z-index: -2;
}

.nmb_step {
	position: absolute;
	width: 25%;
	top: -3em;
	left: -20px;
}
.sub_step {
	display: block;
	font-size: 1.4em;
	margin-left: 0em;
	margin-bottom: 1em;
	text-align: center;
}
	.sub_step span {
		display: block;
	}	
.flex_step {
	display: block;
	justify-content: space-between;
	align-items: center;
}
.box_txt_step {
	width: auto;
}

.icon_step {
	width: 60%;
	margin: 0 auto;
}
	.is1 {
		margin-top: -3em;
	}
	.ts1 {
		margin-top: -2em;
	}
.triangle {
  background-color: #000000;
  width: 22px;
  height: 20px;
  clip-path: polygon(0 0, 100% 0%, 50% 100%);
  margin: 0 auto;
  margin-bottom: 0.7em;
}
/*----------------------------------------
セクション（質問）
----------------------------------------*/
.secInr_qa {
  padding-top: 3em;
  padding-bottom: 3em;
}
.title_qa {
	margin-bottom: 1em;
}
.box_qaInr {
	background-color: #FFFFFF;
	border: 3px solid #000000;
	padding: 1.5em 1.5em 1.5em 1em;
}
.box_qa {
	position: relative;
	z-index: 1;
	margin-bottom: 1.5em;
}
.box_qa:last-child {
	margin-bottom: 0;
}
.box_qa::before {
	content: '';
	position: absolute;
	bottom: -10px;
	right: -10px;
	width: 100%;
	height: 100%;
	background-image: repeating-linear-gradient(-45deg, #000000, #000000 3px, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) 6px);
	border: 3px solid #000000;
	z-index: -2;
}
.txt_q {
	font-size: 1.2em;
	padding-left: 40px;
	position: relative;
	border-bottom: 1px dotted #CCCCCC;
	padding-bottom: 0.5em;
		margin-bottom: 0.5em;
}
.txt_q::before {
	content: '';
	position: absolute;
background-image: url("../images/icon_q@2x.webp");
	background-repeat: no-repeat;
	background-size: 30px;
	width: 30px;
	height: 30px;
	left: 0;
	top: 0px;
}
.txt_a {
	padding-left: 40px;
	position: relative;
}
.txt_a::before {
	content: '';
	position: absolute;
background-image: url("../images/icon_a@2x.webp");
	background-repeat: no-repeat;
	background-size: 30px;
	width: 30px;
	height: 30px;
	left: 0;
	top: 0px;
}
/*----------------------------------------
セクション（メッセージ）
----------------------------------------*/
.sec_msg::before {
  content: "";
  background: url("../images/bg_msg.webp") no-repeat center center;
  background-size: cover;
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: -1;
  transform: translateZ(0);
}

.secInr_msg {
  padding-top: 0em;
  padding-bottom: 3em;
}
.logo_msg {
	width: auto;
}
.sub1_msg {
	width: auto;
	margin-bottom: 0em;
	margin-top: -4em;
}
.box_txt1_msg, .box_txt2_msg {
	position: relative;
	background-color: #FFFFFF;
	padding: 1.5em;
	box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
	border: 5px solid #00a0e9;
	margin-bottom: 1em;
}
.box_txt2_msg {
	margin-bottom: 0;
}

.txt1_msg {
	width: auto;
}
.sub2_msg {
	width: auto;
	margin-bottom: 0em;
}
.txt2_msg {
	width: auto;
}
	
/*----------------------------------------
セクション（プライバシー）
----------------------------------------*/
  .secInr_privacy {
    padding-top: 2rem;
    padding-bottom: 3rem;
  }
  .indent01 {
    margin-left: 1rem;
  }
  .indent02 {
    margin-left: 1.5rem;
  }
 /*----------------------------------------
セクション（運営会社）
----------------------------------------*/
  .secInr_co {
    padding-top: 2rem;
    padding-bottom: 3rem;
  }
 
  /*--------------------------------------------------------
Tableをブロック表示に 
--------------------------------------------------------*/
  table.table-style01, table.table-style01 tr, table.table-style01 th, table.table-style01 td {
    display: block;
  }
  table.table-style01 th, table.table-style01 td {
    float: left;
    width: 100% !important;
    box-sizing: border-box;
    -moz-box-sizing: padding-box;
  }
  table.table-style01 {
    zoom: 1;
  }
  table.table-style01:after {
    content: '';
    display: block;
    clear: both;
    height: 0;
  }
/*----------------------------------------
フッター部分
----------------------------------------*/

}