@charset "UTF-8";

/*
CSS Document
Copyright (C) GLOBAL ASSET MOTIONS CO., LTD All Rights Reserved.
URL:www.glam.ne.jp
*/



@import url("common.css");



/* ----------------------------------------------------------
   MAIN VISUAL AREA
---------------------------------------------------------- */
.fv_content{
	width: 100%;
	height: calc(80vh - 100px);
	min-height: 700px;
	background-image: url("../home/fv_img.jpg");
	background-size: cover;
	background-position: center bottom;
}


.fv_wrapper{
	width: 50%;
	height: calc(80vh - 100px);
	min-height: 700px;
	margin-left: 5%;
	display: flex;
	justify-content: center;
	align-items: center;
}

.target_audience_position{
	justify-content: center;
	align-items: flex-end;
}

ul.target_audience{
/*	justify-content: space-around;*/
	justify-content: center;
	margin-top: 0.5rem;
}

ul.target_audience li{
	background-color: #fff;
	padding: 0.6em 1.2em;
	width: fit-content;
	border-radius: 50vh;
	font-size: 1.28rem;
	border: solid 2px var(--green);
}

ul.target_audience li + li{
	margin-left: 1rem;
}

.target_audience_position > p{
	font-size: 1.28rem;
	margin: 0  0 0.5rem 0.5rem;
}

h2.fv_text{
	background-color: rgba(144, 206, 95, 0.7);
	width: fit-content;
	margin-top: 1rem;
	padding: 1rem 2rem;
	font-size: 2.22rem;
	color: #fff;
	letter-spacing: 0.1em;
	font-weight: bold;
}

span.pink_white{
	color: var(--pink);
	 -webkit-text-stroke: 3px #fff;
    text-stroke: 3px #fff;
	paint-order: stroke;
}

/* ----------------------------------------------------------
   CONTENTS AREA - PC
---------------------------------------------------------- */

/* ------ catch area ------- */
.flex_bottom{
	align-items: flex-end;
}

.worries_illust{
	width: 10%;
}

.worries_illust img{
	width: 100%;
}

.worries_arae{
	width: 70%;
}

ul.worries_list{
	display: flex;
	justify-content: space-around;
	align-items: center;
	margin-top: 1rem;
}

ul.worries_list li{
	background-color: #fff;
	padding: 0.6em 1.2em;
	width: fit-content;
	border-radius: 50vh;
	font-size: 1.28rem;
	border: solid 2px var(--green);
}

ul.worries_list li + li{
	margin-left: 1rem;
}


.triangle {
  height: 5vh;
  width: 10vw;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
	background-color: #fff;
	position: absolute;
	top: 0;
	left: 50%;
	  transform: translateX(-50%); 
  -webkit-transform: translateX(-50%);
	}


h3.catch_title{
	font-size: 1.67rem;
	font-weight: 600;
	text-align: center;
	letter-spacing: 0.1em;
	margin-bottom: 3rem;
}





/* ------ merit ------- */
ul.merit_box li{
    width: 23%;
    border: 1px solid var(--gray);
	position: relative;
}
ul.merit_box li::before{
    content: "";
    padding-top: 100%;
    display: block;
}

.merit_item{
	position: absolute;
    top: 0;
    left: 0;
	align-items: center;
}

.number{
	width: 25%;
	background-color: var(--green);
	color: #fff;
	position: relative;
}



.number::before{
    content: "";
    padding-top: 100%;
    display: block;
}

.number > p {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%); 
  -webkit-transform: translate(-50%,-50%);
	font-size: 2.23rem;
}

p.merit_text{
	width: 75%;
	padding: 0 0.5rem;
	font-size: clamp(15px, 1vw, 18px);
}


p.merit_text_test{
	order: 3;
}

.merit_image{
	width: 60%;
	position: absolute;
	bottom: 5%;
	left: 50%;
		transform: translateX(-50%); 
  -webkit-transform: translateX(-50%);
}


.merit_image img{
	width: 100%;
}

p.com_merit{
	margin-top: 2rem;
	font-size: 1.12rem;
	font-weight: 500;
	text-align: center;
}


/* ------ merit table------- */


.table_box{
	margin-top: 2rem;
  overflow-x: auto;
  width:100%;
  -webkit-overflow-scrolling: touch;
}
table.merit_table {
  border-collapse: collapse;
  border-spacing: 0;
  width: 100%;
}
table.merit_table th,
table.merit_table td{
  vertical-align: middle;
  padding: 20px;
  border: 1px solid var(--gray);
/*  font-size: 14px;*/
  /*white-space: nowrap;*/
}
table.merit_table th {
  background: var(--green);
	color: #fff;
	text-align: center;
}
table.merit_table td {
  background: var(--green02);

	
}
p.indent{
		text-indent: -1em;
   padding-left: 1em;
}
.evenly{
	/*width: 20%;*/
	min-width: 300px;
/*	max-width: 50vw;*/
}
.sticky {
  position: sticky;
  top: 0;
  left: 0;
  background: none;
  border-left: none;
  border-right: none;
	width: fit-content;
	white-space: nowrap;
}
.sticky::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--green);
  z-index: -1;
}

/* ------ graph------- */

.graph_item{
	width: 48%;
}

.graph{
	width: 100%;
}

.graph img{
	width: 100%;
}


/* ------ interview------- */

ul.flex_interview li{
	width: 48%;
	border: 1px solid var(--gray);
}

ul.flex_interview li:nth-child(n+3){
	margin-top: 2rem;
}

.interview_boxtop{
	background-color: var(--green02);
	border-bottom: 1px solid var(--gray);
	padding: 1.5rem 1rem;
	font-weight: 600;
	align-items: center;
	justify-content: flex-start;
}



.interview_img{
	width: 20%;
	max-width: 100px;
	margin: 1rem  auto 1rem;
}

.interview_img img{
	width: 100%;
	max-width: 100px;
}

p.interview_text{
	margin: 0 1rem 1.5rem;
}


/* ------ jjc's merit------- */

p.jjcmerit_top{
	font-weight: 500;
	font-size: 1.33rem;
}

.jjcmerit_box{
	margin-top: 3rem;
	align-items: center;
	flex-wrap: nowrap;
	width: 100%;
}

.jjcmerit_text{
	width: 68%;
}

.merit_title {
	font-size: 1.33rem;
	letter-spacing: 0.1em;
	margin-bottom: 2rem;
	font-weight: bold;

}

.merit_title span.merit_number {
	display: flex;
	align-items: center;
	color: var(--green);
	text-transform: uppercase;
	font-weight: 500;
	font-size: 0.9rem;
}

.merit_title span.merit_number::before {
	content: '';
	display: inline-block;
	margin-right: 20px;
	width: 40px;
	height: 1px;
	background-color: var(--green);
}

span.under_line{
	/*color: var(--pink);*/
	/*font-size: 1.33rem;*/
	letter-spacing: 0.1em;
	/*line-height: 3rem;*/
	
	background: linear-gradient(transparent 70%, yellow 70%);
	width: fit-content;
	color: #707070;
}

span.merit_under_line{
	font-size: 1.33rem;
	line-height: 3rem;
}

.jjcmerit_image{
	width: 30%;
	min-width: 30%;
}

.jjcmerit_image img{
	width: 100%;
}

ul.merit4_flex{
	justify-content: flex-start;
}

ul.merit4_flex li{
	background-color: #fff;
	padding: 0.6em 1.2em;
	width: fit-content;
	border-radius: 50vh;
	border: solid 2px var(--green);
	margin: 0.6rem 1.2rem 0 0; 
}

.subject_area{
	margin-top: 3rem;
}

p.target_subject{
/*	font-weight: 500;*/
	text-indent: -1em;
    padding-left: 1em;
	/*line-height: 1.5em;*/
}

span.subject_pink{
	color: #E04696;
}

span.subject_green{
	color: #91CC62;
}

span.target_subject_a,
span.target_subject_b{
	background-color: #f46f89;
	color: #fff;
	font-size: 0.8rem;
	margin-right: 0.5rem;
	padding: 0.2em 0.6em;
	font-weight: normal;
}

span.target_subject_b{
	background-color: #ffac66; 
}


ul.subject_list{
	margin-top: 1rem;
	align-items: flex-start;
}

ul.subject_list li{
	/*width: 30%;*/
	width: 23%;
	border: 1px solid var(--gray);
}

ul.subject_list li:nth-child(n+5){
	margin-top: 2rem;
}

.subject_image{
	position: relative;
}

.target_subject_banner_a,
.target_subject_banner_b{
	position: absolute;
	bottom: 1.2rem;
	left: 0;
	background-color: #f46f89;
	color: #fff;
/*	border: solid 1.5px #ff4f89;*/
	font-size: 0.6rem;
	padding: 0.3em 0.6em;
}

.target_subject_banner_b{
	bottom: 0;
	left: 0;
	background-color: #ffac66;
}

.subject_image img{
	width: 100%;
}

/*アコーディオンタイトル*/
.subject_name{
    position: relative;/*+マークの位置基準とするためrelative指定*/
    cursor: pointer;
    font-weight: normal;
/*    padding: 0.5rem 1rem;*/
	padding: 0.5rem;
    transition: all .5s ease;
	line-height: 1.3rem;
	font-size: clamp(13px, 1.5vw, 16px);
}

span.year1_course,
span.year2_course,
span.year3_course,
span.year4_course{
	background-color: var(--green);
	color: #fff;
	font-size: 0.6rem;
	padding: 0.3em 0.9em;
	vertical-align: top;
	margin-right: 0.5rem;
	
	border-radius: 50vh;
}

/*span.year2_course{
	background-color: #6d8e8f;
}

span.year3_course{
	background-color: #6d8e8f;
}

span.year4_course{
	background-color: #6d8e8f;
}*/


/*アイコンの＋と×*/
.subject_name::before,
.subject_name::after{
    position: absolute;
    content:'';
    width: 15px;
    height: 2px;
    background-color: #333;
    
}
.subject_name::before{
    top:48%;
    right: 15px;
    transform: rotate(0deg);
    
}
.subject_name::after{    
    top:48%;
    right: 15px;
    transform: rotate(90deg);

}
/*　closeというクラスがついたら形状変化　*/
.subject_name.close::before{
	transform: rotate(45deg);
}

.subject_name.close::after{
	transform: rotate(-45deg);
}

/*アコーディオンで現れるエリア*/
.subject_course {
    display: none;/*はじめは非表示*/
    background: var(--green02);
    padding: 0.5rem 1rem;
	font-size: 0.8rem;

}



/* ------ voice------- */

.voice_box{
	align-items: center;
	padding: 2rem 8%;
}

.voice_image{
	width: 30%;
}

.voice_image img{
	width: 100%;
}

.voice_text{
	width: 65%;
}

.voice_text_top{
	padding-bottom: 1rem;
	border-bottom: 1px solid var(--gray);
	font-weight: 500;
}

.voice_text_top > p > span.name {
	font-size: 1.3rem;
	color: #707070;
	font-weight: 600;
}

.voice_text_bottom{
	padding-top: 1rem;
}

p.voice_title{
	font-weight: 600;
	font-size: 1.23rem;
	color: var(--pink);
}


/* ------ backup------- */



ul.backup_flex li{
	width: 45%;
	border: 1px solid var(--gray);
}

ul.backup_flex li:nth-child(n+3){
	margin-top: 2rem;
}

.buckup_number{
	width: 20%;
}

p.backup_title{
	width: 80%;
	padding: 1rem;
	font-weight: 500;
	font-size: 1.33rem;
	background-color: var(--green02);
	display: flex;
	align-items: center;
	letter-spacing: 0.1em;
}


.backup_bottom{
	align-items: center;
	padding: 1.5rem 1rem;
}

.backup_image{
	width: 45%;
	max-width: 200px;
}

.backup_image img{
	width: 100%;
	max-width: 200px;
}

.backup_text{
	width: 50%;
}

/* ------ faq------- */

ul.faq_list li{
	border: 1px solid var(--gray);
}

ul.faq_list li + li{
	margin-top: 2rem;
}

/*アコーディオンタイトル*/
.faq_q{
    position: relative;/*+マークの位置基準とするためrelative指定*/
    cursor: pointer;
    font-weight: 500;
    padding: 2rem 2rem 2rem 1rem;
    transition: all .5s ease;
	background-color: var(--green02);
	text-indent: -2em;
   padding-left: calc(2em + 1rem);
}

/*アイコンの＋と×*/
.faq_q::before,
.faq_q::after{
    position: absolute;
    content:'';
    width: 15px;
    height: 2px;
    background-color: #333;
    
}
.faq_q::before{
    top:48%;
    right: 1rem;
    transform: rotate(0deg);
    
}
.faq_q::after{    
    top:48%;
    right: 1rem;
    transform: rotate(90deg);

}
/*　closeというクラスがついたら形状変化　*/
.faq_q.close::before{
	transform: rotate(45deg);
}

.faq_q.close::after{
	transform: rotate(-45deg);
}

/*アコーディオンで現れるエリア*/
.paq_a {
    display: none;/*はじめは非表示*/
    background: #FDFFFC;
    padding: 2rem 1rem;
   text-indent: -2em;
   padding-left: calc(2em + 1rem);
}



/* ------ link------- */
.link_flex > a{
	width: 30%;
}

a .link{
	padding: 1.5rem 1rem;
	background-color: var(--green02);
	border: 2px solid #fff;
	box-shadow: 7px 7px 0px 0px var(--green);
	position: relative;
	text-align: center;
	transition: 0.3s ease-in-out;
}
a .link:hover {
	box-shadow: none;
	transform: translate(7px, 7px);
}


.click_ {
  height: 30px;
  width: 30px;
  clip-path: polygon(100% 0, 0% 100%, 100% 100%);
	background-color: var(--green);
	position: absolute;
	bottom: 0;
	right: 0;
}

p.link_subtitile{
	letter-spacing: 0.1em;
	font-size: clamp(14px, 1vw, 18px);
	margin-bottom: 0.5rem;
}

p.link01{
	font-size: clamp(20px, 2vw, 30px);
	font-weight: 800;
	color: #fff;
	letter-spacing: 0.2em;
/*	text-shadow: -2px -2px 0 var(--pink), 2px -2px 0 var(--pink), -2px 2px 0 var(--pink), 2px 2px 0 var(--pink);*/
	 -webkit-text-stroke: 5px var(--pink);
  text-stroke: 5px var(--pink);
	paint-order: stroke;

}

p.link01 > span{
	font-size: clamp(15px, 1vw, 18px);
	 -webkit-text-stroke: 4px var(--pink);
  text-stroke: 4px var(--pink);
	paint-order: stroke;
	letter-spacing: 0.1em;
	padding-right: 1em;
}


.request_banner{
    width: 40vw;
    max-width: 400px;
    min-width: 300px;
    position: fixed;
    bottom: 80px;
    right: 10px;
    z-index: 99;
}

.request_banner img{
    width: 100%;
    max-width: 400px;
    min-width: 300px;
}

/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++

    TABLET

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */



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


    
/* ----------------------------------------------------------
   MAIN VISUAL AREA
---------------------------------------------------------- */
ul.target_audience li{
	font-size: clamp(15px, 2vw, 23px);
}
	
.target_audience_position > p{
	font-size: clamp(15px, 2vw, 23px);
}
	
	
h2.fv_text{
	font-size: clamp(23px, 3vw, 40px)
}
	
/* ------ catch area ------- */

ul.worries_list li{
	font-size: clamp(16px, 2vw, 25px);
}

	
h3.catch_title{
	font-size: clamp(16px, 3vw, 30px);
}
	
.number {
    width: 20%;
/*    background-color: var(--green);
    color: #fff;
    position: relative;*/
}

	
.number > p {
	font-size: clamp(16px, 2vw, 30px);
}

p.merit_text{
	font-size: clamp(13px, 1vw, 16px);
	width: 80%;
}
	
p.com_merit{
	font-size: clamp(1rem, 2vw, 1.12rem);
}
	
.interview_boxtop{
	font-size: clamp(15px, 2vw, 18px);
}
	
/* ------ jjc's merit------- */

p.jjcmerit_top{
	font-size: clamp(1rem, 2.5vw, 1.33rem);
}
	

.merit_title {
	font-size: clamp(1rem, 2vw, 1.33rem);
}

.merit_title span.merit_number {
	font-size: clamp(13px, 2vw, 16px);
}

span.merit_under_line{
	font-size: clamp(1rem, 2vw, 1.33rem);
/*	font-size: 1.33rem;
	line-height: 3rem;*/
}
	
ul.merit4_flex li{
	font-size: clamp(13px, 1.5vw, 18px);
}
	
p.voice_title{
	font-size: clamp(16px, 2vw, 22px);
}
	
.voice_text_top > p > span.name {
	font-size: clamp(16px, 2vw, 22px);
}
/* ------ backup------- */



p.backup_title{
	font-size: clamp(16px, 2vw, 22px);
}

	
}


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

/* ------ jjc's merit------- */	
	
ul.subject_list li{
	width: 45%;

}

ul.subject_list li:nth-child(n+3){
	margin-top: 2rem;
}	
	
.target_subject_banner_a,
.target_subject_banner_b{
/*	position: absolute;
	bottom: 1.2rem;
	left: 0;
	background-color: #f46f89;
	color: #fff;
	font-size: 0.6rem;
	padding: 0.3em 0.6em;*/
	font-size: clamp(10px, 1vw, 15px); 
}
	

}

	
@media only screen and (max-width: 1000px){
	
/* ------ merit ------- */
ul.merit_box li{
	width: 45%;
}
		
ul.merit_box li:nth-child(n+3){
	margin-top: 2rem;
}
		
p.merit_text{
	font-size: clamp(15px, 1.5vw, 18px);
}
	
.number > p {
	font-size: clamp(25px, 2vw, 30px);
}

p.merit_text{
	font-size: clamp(13px, 2vw, 18px);
	width: 80%;
}
	

	
/* ------ link------- */
.link_flex > a{
	width: 100%;
	max-width: 500px;
	margin: 0 auto;
}

	.link_flex > a + a{
		margin-top: 2rem;
	}
	
}




	
	@media only screen and (max-width: 750px){
		
.fv_content{
	background-position: 80% center;
}
		
	.fv_wrapper{
		width: 100%;
		height: auto;
		min-height: auto;
		margin: 0;
		padding-top: 4rem;
}
		
/* ------ catch area ------- */


.worries_illust{
	width: 20%;
	margin-top: 1rem;
}
		
		.worries_illust.men{
			order: 2;
		}
		
		.worries_illust.women{
			order: 3;
		}


.worries_arae{
	width: 100%;
	order: 1;
}



ul.worries_list li{
	font-size: clamp(16px, 2vw, 25px);
}


/* ------ merit ------- */
/*ul.merit_box li{
	width: 45%;
}
		
		ul.merit_box li:nth-child(n+3){
			margin-top: 2rem;
		}
		
		p.merit_text{
	font-size: clamp(15px, 1.5vw, 18px);
}*/
		
/* ------ graph------- */

.graph_item{
	width: 100%;
}
		
		.graph_item02{
			margin-top: 3rem;
		}

.graph{
	width: 100%;
	max-width: 500px;
	margin: 0 auto;
}

.graph img{
	width: 100%;
	max-width: 500px;
}
		
/* ------ interview------- */

ul.flex_interview li{
	width: 100%;
}

ul.flex_interview li:nth-child(n+2){
	margin-top: 2rem;
}

		
.interview_img{
	width: 10%;
	min-width: 50px;
	margin: 1rem auto;
}

.interview_img img{
	min-width: 50px;
}



/* ------ voice------- */



.voice_image{
	margin: 0 auto 1rem;
	width: 100%;
	max-width: 200px;
}

.voice_image img{
	max-width: 200px;
}

.voice_text{
	width: 100%;
}

/* ------ backup------- */


ul.backup_flex li{
	width: 100%;
}

ul.backup_flex li:nth-child(n+2){
	margin-top: 2rem;
}

.buckup_number{
	width: 10%;
}

p.backup_title{
	width: 90%;
}


.backup_image{
	width: 30%;
}


.backup_text{
	width: 65%;
}
		

/* ------ faq ------- */
.faq_q{
	padding-right: 3rem;
}


}

    
    
    
/* ----------------------------------------------------------
   CONTENTS AREA - TA
---------------------------------------------------------- */




/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++

    SMART PHONE

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */



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


/* ------ catch area ------- */
	
.worries_illust{
	width: 30%;
}
		

ul.worries_list{
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
}
	
ul.worries_list li{
	font-size: 1rem;
}



ul.worries_list li + li{
	margin-left: 0;
	margin-top: 1rem;
}

	

.triangle {
	width: 15vw;
/*  height: 5vh;
  width: 10vw;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
	background-color: #fff;
	position: absolute;
	top: 0;
	left: 50%;
	  transform: translateX(-50%); 
  -webkit-transform: translateX(-50%);*/
	}


/* ------ merit ------- */
	
.number {
    width: 25%;
/*    background-color: var(--green);
    color: #fff;
    position: relative;*/
}


p.merit_text{
	width: 75%;
	font-size: 1rem;
}

	span.jjcmerit_pink{
		font-size: 1.2rem;
	}
	
/* ------ merit table------- */


table.merit_table th,
table.merit_table td{
	padding: 10px;
	font-size: 13px;
/*  vertical-align: middle;
  padding: 20px;
  border: 1px solid var(--gray);*/
/*  font-size: 14px;*/
  /*white-space: nowrap;*/
}
	
	.evenly{
	/*width: 20%;*/
	/*min-width: 300px;*/
		min-width: 200px;
/*	max-width: 50vw;*/
}

	
/* ------ interview------- */
/*	横スクロール*/
	
ul.flex_interview{
	flex-wrap: nowrap;
	overflow-x: auto;
	max-width: 100%;
}
ul.flex_interview > li{
	flex: none;
	width: 85%;
}
	
ul.flex_interview li:nth-child(n+2){
	margin-top: 0;
}


ul.flex_interview > li + li{
	margin-left: 1rem;
}


	

/* ------ jjc's merit------- */	
	
.jjcmerit_box{
	flex-wrap: wrap;
}

.jjcmerit_text{
	width: 100%;
}
	
.merit_title {
	font-size: 1.2rem
}


	
.jjcmerit_image{
	width: 100%;
	min-width: auto;
	margin-top: 1rem;
}

	

ul.subject_list li{
	width: 100%;
}
	
	.subject_image{
		max-height: 200px;
	}
	
	.subject_image img{
		max-height: 200px;
		object-fit: cover;
	}

ul.subject_list li:nth-child(n+2){
	margin-top: 2rem;
}	
    
.target_subject_banner_a,
.target_subject_banner_b{
/*	position: absolute;
	bottom: 1.2rem;
	left: 0;
	background-color: #f46f89;
	color: #fff;
	font-size: 0.6rem;
	padding: 0.3em 0.6em;*/
	bottom: calc(10px + 0.6rem);
}
    
	.target_subject_banner_b  {
		bottom: 0;
	}
	
.subject_name {
/*    position: relative;
    cursor: pointer;
    font-weight: normal;
    padding: 0.5rem;
    transition: all .5s ease;
    line-height: 1.3rem;
    font-size: clamp(13px, 1.5vw, 16px);*/
	line-height: 1.5rem;
}
	
span.year1_course,
span.year2_course,
span.year3_course,
span.year4_course{
/*	background-color: var(--green);
	color: #fff;
	font-size: 0.6rem;
	padding: 0.3em 0.9em;
	vertical-align: top;
	margin-right: 0.5rem;
	
	border-radius: 50vh;*/
	font-size: 0.7rem;
}
	
	
	/* ------ voice------- */
/*	横スクロール*/
	
/*ul.flex_interview{
	flex-wrap: nowrap;
	overflow-x: auto;
	max-width: 100%;
}
ul.flex_interview > li{
	flex: none;
	width: 85%;
}
	
ul.flex_interview li:nth-child(n+2){
	margin-top: 0;
}


ul.flex_interview > li + li{
	margin-left: 1rem;
}*/
	
	.sp_flex{
		display: flex;
		flex-wrap: nowrap;
		overflow-x: auto;
		max-width: 100%;
		align-items: stretch;
		margin-top: 1rem;
	}
	

.voice_box{
	flex: none;
	width: 85%;
	align-items: flex-start;
	justify-content: flex-start;
	align-content: flex-start;
/*	align-items: center;
	padding: 2rem 8%;*/
}

.voice_image{
	/*width: 30%;*/
}

.voice_image img{
	/*width: 100%;*/
}

.voice_text{
/*	width: 65%;*/
}

.voice_text_top{
/*	padding-bottom: 1rem;
	border-bottom: 1px solid var(--gray);
	font-weight: 500;*/
}

.voice_text_top > p > span.name {
/*	font-size: 1.3rem;
	color: #707070;
	font-weight: 600;*/
}

.voice_text_bottom{
	/*padding-top: 1rem;*/
}

p.voice_title{
/*	font-weight: 600;
	font-size: 1.23rem;
	color: var(--pink);*/
}
	
/*.voice_image{
	margin: 0 auto 1rem;
	width: 100%;
	max-width: 200px;
}

.voice_image img{
	max-width: 200px;
}

.voice_text{
	width: 100%;
}
*/
	
/* ------ backup------- */
.buckup_number{
	width: 10%;
}
	
    .number > p {
        font-size: clamp(18px, 2vw, 25px);
    
}
    

.request_banner{
    bottom: 10px;
    left: 10px;
    min-width: 250px;
/*    width: 40vw;
    max-width: 400px;
    min-width: 300px;
    position: fixed;
    bottom: 80px;
    right: 10px;
    z-index: 99;*/
}

.request_banner img{
/*    width: 100%;
    max-width: 400px;
    min-width: 300px;*/
    min-width: 250px;
}

}
	
	
/*** END ***/	
	
	
	
