/* -------------------------------------------
contact.html
-------------------------------------------*/

.contact{
	margin: 0 auto;
	margin-top: 120px;
	margin-bottom: 120px;
	max-width: 2000px;
	padding-left: 16px;
	padding-right: 16px;
}

.contact__inner{
	margin: 0 auto;
	max-width: 1248px;
	background-color: #DCDCDC;
	padding-top: 64px;
	padding-bottom: 64px;
	padding-left: 16px;
	padding-right: 16px;
}

.contact__table{
	margin: 0 auto;
	max-width: 628px;
}

tr, td{
	display: block;
	position: relative;
}

.contact__title{
	margin-top: 24px;
	font-size: 1rem;
	font-weight: bold;
	color: #272727;
	white-space: nowrap;
}

.contact__title1{
	margin-top: 0;
}

.contact__content{
	position: relative;
}

.contact__select{
	background-color: #fff;
	border: 1px solid #272727;
	padding-top: 20px;
	padding-right: 64px;
	padding-bottom: 20px;
	padding-left: 24px;
	border-radius: 5px;
	line-height: 1;
	width: 200px;
  cursor: pointer;
}

.contact__content::after{
	content: "";
  margin: auto;
  position: absolute;
  top: 20px;
	left: 166px;
  width: 10px;    
  height: 10px;   
  border-top: 2px solid #000;     
  border-right: 2px solid #000;   
  transform: rotate(135deg);  
	border-radius: 2px;
}

.contact__box{
	background-color: #fff;
	border: 1px solid #9F9F9F;
	width: 100%;
	border-radius: 5px;
	width: 628px;
	padding-top: 24px;
	padding-bottom: 24px;
	padding-left: 16px;
	padding-right: 16px;
	max-height: 64px;
}

.contact__box:hover{
	outline: 2px solid #272727;
}

.contact__tel-box:hover{
	outline: 2px solid #272727;
}

.contact__textarea:hover{
	border: 2px solid #272727;
}

input:valid {
	border: 2px solid #272727;
}

input.input-invalid:valid{
	border: none !important;
}

.space-attention{
	font-size: 0.75rem;
}

/* フォームバリデーション */

.form-invalid {
  color: red;
  font-size: 0.875rem;
	position: absolute;
	bottom: -25px;
	left: 0;
}

.input-invalid{
	border: 2px solid #B30000;
	background-color: #FFF0F0;
	color: #B30000;
}

#c_name.input-invalid{
	outline: 2px solid #B30000;
	background-color: #FFF0F0;
	color: #B30000;
}

#name.input-invalid{
	outline: 2px solid #B30000;
	background-color: #FFF0F0;
	color: #B30000;
}

#mail.input-invalid{
	outline: 2px solid #B30000;
	background-color: #FFF0F0;
	color: #B30000;
}

#tel1.input-invalid{
	outline: 2px solid #B30000;
	background-color: #FFF0F0;
	color: #B30000;
}

#tel2.input-invalid{
	outline: 2px solid #B30000;
	background-color: #FFF0F0;
	color: #B30000;
}

#tel3.input-invalid{
	outline: 2px solid #B30000;
	background-color: #FFF0F0;
	color: #B30000;
}

#pic_name.input-invalid{
	outline: 2px solid #B30000;
	background-color: #FFF0F0;
	color: #B30000;
}

#pic_namef.input-invalid{
	outline: 2px solid #B30000;
	background-color: #FFF0F0;
	color: #B30000;
}

#post1.input-invalid{
	outline: 2px solid #B30000;
	background-color: #FFF0F0;
	color: #B30000;
}

#post2.input-invalid{
	outline: 2px solid #B30000;
	background-color: #FFF0F0;
	color: #B30000;
}

#municipalities.input-invalid{
	outline: 2px solid #B30000;
	background-color: #FFF0F0;
	color: #B30000;
}

#street.input-invalid{
	outline: 2px solid #B30000;
	background-color: #FFF0F0;
	color: #B30000;
}

#info.input-invalid{
	outline: 2px solid #B30000;
	background-color: #FFF0F0;
	color: #B30000;
}

#namef.input-invalid{
	outline: 2px solid #B30000;
	background-color: #FFF0F0;
	color: #B30000;
}

#clm.input-invalid{
	outline: 2px solid #B30000;
	background-color: #FFF0F0;
	color: #B30000;
}

textarea:valid {
	border: 2px solid #272727;
}

input:placeholder-shown {
	border: 1px solid #9F9F9F;
}

textarea:placeholder-shown {
	border: 1px solid #9F9F9F;
}

.contact__tel-box{
	background-color: #fff;
	border: 1px solid #9F9F9F;
	width: 100%;
	border-radius: 5px;
	line-height: 1;
	width: 120px;
	padding-top: 16px;
	padding-bottom: 16px;
	padding-left: 16px;
	padding-right: 16px;
	text-align: center;
	max-height: 48px;
}

.contact__textarea{
	background-color: #fff;
	border: 1px solid #9F9F9F;
	width: 100%;
	border-radius: 5px;
	width: 628px;
	padding: 10px;
	height: 144px;
}

 /* ボタンの親要素のスタイル */
.contact__submit-box {
	margin: 0 auto;
	position: relative;
	width: 416px;
	overflow: hidden; 
	background-color: #000;
	border-radius: 5px;
}

/* エフェクト用のspan */
.contact__submit-bg {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #fff; 
	/* transition: transform .6s cubic-bezier(0.8, 0, 0.2, 1);
	transform: scale(0, 1); 
	transform-origin: right top; 
	z-index: 2;  */
	transform: scaleX(0); /* 初期状態：背景を非表示 */
    transform-origin: left; /* 初期状態：左から表示 */
    z-index: 2; /* 背景として表示 */
    transition: transform 0.6s cubic-bezier(0.8, 0, 0.2, 1); /* アニメーションのスピードと効果を設定 */
	border-radius: 5px;
}



/* ホバー時のエフェクト */
.contact__submit-box:hover .contact__submit-bg {
	transform: scaleX(1); /* ホバー時：背景を全体表示 */
}

/* ボタンのスタイル */
.contact__submit {
	appearance: none;
	width: 100%;
	display: block;
	color: #fff;
	background-color: transparent; 
	font-size: 0.875rem;
	font-weight: bold;
	padding-top: 26px;
	padding-bottom: 26px;
	border-radius: 5px;
	transition: color .3s ease; /* テキスト色のトランジション */
	position: relative;
	z-index: 3; /* テキストを背景より前面に表示 */
}

.contact__submit-box:hover .contact__submit {
	color: #000; 
}

/* 既存のスタイル */
.contact__submit-box::before {
	content: "";
	display: block;
	position: absolute;
	z-index: 2;
	top: 20px;
	right: 12px;
	width: 40px;
	height: 40px;
	background-color: #fff;
	border-radius: 50%;
	pointer-events: none;
	transition: .3s;
	z-index: 5;
}

.contact__submit-box:hover::before {
	background-color: #000;
	transform: scale(1.1);
}

.contact__submit-box::after {
	content: "";
	margin: auto;
	position: absolute;
	z-index: 2;
	top: -3px;
	bottom: 0;
	right: 29px;
	width: 9px;
	height: 9px;
	border-top: 2px solid #000;
	border-right: 2px solid #000;
	transform: rotate(45deg);
	pointer-events: none;
	transition: .3s;
	z-index: 6;
}

.contact__submit-box:hover::after {
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
}

.contact__reset-box{
	margin: 0 auto;
	border: 1px solid #000;
	border-radius: 30px;
	max-width: 198px;
	position: relative;
}

.contact__reset-box::before,
.contact__reset-box::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 14px;
	width: 17px;
	height: 2px;
	background-color: #000;
	transform: translate(-50%, -50%) rotate(45deg);
	transition: .3s;
}

.contact__reset-box:hover::before,
.contact__reset-box:hover::after {
	background-color: #fff;
}

.contact__reset-box::after {
	transform: translate(-50%, -50%) rotate(-45deg);
}

.contact__reset{
	display: block;
	font-size: 0.875rem;
	font-weight: bold;
	padding-top: 19px;
	padding-bottom: 19px;
	padding-left: 24px;
	padding-right: 48px;
	width: 100%;
	height: 100%;
	border-radius: 30px;
	line-height: 1;
	color: #000;
	transition: .3s;
}

.contact__reset:hover{
	color: #fff;
	background-color: #000;
}

/*-------------------------------------------
business/form.html, session.html
-------------------------------------------*/

.session-message{
	font-size: 1.125rem;
  font-weight: bold;
	line-height: 2;
  margin-top: 120px;
}

@media screen and (max-width: 1100px) {
  .session-message{
    font-size: 1rem;
    margin-top: 100px;
  }
}

.request{
	margin: 0 auto;
	margin-top: 140px;
	margin-bottom: 120px;
	max-width: 1126px;
	padding-left: 16px;
	padding-right: 16px;
	display: flex;
	justify-content: space-between;
}

.request.session{
  margin-top: 80px;
}

@media screen and (max-width: 1100px) {
  .request{
    margin-top: 100px;
  }
  
  .request.session{
    margin-top: 60px;
  }
}

.request__img{
	width: 48%;
	height: 550px;
	position: sticky;
	top: 80px;
}

.request__txt{
	width: 48%;
	height: 850px;
	position: sticky;
	top: 80px;
}

@media screen and (max-width: 1100px) {
  .request__txt{
    height: 750px;
  }
}

.request__txt .forSP{
  display: none;
}

.request__session-ttl{
  background: #272727;
  color: #fff;
  font-size: 1.125rem;
	font-weight: bold;
  padding: .2rem 1.5rem;
}

.request__session-date{
  border: #272727 2px solid;
  font-size: 1.25rem;
	font-weight: bold;
  line-height: 1.5;
  text-align: center;
  padding: .5rem;
}

.request__session-date span{
  font-size: 0.875rem;
  font-weight: normal;
}

@media screen and (max-width: 1100px) {
  .request__session-ttl{
    padding: .1rem 1.5rem;
  }
  
  .request__session-ttl,
  .request__session-date{
    font-size: 1rem;
  }
  
  .request__session-date span{
    font-size: 0.8rem;
  }
}

.request__session-text{
  margin: 20px 0;
}

@media screen and (max-width: 1100px) {
  .request__session-text{
    font-size: 0.88rem;
    margin: 15px 0 30px;
  }
}

.request__session-text p{
  line-height: 1.7;
}

.request__session-text > * + *{
  margin-top: 1em;
}

.request__session-text p + .c-list-memo{
  margin-top: .3rem;
}

.c-list-memo li {
  display: block;
  position: relative;
  font-size: 0.875rem;
  padding-left: 1.5rem;
  line-height: 1.2;
}

@media screen and (max-width: 1100px) {
  .c-list-memo li {
    font-size: 0.8rem;
  }
}

.c-list-memo li .u-memo__mark {
  position: absolute;
  top: 0;
  left: 0;
}

.c-list-memo li + li {
  margin-top: .3rem;
}

.request__inner{
	width: 48%;
	background-color: #DCDCDC;
	padding-top: 40px;
	padding-bottom: 40px;
	padding-left: 40px;
	padding-right: 40px;
}

.request__title{
	margin-top: 24px;
	font-size: 1rem;
	font-weight: bold;
}

.request__title1{
	margin-top: 0;
}

.request__content input{
	padding-top: 16px;
	padding-bottom: 16px;
	padding-left: 16px;
	padding-right: 16px;
	width: 100%;
	max-height: 64px;
	background-color: #fff;
	border: 1px solid #9F9F9F;
	border-radius: 5px;
}

.request__content-post{
	display: flex;
	align-items: center;
	gap: 16px;
}

.request__content-post .request__content__number{
	width: 26%;
	background-color: #fff;
	border: 1px solid #9F9F9F;
	border-radius: 5px;
	text-align: center;
	padding-top: 10px;
	padding-bottom: 10px;
}

.request__content-post .request__content__search{
	width: 23%;
	background-color: #000;
	color: #fff;
	border-radius: 30px;
	font-size: 0.875rem;
	font-weight: bold;
	max-height: 48px;
	padding-top: 10px;
	padding-bottom: 10px;
}

.request__content-select{
	width: 200px;
	background-color: #fff;
	border: 1px solid #272727;
	border-radius: 5px;
	position: relative;
}

.request__content-select::after{
	content: "";
  position: absolute;
  top: 12px;
  right: 16px;
  width: 10px;    
  height: 10px;  
  border-top: 2px solid #000;    
  border-right: 2px solid #000;   
  transform: rotate(135deg);    
}

.request__content-select select{
	width: 100%;
	padding-left: 24px;
	padding-top: 10px;
	padding-bottom: 10px;
  cursor: pointer;
	color: #272727;
}

.request__content-tel{
	display: flex;
	align-items: center;
	gap: 10px;
}

.request__content-tel .request__content__tel-number{
	width: 26%;
	background-color: #fff;
	border: 1px solid #9F9F9F;
	border-radius: 5px;
	text-align: center;
	padding-top: 10px;
	padding-bottom: 10px;
}

.request__content__number:hover{
	outline: 2px solid #272727 !important;
}

input.request__content__number:valid{
	outline: 2px solid #272727;
}

input.request__content__number:placeholder-shown {
	outline: 1px solid #9F9F9F;
}

.request__content input:hover{
	outline: 2px solid #272727;
	border-radius: 2px;
}

.request__content__tel-number:hover{
	outline: 2px solid #272727 !important;
}

input.request__content__tel-number:valid{
	outline: 2px solid #272727;
}

input.request__content__tel-number:placeholder-shown {
	outline: 1px solid #9F9F9F;
}

.request__check1{
	margin-top: 18px;
}

.request__check{
	margin-bottom: 25px;
}

.request__check label{
	display: flex;
	align-items: center;
	gap: 8px;
	line-height: 1.375;
}

.request__check__box{
	width: 16px;
	height: 16px;
}

.request__privacy-title{
	padding-top: 24px;
	font-weight: bold;
}

.request__privacy-text{
	margin-top: 16px;
	line-height: 2;
}

.request__privacy-text a{
	text-decoration: underline;
	font-weight: 500;
}

.request__privacy-check{
	margin: 0 auto;
	margin-top: 16px;
	border: 1px solid #272727;
	border-radius: 2px;
	width: 160px;
	font-weight: bold;
	background-color: #fff;
	padding-top: 10px;
	padding-bottom: 10px;
}

.request__privacy-check label{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
}

input[type="checkbox"]{
	position: relative;
  width: 16px;
	min-width: 16px;
  height: 16px;
	min-height: 16px;
  border: 1px solid #9F9F9F;
	border-radius: 2px;
  vertical-align: -5px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
	background-color: #fff;
}

input[type="checkbox"]:checked:before {
	content: '';
  position: absolute;
  top: -2px;
  left: 4px;
  transform: rotate(50deg);
  width: 8px;
  height: 13px;
  border-right: 2px solid #000;
  border-bottom: 2px solid #000;
}

.request__submit-box{
	margin: 0 auto;
	position: relative;
	max-width: 416px;
	width: 100%;
	overflow: hidden; 
	background-color: #000;
	border-radius: 5px;
}

.request__submit-bg {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #fff; 
	transform: scaleX(0); 
  transform-origin: left; 
  z-index: 2; 
  transition: transform 0.6s cubic-bezier(0.8, 0, 0.2, 1);
	border-radius: 5px;
}

.request__submit-box:hover .request__submit-bg {
	transform: scaleX(1); 
}

.request__submit-box::before{
	content: "";
	display: block;
	position: absolute;
	z-index: 2;
	top: 20px;
	right: 12px;
	width: 40px;
	height: 40px;
	background-color: #fff;
	border-radius: 50%;
	pointer-events: none;
	transition: .3s;
	z-index: 5;
}

.request__submit-box:hover::before {
	background-color: #000;
	transform: scale(1.1);
}

.request__submit-box::after{
	content: "";
	margin: auto;
	position: absolute;
	z-index: 2;
	top: -3px;
	bottom: 0;
	right: 29px;
	width: 9px;
	height: 9px;
	border-top: 2px solid #000;
	border-right: 2px solid #000;
	transform: rotate(45deg);
	pointer-events: none;
	transition: .3s;
	z-index: 6;
}

.request__submit-box:hover::after {
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
}

.request__submit{
	appearance: none;
	width: 100%;
	display: block;
	color: #fff;
	background-color: transparent; 
	font-size: 0.875rem;
	font-weight: bold;
	padding-top: 26px;
	padding-bottom: 26px;
	border-radius: 5px;
	transition: color .3s ease; 
	position: relative;
	z-index: 3; 
}

.request__submit-box:hover .request__submit {
	color: #000; 
}

.request__reset-box{
	margin: 0 auto;
	border: 1px solid #000;
	border-radius: 30px;
	max-width: 198px;
	position: relative;
}

.request__reset-box::before,
.request__reset-box::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 14px;
	width: 17px;
	height: 2px;
	background-color: #000;
	transform: translate(-50%, -50%) rotate(45deg);
	transition: .3s;
}

.request__reset-box::after {
	transform: translate(-50%, -50%) rotate(-45deg);
}

.request__reset-box:hover::before,
.request__reset-box:hover::after {
	background-color: #fff;
}

.request__reset-box::after {
	transform: translate(-50%, -50%) rotate(-45deg);
}

.request__reset{
	display: block;
	font-size: 0.875rem;
	font-weight: bold;
	padding-top: 19px;
	padding-bottom: 19px;
	padding-left: 24px;
	padding-right: 48px;
	width: 100%;
	height: 100%;
	border-radius: 30px;
	line-height: 1;
	color: #000;
	transition: .3s;
}

.request__reset:hover{
	color: #fff;
	background-color: #000;
}


/*-------------------------------------------
thanks.html
-------------------------------------------*/

.thanks{
	margin: 0 auto;
	margin-top: 80px;
	margin-bottom: 120px;
	padding-left: 20px;
	padding-right: 20px;
	max-width: 868px;
}

.thanks__title{
	background-color: #272727;
	color: #fff;
	font-size: 1.125rem;
	font-weight: bold;
	line-height: 1;
	padding-top: 32px;
	padding-bottom: 32px;
	padding-left: 32px;
	padding-right: 32px;
}

.thanks__title .forSP{
  display: none;
}

.thanks__text{
	margin-top: 80px;
	font-size: 1.125rem;
	font-weight: bold;
	line-height: 2;
}

.thanks__text span{
	border-bottom: 1px solid #272727;
}

.thanks__buttons{
	margin-top: 80px;
	display: flex;
	justify-content: center;
	gap: 36px;
}

.thanks__button{
	border: 1px solid #000;
	border-radius: 30px;
	padding-top: 19px;
	padding-bottom: 19px;
	padding-left: 24px;
	padding-right: 48px;
	line-height: 1;
	font-size: 0.875rem;
	font-weight: bold;
	position: relative;
	max-width: 185px;
}

.thanks__button:hover{
	border: 1px solid #fff;
	color: #fff;
	background-color: #000;
	opacity: 1;
}

.thanks__button::after{
	content: "";
	display: block;
	position: absolute;
	top: 21px;
	right: 24px;
	width: 8px;    
  height: 8px;   
  border-top: 2px solid #000;     
  border-right: 2px solid #000;   
  transform: rotate(45deg); 
	transition: .3s;
}

.thanks__button:hover::after{  
  border-top: 2px solid #fff;     
  border-right: 2px solid #fff;   
}

.thanks__important{
	margin-top: 40px;
}

.thanks__important__title{
	font-size: 1.125rem;
	font-weight: bold;
	color: #000;
}

.thanks__important__title span{
	display: inline-block;
	background-color: #272727;
	color: #fff;
	line-height: 1;
	padding-top: 6px;
	padding-bottom: 6px;
	padding-left: 10px;
	padding-right: 10px;
	margin-right: 10px;
	font-size: 0.875rem;
	font-weight: bold;
}

.thanks__important__text{
	margin-top: 24px;
	font-size: 1.125rem;
	font-weight: bold;
	line-height: 2;
}

.thanks__attention{
	margin-top: 40px;
	font-size: 0.875rem;
	font-weight: 400;
	line-height: 1.8;
}


/*-------------------------------------------
SP
-------------------------------------------*/

@media screen and (max-width: 800px) {

  /* -------------------------------------------
  contact.html
  -------------------------------------------*/
	.form-invalid {
		font-size: 0.75rem;
		line-height: 1;
	}

  .contact{
    margin-top: 64px;
    margin-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
  }

  .contact__inner{
    padding-left: 20px;
    padding-right: 20px;
  }

  .contact__select{
    border-radius: 4px;
  }

  .contact__box{
    width: 100%;
  }

  .contact__tel-box{
    width: 75px;
    padding-left: 0px;
    padding-right: 0px;
  }

  .contact__textarea{
    width: 100%;
  }

  
  /*-------------------------------------------
  business/form.html
  -------------------------------------------*/
  
  .session-message{
    font-size: 0.9rem;
    line-height: 1.5;
    margin-top: 64px;
  }

  .request{
    margin-top: 26px;
    margin-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
    flex-direction: column;
  }
  
  .request.session{
    margin-top: 40px;
  }

  .request__img{
    width: 100%;
		height: auto;
		position: static;
		top: auto;
  }
  
  .request__txt{
    width: 100%;
		height: auto;
		position: static;
		top: auto;
  }
  
  .request__txt .forSP{
    display: block;
  }
  
  .request__session-ttl{
    padding: 0 1.2rem;
    margin: 0 20px;
  }
  
  .request__session-date{
    width: auto;
    padding: .3rem;
    margin: 0 20px;
  }
  
  .request__session-text {
    margin: 15px 20px 40px;
  }

  .request__inner{
    width: 100%;
    padding-top: 64px;
    padding-bottom: 64px;
    padding-left: 20px;
    padding-right: 20px;
  }

  .request__content-post{
    gap: 10px;
  }

  .request__content-post .request__content__number{
    width: 84px;
    height: 48px;
    padding-top: 0px;
    padding-bottom: 0px;
  }

  .request__content-post .request__content__search{
    width: 104px;
  }

  .request__content-select::after{
    top: 20px; 
  }

  .request__content-select select{
    width: 100%;
    padding-top: 0px;
    padding-bottom: 0px;
    height: 56px;
  }

  .request__content-tel .request__content__tel-number{
    width: 75px;
    padding-top: 0px;
    padding-bottom: 0px;
    height: 48px;
  }

	/*-------------------------------------------
	thanks.html
	-------------------------------------------*/

	.thanks{
		margin-top: 64px;
		margin-bottom: 64px;
	}

	.thanks__title{
		font-size: 1rem;
		padding-top: 24px;
		padding-bottom: 24px;
		padding-left: 24px;
		padding-right: 24px;
    line-height: 1.2;
	}
  
  .thanks__title .forSP{
    display: block;
  }

	.thanks__text{
		margin-top: 40px;
		font-size: 0.875rem;
		text-align: justify;
	}

	.thanks__buttons{
		margin-top: 64px;
		flex-direction: column;
		align-items: center;
		gap: 24px;
	}

	.thanks__important__title{
		font-size: 0.875rem;
	}

	.thanks__important__title span{
		padding-left: 8px;
		padding-right: 8px;
		margin-right: 8px;
		font-size: 0.75rem;
	}

	.thanks__important__text{
		margin-top: 16px;
		font-size: 0.875rem;
	}
}

@media screen and (max-width: 500px) {

	.contact__submit-box{
		width: 100%;
	}

	.request__submit-box{
		width: 100%;
	}
}

@media screen and (max-width: 400px) {

  .contact__box{
    width: 300px;
  }

  .contact__textarea{
    width: 300px;
  }
}




/*-------------------------------------------
Campaign SECTION STYLES
-------------------------------------------*/
section.request.business {	
	max-width: 1320px;
	gap: 36px;
	@media (max-width: 768px) {
		gap: 80px;
		gap: 0;
	}
	.request__img {
		height: auto;
		width:calc((755 /1320) * 100%);
		@media (max-width: 768px) {
			width: 100%;
			padding-inline: 22px;
		}
		img {
			display: none;
			@media (max-width: 768px) {
				display: block;
			}
		}
	}
	.request__inner {
		width:calc((529 /1320) * 100%);
		@media (max-width: 768px) {
			width: 100%;
		}
	}
	.business_apply,
	.campaign_business {
		@media (max-width: 768px) {
			display: none;
		}
	}
}

.campaign_business {
	background-color: #272727;
	padding: 74px 48px;
	color: #fff;
	border-radius: 4px;
	@media (max-width: 768px) {
		padding: 40px 16px;
	}
	.section-title-top {
		font-size: 64px;
		font-weight: 900;
		font-family: "Inter", sans-serif;
		text-transform: uppercase;
		text-align: center;
		line-height: 1;
		margin-bottom: 38px;
		@media (max-width: 768px) {
			font-size: 26px;
			margin-bottom: 24px;
		}
	}
    .campaign__list {
        margin-inline: auto;
        display: flex;
		flex-direction: column;
        gap: 58px;
        @media (max-width: 768px) {
            gap: 40px;
        }
        li {
            width: 100%;
        }
    }
    .campaign__title {
        background-color: #fff;
        color: #272727;
		border-radius: 2px;
        padding: 15px;
        text-align: center;
        font-size: 18px;
        font-weight: 700;
        line-height: 1;
        margin-bottom: 28px;
        @media (max-width: 768px) {
            font-size: 16px;
            margin-bottom: 18px;
        }
    }
    p {
        font-size: 14px;
        font-weight: 700;
        line-height: 1.8;
    }
    span {
        margin-top: 2px;;
        display: block;
        font-size: 12px;
        line-height: 1.8;
        @media (max-width: 768px) {
            font-size: 12px;
        }
    }
    dl {
        margin-top: 18px;
        display: flex;
        flex-direction: column;
        font-size: 12px;
        line-height: 1.6;
        dt {
            font-weight: 700;
			margin-bottom: 5px;
        }
    }
}

.apply__list {
	font-size: 14px;
	margin-bottom: 64px;
	line-height: 1.8;
	@media (max-width: 768px) {
		margin-bottom: 48px;
	}
	dt {
		position: relative;
		text-align: center;
		font-size: 24px;
		font-family: "Inter", sans-serif;
		font-weight: 900;
		line-height: 1;
		color: #fff;
		background: #272727;
		border-radius: 4px;
		padding: 8px;
		@media (max-width: 768px) {
			font-size: 16px;
			border-radius: 2px;
			padding: 9px;
		}
	}
	dd {
		padding: 26px 24px;
		margin-top: 16px;
		background: #f7f7f7;
		@media (max-width: 768px) {
			padding: 24px 16px;
			margin-top: 16px;
		}
		&.bgNone {
			padding: 0;
			background: none;
		}
		+ dt {
			margin-top: 104px;
			@media (max-width: 768px) {
				margin-top: 64px;
			}
			&::after {
				position: absolute;
				content: "";
				display: block;
				top: -63px;
				left: 0;
				right: 0;
				margin: auto;
				background-color: #272727;
				width: 30px;
				height: 20px;
				clip-path: polygon(0 0, 100% 0%, 50% 100%);
				@media (max-width: 768px) {
					top: -37px;
					width: 22px;
					height: 14px;
				}
			}
		}
		.subHead {
			font-weight: 700;
			text-align: center;
			font-size: 24px;
			line-height: 1.4;
			border-bottom: 1px solid #dcdcdc;
			padding-bottom: 8px;
			margin-bottom: 20px;
			@media (max-width: 768px) {
				font-size: 16px;
				padding-bottom: 8px;
				margin-bottom: 5px;
			}
		}
		.center {
			text-align: center;
		}	
		.divisionContainer {
			display: flex;
			column-gap: 35px;
			@media (max-width: 768px) {
				column-gap: 10px;
			}
			> * {
				position: relative;
				width: calc((100% - (36px * 1)) / 2);
				padding: 32px 24px;
				background: #f7f7f7;
				@media (max-width: 768px) {
					width: calc((100% - (10px * 1)) / 2);
					padding: 24px 16px;
				}
			}
		}
		.indent {
			margin-top: 5px;
			font-size: 14px;
			margin-inline: auto;
			@media (max-width: 768px) {
				font-size: 12px;
			}
			&.center {
				li {
					text-align: center;
				}
			}
			+ p {
				margin-top: 18px;
			}
		}
	}
}