.fadeIn { opacity: 0; transform: translate(0, 50%); transition: 1s;}
.fadeIn.is-show { transform: translate(0, 0); opacity: 1; }
@media only screen and (max-width:800px){
	#content{overflow-x:hidden!important;}
	body{overflow-x:hidden!important;}
}

/*=============================================
  TOPPAGE
=============================================*/
#toppage .inner { margin: auto; padding:100px 0; width: 90%; max-width: 1200px;}
#toppage img { width: 100%; height: auto;}
#toppage h3 { font-weight: 500;}
#toppage h4 { font-weight: 500;}
#toppage h5 { font-weight: 500;}
#toppage .fs50 { font-size: 312.5%;}
#toppage .fs40 { font-size: 250%;}
#toppage .fs32 { font-size: 200%}
@media only screen and (max-width:768px){
    #toppage .fs50 { font-size: 225%;}
	#toppage .fs40 { font-size: 200%;}
    #toppage .fs32 { font-size: 137%}
}



.bg_emerald { background: #019796;}
.bg_gray { background: #EFEFEF;}
.bg_skyblue { background: #34B2D1;}
.bg_darkblue { background: #0B3A7B;}
@media only screen and (max-width:800px){
}



#toppage .entry_btn { text-align: center; font-weight: 500;}
#toppage .entry_btn span { display: block; font-size: 187.5%; margin-bottom:40px;}
#toppage .entry_btn a {
    display: block;
    margin: auto;
    padding: 20px;
    max-width: 600px;
    font-size: 250%;
    color: #fff;
    text-decoration: none;
    background: linear-gradient(#1EBE80, #005A7B);
    border: 2px solid #fff;
    border-radius: 50px;
    box-shadow: 0px 3px 3px 0px rgba(0, 0, 0, 0.15);
}
@media only screen and (max-width:768px){
    #toppage .entry_btn a:hover { opacity: 0.7;}
}
@media only screen and (max-width:768px){
    #toppage .entry_btn span { font-size: 150%; margin-bottom: 20px;}
    #toppage .entry_btn a { font-size:187.5%;}
}



#toppage .search_btn { margin: auto; width: 100%; max-width: 600px; text-align: center;}
#toppage .search_btn a {
	display: block;
	padding: 20px;
	color: #fff;
	font-size: 125%;
	font-weight: 600;
	text-decoration: none;
	border: 3px solid #fff;
	border-radius: 60px;
}
@media only screen and (min-width:768px){
    #toppage .search_btn a:hover { color: #000; background: #fff;}
}


#toppage .fix_bana { display: none;}
@media only screen and (max-width:768px){
	#toppage .fix_bana {
		position:fixed; left: 0; bottom:0; z-index: 999;
		display: flex; flex-wrap: wrap; gap:10px;
		padding: 20px;
		width: 100%;
	}
	#toppage .fix_bana span { display: block;}
	#toppage .fix_bana span a {
		display: block;
		padding: 10px;
		color: #fff;
		font-weight: 600;
		text-align: center;
		text-decoration: none;
		border: 2px solid #fff;
		border-radius: 50px;
		box-shadow: 0px 3px 3px 0px rgba(0, 0, 0, 0.15);
	}
	#toppage .fix_bana span:nth-child(1) { width:100%;}
	#toppage .fix_bana span:nth-child(2) { width: calc(55% - 10px);}
	#toppage .fix_bana span:nth-child(1) a { background: linear-gradient(#BBD672, #28CBA5);}
	#toppage .fix_bana span:nth-child(2) a { background: linear-gradient(#7BC7FF, #09007B);}
}


#toppage #top_bana {
	position:fixed; right: 5%; bottom:5%; z-index:9999;
	width: 25%; max-width:330px;
}
@media only screen and (max-width:768px){
	#toppage #top_bana { display: none !important;;}
}

/*-----------------------------------------------------------------------------------
  MAINIMG
-----------------------------------------------------------------------------------*/
#content { padding: 0 !important;}
#toppage .mainimg { position: relative; z-index: 9;}
#toppage .mainimg .pc {
	background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2025/04/mainimg_bg.jpg") no-repeat center center;
	background-size: cover;
}
#toppage .mainimg .logo {
	margin: auto; padding: 150px 0 0;
	width:70%; max-width: 1100px;
}
@media only screen and (max-width:768px){
	#toppage .mainimg .bana { width:40%;}
}


/*-----------------------------------------------------------------------------------
  SLIDER1
-----------------------------------------------------------------------------------*/
#toppage .slider1 { position: relative; z-index:99;}
#toppage .slider1 img { width:100%; height: auto;}
#toppage .slider1 ul {
	margin: auto; display: flex; gap:20px; width: 70%; max-width:1169px;
	position: absolute; top:-100px; left: 0; z-index: 9;
}
#toppage .slider1 ul li { width: calc(50% - 10px); }
@media only screen and (max-width:768px){
	#toppage .slider1 ul { width:90%;}
}
@media only screen and (max-width:468px){
	#toppage .slider1 ul { top:-80px;} 
}


/*
#toppage .slider1 ul {
	position: absolute; top:-100px; left: 0; z-index: 9;
    display: flex; align-items: center; gap: 20px;
    margin: 0 auto;
    width: 100%;
    position: relative;
    width: max-content;
    overflow: hidden;
}
#toppage .slider1 ul.slider1_1 {
    animation: loopAnimation1_1 40s linear infinite;
}
@keyframes loopAnimation1_1 {
    0% { transform: translate(0%); }
    100% { transform: translate(-50%); }
}

@media only screen and (max-width:1000px){
	#toppage .slider1 img { width:400px;}
}
@media only screen and (max-width:768px){
	#toppage .slider1 img { width:300px;}
}
@media only screen and (max-width:468px){
	#toppage .slider1 ul { top:-50px;}
	#toppage .slider1 img { width:250px;}
}
*/




/*-----------------------------------------------------------------------------------
  INTRODUCTION
-----------------------------------------------------------------------------------*/
#toppage .introduction {  position: relative; z-index: 9; overflow: hidden;}
#toppage .introduction .inner {
	position:relative;
	display: flex; flex-direction: column; gap:60px;
	padding-top: 300px;
}
#toppage .introduction .inner::before,
#toppage .introduction .inner::after {
    position: absolute;
    display: block; clear: both; content:"";
    background-size: 100% auto !important;
}
#toppage .introduction .inner::before{
    right:-10%; top:60px;
    width: 40%; max-width: 428px;
    aspect-ratio: 428 / 734;
    background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2025/04/tokuten_kazari1.png") no-repeat;
}
#toppage .introduction .inner::after {
    left:-10%; bottom: 60px;
    width: 40%; max-width: 407px;
    aspect-ratio: 407 / 880;
    background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2025/04/tokuten_kazari2.png") no-repeat;
}
#toppage .introduction h3 { position: relative; z-index: 2; text-align: center; font-weight: 600;}
#toppage .introduction .come { position: relative; z-index: 2; text-align: center; font-size: 137%; line-height: 200%;}
@media only screen and (max-width:968px){
	#toppage .introduction .inner { padding-top: 200px;}
}
@media only screen and (max-width:768px){
	#toppage .introduction .inner { padding-top: 100px;}
	#toppage .introduction h3 { font-size: 200%; }
	#toppage .introduction .come {font-size: 100%;}
}




/*-----------------------------------------------------------------------------------
  JOB
-----------------------------------------------------------------------------------*/
#toppage .job .inner { display: flex; flex-direction: column; gap:60px;}
#toppage .job h3 { color: #fff; text-align: center;}
#toppage .job .job_list { display: flex; flex-wrap: wrap; gap:50px 4.15%;}
#toppage .job .job_list p { width: 30.56%;}
#toppage .job .job_list p a {
    display: block;
    height: 100%;
    padding: 10px 20px 25px;
    background: #fff;
    border:4px solid #000;
}
#toppage .job .job_list p span:nth-child(1) { display: block; font-size: 87.5%; padding: 0 15px 10px;}
#toppage .job .job_list p span:nth-child(2) { display: flex; gap:20px;}
#toppage .job .job_list p span:nth-child(2) img { width: 30%;}
#toppage .job .job_list p span:nth-child(2) b { font-size: 150%;}
#toppage .job .job_list p a { text-decoration: none; color: #000;}
#toppage .job .job_list p span { display: block;}
#toppage .job .job_list p span:nth-child(1) { padding-bottom: 10px;}
#toppage .job .job_list p span:nth-child(2) { padding-left: 130px; width:100%; min-height: 100px;}
#toppage .job .job_list p:nth-child(1) span:nth-child(2) { background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2025/04/icon_01.png") no-repeat left top;}
#toppage .job .job_list p:nth-child(2) span:nth-child(2) { background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2025/04/icon_02.png") no-repeat left top;}
#toppage .job .job_list p:nth-child(3) span:nth-child(2) { background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2025/04/icon_03.png") no-repeat left top;}
#toppage .job .job_list p:nth-child(4) span:nth-child(2) { background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2025/04/icon_04.png") no-repeat left top;}
#toppage .job .job_list p:nth-child(5) span:nth-child(2) { background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2025/04/icon_05.png") no-repeat left top;}
#toppage .job .job_list p:nth-child(6) span:nth-child(2) { background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2025/04/icon_06.png") no-repeat left top;}
#toppage .job .job_list p:nth-child(7) span:nth-child(2) { background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2025/04/icon_07.png") no-repeat left top;}
@media only screen and (min-width:768px){
    #toppage .job .job_list p a:hover {
        color: #fff;
        background: #01BDC2;
        border:4px solid #fff;
    }
#toppage .job .job_list p:nth-child(1) a:hover span:nth-child(2) { background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2025/04/icon_01w.png") no-repeat left top;}
#toppage .job .job_list p:nth-child(2) a:hover span:nth-child(2) { background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2025/04/icon_02w.png") no-repeat left top;}
#toppage .job .job_list p:nth-child(3) a:hover span:nth-child(2) { background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2025/04/icon_03w.png") no-repeat left top;}
#toppage .job .job_list p:nth-child(4) a:hover span:nth-child(2) { background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2025/04/icon_04w.png") no-repeat left top;}
#toppage .job .job_list p:nth-child(5) a:hover span:nth-child(2) { background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2025/04/icon_05w.png") no-repeat left top;}
#toppage .job .job_list p:nth-child(6) a:hover span:nth-child(2) { background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2025/04/icon_06w.png") no-repeat left top;}
#toppage .job .job_list p:nth-child(7) a:hover span:nth-child(2) { background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2025/04/icon_07w.png") no-repeat left top;}
}
@media only screen and (max-width:1060px){
	#toppage .job .job_list p { width: calc(50% - 2.75%);}
}
@media only screen and (max-width:768px){
	#toppage .job .job_list { gap:40px;}
	#toppage .job .job_list p { width:100%;}
}
@media only screen and (max-width:468px){
	#toppage .job .job_list { gap:20px;}
	#toppage .job .job_list p span:nth-child(2) { padding-left: 70px; min-height:50px; background-size: 50px auto !important;}
}



/*-----------------------------------------------------------------------------------
  KIGYO
-----------------------------------------------------------------------------------*/
#toppage .kigyo h3 { text-align: center; margin-bottom: 60px;}
#toppage .kigyo .kigyo_list { display: flex; flex-wrap: wrap; gap:20px 40px;}
#toppage .kigyo .kigyo_list p { display: flex; gap:10px; width: calc( 33.3% - 26.66px);}
#toppage .kigyo .kigyo_list p a { padding-bottom: 10px; font-size: 112.5%; line-height: 1.2; color: #000; text-decoration: none;}
#toppage .kigyo .kigyo_list .kaijyo { min-width: 85px; overflow: hidden;}
#toppage .kigyo .kigyo_list .kaijyo img + img { margin-left: 5px;}
#toppage .kigyo .kigyo_list .kaijyo img { float: left; width: auto; height:26px;}
@media only screen and (min-width:768px){
    #toppage .kigyo .kigyo_list p a:hover { text-decoration: underline;}
}
@media only screen and (max-width:768px){
    #toppage .kigyo .kigyo_list p { width: calc( 50% - 20px);}
	#toppage .kigyo .kigyo_list p a { font-size: 100%;}
}
@media only screen and (max-width:468px){
    #toppage .kigyo .kigyo_list p { width: 100%;}
}



/*-----------------------------------------------------------------------------------
  NAYAMI
-----------------------------------------------------------------------------------*/
#toppage .nayami .inner { padding: 50px 0; max-width: 1300px;}
#toppage .nayami .nayami_box {
    padding: 0 0 60px;
    background: #37B4BF;
    border-radius: 30px;
    border: 5px solid #000;
}
#toppage .nayami h3 {
    position: relative; top:-40px;
    margin: auto; padding: 20px 0;
    width:70%; max-width: 1000px;
    font-size: 250%;
	font-weight: 600;
    text-align: center;
    background: #fff;
    border-radius: 60px;
    border: 5px solid #000;
}
#toppage .nayami .mainphoto { margin: auto; width: 90%; max-width: 1118px;}
#toppage .nayami h4 {
    margin: auto;
    width: 82%;
    padding:  40px;
    font-size: 250%;
	font-weight: 600;
    line-height: 120%;
    text-align: center;
    background: #fff;
    border-radius: 60px;
}
#toppage .nayami h4 span { display: inline-block;}
#toppage .nayami .box {
    display: flex; flex-wrap: wrap; gap:40px;
    padding:60px 0 60px 9%;
}
#toppage .nayami .box .photo { width: 35%;}
#toppage .nayami .box .come { width: calc(100% - 35% - 40px);}
#toppage .nayami .come h5 {  font-size: 200%; text-align: left; }
#toppage .nayami .come h5 span { display: inline-block; margin: 0 0 10px; padding: 10px; background: #FFFF00;}
#toppage .nayami .come ul {
    display: flex; flex-direction: column; gap:20px;
    margin: 30px 0;
}
#toppage .nayami .come ul li { 
    padding-left: 40px;
    font-size: 125%;
    color: #fff;
    line-height: 24px;
    background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2025/04/nayami_check.png") no-repeat;
}
#toppage .nayami .come p span,
#toppage .nayami .come p a {
    display: block;
    padding:20px 20px 20px 40px;
    font-size: 125%;
	font-weight: 600;
    color: #fff;
    text-decoration: none;
    line-height: 24px;
    background-color: #000 !important;
}
#toppage .nayami .come p a {
    padding-right: 90px; 
    background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2025/04/nayami_arrow.png") no-repeat 95% center;
}
@media only screen and (min-width:768px){
    #toppage .nayami .come p a:hover { opacity: 0.7;}
}
@media only screen and (max-width:1260px){
    #toppage .nayami h3,
    #toppage .nayami h4 { font-size:200%;}
    #toppage .nayami .come h5 {  font-size: 150%; }
    #toppage .nayami .come ul li { font-size: 112.5%;}
    #toppage .nayami .come p span,
    #toppage .nayami .come p a { font-size: 112.5%;}
    #toppage .nayami .come p a { padding-right: 70px; background-size:50px auto; }
}
@media only screen and (max-width:968px){
    #toppage .nayami h3 { width: 96%;}
    #toppage .nayami h4 { padding: 20px;}
    #toppage .nayami .box { margin: auto; padding:40px; width: 96%;}
}
@media only screen and (max-width:768px){
    #toppage .nayami h3,
    #toppage .nayami h4 { font-size:137%;}
    #toppage .nayami .box {
        flex-direction: column; gap:20px;
        padding:20px 5%;
    }
    #toppage .nayami .box .photo { width: 100%;}
    #toppage .nayami .box .come { width: 100%;}
    #toppage .nayami .come h5 {  font-size: 112.5%; }
    #toppage .nayami .come ul li { font-size: 100%; line-height: 120%; background-size: 25px auto;}
    #toppage .nayami .come p span,
    #toppage .nayami .come p a { padding:20px; font-size: 100%; }
    #toppage .nayami .come p a { padding-right: 50px; background-size: 30px auto;}
    #toppage .nayami .box + h4 { margin-top: 60px;}
}




/*-----------------------------------------------------------------------------------
  POINT
-----------------------------------------------------------------------------------*/
#toppage .point .inner { display: flex; flex-wrap: wrap; gap:60px 8.3%; text-align: center; }
#toppage .point .box {
    position: relative;
    padding: 80px 40px;
    width:calc(50% - 4.15%);
    background-color: #fff !important ;
    border-radius:30px;
    border: 5px solid #000;
}
#toppage .point .box h4 { font-size: 287.5%; font-weight: 600; line-height: 130%; margin-bottom: 40px;}
#toppage .point .box:nth-child(3) {
    width: 100%;
    background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2025/04/cafe.png") no-repeat right center;
    background-size: 25% auto;
}
#toppage .point .box:nth-child(2) h4 { padding: 20px 0;}
#toppage .point .box:nth-child(3) .come { margin: auto; padding: 0 20%; font-size: 112.5%;}
#toppage .point .box::before {
    position: absolute; top:-50px; left:-80px;
    display: block; clear: both; content:"";
    width: 200px; height: auto;
    aspect-ratio: 1 / 1;
    background-size: 100% auto !important;
}
#toppage .point .box:nth-child(1)::before { background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2025/05/point_fukudasi1.png") no-repeat left center;}
#toppage .point .box:nth-child(2)::before { background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2025/04/point_fukudasi2.png") no-repeat left center;}
#toppage .point .box:nth-child(3)::before { background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2025/04/point_fukudasi3.png") no-repeat left center;}
@media only screen and (max-width:1350px){
    #toppage .point .box::before { left: -20px; width:130px;}
}
@media only screen and (max-width:1000px){
    #toppage .point .box h4 { font-size: 225%;}
}
@media only screen and (max-width:768px){
    #toppage .point .inner { flex-direction: column; gap:40px; }
    #toppage .point .box { padding: 60px 40px; width: 100%;}
    #toppage .point .box::before { top:-30px;}
    #toppage .point .box:nth-child(2) h4 { padding:0;}
    #toppage .point .box:nth-child(3) .come { font-size: 100%;}
}
@media only screen and (max-width:468px){
    #toppage .point .box h4 { font-size:150%;}
    #toppage .point .box:nth-child(3) .come { padding: 0;}
    #toppage .point .box:nth-child(3) { background-position: right 40px;}
}



/*-----------------------------------------------------------------------------------
  SLIDER
-----------------------------------------------------------------------------------*/
#toppage .slider2 .inner { padding-top: 0; width: 100%; max-width: none;}
#toppage .slider2 img { width:auto;}
#toppage .slider2 ul {
    display: flex; align-items: center; gap: 40px;
    margin: 0 auto;
    width: 100%;
    position: relative;
    width: max-content; /* コンテンツ幅を可変にする */
	overflow: hidden;
}
#toppage .slider2 ul + ul { margin-top: 40px;}
#toppage .slider2 ul.slider2_1 {
    animation: loopAnimation2_1 55s linear infinite;
}
#toppage .slider2 ul.slider2_2 {
    animation: loopAnimation2_2 55s linear infinite;
}
@keyframes loopAnimation2_1 {
    0% { transform: translate(0%); }
    100% { transform: translate(-50%); }
}
@keyframes loopAnimation2_2 {
    0% { transform: translate(-50%); }
    100% { transform: translate(0%); }
}
@media only screen and (max-width:768px){
	#toppage .slider2 img { width:300px;}
}



/*-----------------------------------------------------------------------------------
  TOKUTEN
-----------------------------------------------------------------------------------*/
#toppage .tokuten .inner {
    position: relative;
    display: flex; flex-direction: column; gap:60px;
    padding-top: 60px;
    max-width: 1500px;
}
#toppage .tokuten .inner::before,
#toppage .tokuten .inner::after {
    position: absolute;
    display: block; clear: both; content:"";
    background-size: 100% auto !important;
}
#toppage .tokuten .inner::before{
    right:-10%; top:60px;
    width: 40%; max-width: 428px;
    aspect-ratio: 428 / 734;
    background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2025/04/tokuten_kazari1.png") no-repeat;
}
#toppage .tokuten .inner::after {
    left:-10%; bottom: 60px;
    width: 40%; max-width: 407px;
    aspect-ratio: 407 / 880;
    background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2025/04/tokuten_kazari2.png") no-repeat;
}
#toppage .tokuten h3,
#toppage .tokuten .tokuten_list,
#toppage .entry_btn { position: relative; z-index: 2;}
#toppage .tokuten h3 { display: flex; align-items: flex-end; justify-content: center; gap:20px; padding-right: 9%;}
#toppage .tokuten h3 span:nth-child(1) { width:9%; max-width:110px; min-width: 50px;}
#toppage .tokuten h3 span:nth-child(2) { width:33.3%; max-width: 400px; min-width:200px; margin-bottom: 20px;}
#toppage .tokuten .tokuten_list { display: flex; flex-direction: column; gap:50px;}
#toppage .tokuten .box {
    position: relative;
    display: flex; align-items: center; gap:40px;
    padding: 60px 100px 60px 250px;
    width: calc(100% - 20%);
    max-width: 1200px; min-height: 400px;
    background-color: #fff !important;
    border-radius: 600px;
}
#toppage .tokuten dl { display: flex; flex-direction: column; gap:40px;}
#toppage .tokuten dt { font-size: 250%; font-weight: 600; line-height: 120%;}
#toppage .tokuten dd b { font-size: 150%; display: block; margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid #000;}
#toppage .tokuten dd p { font-size: 125%; line-height: 180%;}
#toppage .tokuten .no01 { background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2025/04/voice_no01.png") no-repeat 60px center;}
#toppage .tokuten .no02 { background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2025/04/voice_no02.png") no-repeat 60px center; left:10%;}
#toppage .tokuten .no03 { background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2025/04/voice_no03.png") no-repeat 60px center; left:20%;}
@media only screen and (max-width:1500px){
    #toppage .tokuten .box { width: 100%; left: 0;}
}
@media only screen and (max-width:1000px){
	#toppage .tokuten .box { border-radius:50px;}
}
@media only screen and (max-width:768px){
    #toppage .tokuten .box { 
        padding: 60px 60px 60px 150px;
        min-height: inherit;
        background-position: 40px center;
        background-size:70px auto;
    }
    #toppage .tokuten dl { gap:20px;}
    #toppage .tokuten dt { font-size: 150%;}
	#toppage .tokuten dd b { font-size: 112.5%;}
	#toppage .tokuten dd p { font-size: 100%;}
}
@media only screen and (max-width:468px){
    #toppage .tokuten .box {
        padding: 120px 30px 60px;
        background-position:  center 20px;
    }
    #toppage .tokuten .tokuten_list { gap:30px;}
}




/*-----------------------------------------------------------------------------------
  VOICE
-----------------------------------------------------------------------------------*/
#toppage .voice .inner { display: flex; flex-direction: row-reverse; flex-wrap: wrap; align-items: flex-start; justify-content: space-between;}
#toppage .voice h3 {
    position: sticky; top:60px; right: 0;
    width:calc(40% - 5% ); max-width: 400px;
}
#toppage .voice .voice_list { 
    display: flex; flex-direction: column; gap:100px;
    width: 55%; max-width: 670px;
}
#toppage .voice .box { display: flex; flex-direction: column; gap:60px;}
#toppage .voice .profile { position: relative; display: flex; align-items: center; gap:30px;}
#toppage .voice .profile .photo { width: 30%; max-width: 200px;}
#toppage .voice .profile .come { width: 70%; display: flex; flex-direction: column; gap:20px; position: relative; z-index: 2;}
#toppage .voice .profile .come p:nth-child(1) { font-size: 200%; font-weight: 600; line-height: 32px;}
#toppage .voice .profile .come p:nth-child(2) { font-size: 112.5%; font-weight: 600; display: flex; flex-wrap: wrap; gap:0 20px;}
#toppage .voice .profile .come p:nth-child(3) { font-size: 112.5%;}
#toppage .voice .qa { display: flex; flex-direction: column; gap:60px;}
#toppage .voice .qa dl { display: flex; flex-direction: column; gap:30px;}
#toppage .voice .qa dl dt { position: relative; padding: 20px; color: #fff; text-align: center; background: #000; border-radius: 50px;}
#toppage .voice .qa dl dt { font-size: 125%; font-weight: 600;}
#toppage .voice .qa dl dd { font-size: 112.5%;}
#toppage .voice .voice1 dt { background: #01BDC2 !important;}
#toppage .voice .voice2 dt { background: #29A798 !important;}
#toppage .voice .profile::before { display: block; clear: both; content:""; position: absolute;}
#toppage .voice .voice1 .profile::before {
    left: -105px; bottom: -50px;
    width: 166px; height: 133px;
    background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2025/04/voice_kazari1.png") no-repeat;
}
#toppage .voice .voice2 .profile::before {
    right: -50px; bottom: -30px;
    width: 156px; height: 137px;
    background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2025/04/voice_kazari2.png") no-repeat;
}
#toppage .voice .qa dl dt::before {
    position: absolute; left: 0; bottom: 0;
    display: block; clear: both; content:"";
    width: 33px; height: 14px;
}
#toppage .voice .voice1 dt::before { background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2025/04/voice1_fukidasi.png") no-repeat;}
#toppage .voice .voice2 dt::before { background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2025/04/voice2_fukidasi.png") no-repeat;}
@media only screen and (max-width:768px){
    #toppage .voice .inner { flex-direction:column;}
    #toppage .voice h3 { position: static; margin: 0 auto 60px; width: 250px;}
    #toppage .voice .voice_list { width: 100%; margin: auto;}
	#toppage .voice .profile .come { gap:10px;}
	#toppage .voice .profile .come p:nth-child(1) { font-size: 150%;}
	#toppage .voice .profile .come p:nth-child(2) { font-size: 100%;}
	#toppage .voice .profile .come p:nth-child(3) { font-size: 100%;}
	#toppage .voice .qa { gap:40px;}
	#toppage .voice .qa dl { gap:15px;}
	#toppage .voice .qa dl dt { font-size: 112.5%;}
	#toppage .voice .qa dl dd { font-size: 100%;}
}
@media only screen and (max-width:468px){
	#toppage .voice .qa dl { gap:10px;}
	#toppage .voice .qa dl dd { padding:0 20px;}
}


/*-----------------------------------------------------------------------------------
  FAQ
-----------------------------------------------------------------------------------*/
#toppage .faq h3 { padding: 60px 0; text-align: center; color: #000; border-top: 5px solid #000; border-bottom: 5px solid #000;}
#toppage .faq .faq_list { display: flex; flex-wrap: wrap; flex-direction: column; gap:30px;}
#toppage .faq dl { padding:40px 60px;background: #fff;}
#toppage .faq dt { padding-right: 50px;}
#toppage .faq dt {
    position: relative;
    cursor: pointer;
    font-size:200%;
    font-weight:500;
    min-height: 35px;
    line-height: 130%;
}
#toppage .faq dd {
	display: none;
    font-size: 112.5%;
    line-height: 180%;
}
#toppage .faq dt.active { background:url("../img/accordion_on.png") no-repeat right top; background-size: 35px auto;}
#toppage .faq dt { background: url("../img/accordion_off.png") no-repeat right top; background-size: 35px auto;}
#toppage .faq dd .comment { padding-top: 20px;}
@media only screen and (max-width:768px){
    #toppage .faq .faq_list { gap:30px; }
    #toppage .faq dl { padding:40px;}
    #toppage .faq dt { font-size: 137%;}
    #toppage .faq dd { font-size:100%;}
}



/*-----------------------------------------------------------------------------------
ABOUT
-----------------------------------------------------------------------------------*/
#toppage .about h3 { padding-bottom: 60px; text-align: center;}
#toppage .about dl { display: flex; flex-wrap: wrap; align-items: center; gap:8.3%; border-bottom: 1px solid #000;}
#toppage .about dl:nth-child(1) { border-top: 1px solid #000;}
#toppage .about dt,
#toppage .about dd { padding: 20px 0; font-size: 125%;}
#toppage .about dt { width: calc(200px - 8.3%); text-align: center;}
#toppage .about dd { width: calc(100% - 200px);}
@media only screen and (max-width:768px){
    #toppage .about dt,
    #toppage .about dd { font-size: 100%;}
}
@media only screen and (max-width:468px){
    #toppage .about dt { width: calc(120px - 8.3%); }
    #toppage .about dd { width: calc(100% - 120px);}
}



/*-----------------------------------------------------------------------------------
  Access
-----------------------------------------------------------------------------------*/
#toppage .access h3 { padding: 60px 0; text-align: center; color: #fff; border-bottom: 5px solid #fff;}
#toppage .access .inner { display: flex; flex-wrap: wrap; gap:8.3%; text-align: center; }
#toppage .access .box {
    width:calc(50% - 4.15%);
    background: #fff;
    border-radius: 90px;
    overflow: hidden;
}
#toppage .access .box .map { padding: 60px;}
#toppage .access .box .map iframe { width: 100%; height: auto; aspect-ratio: 1 / 1; border-radius: 47px;}
#toppage .access .box .come { padding: 60px 10px; color: #fff;}
#toppage .access .box .come b { position: relative; }
#toppage .access .box .come b::before {
	display: block; clear: both; content:"";
	position: absolute; left: 0; bottom:-15px;
	width: 100%; height: 4px;
	background: #fff;
}
#toppage .access .box .come p:nth-child(1) { padding-bottom: 50px;}
#toppage .access .box .come p:nth-child(2) { font-size: 125%; font-weight: bold; line-height: 180%;}
#toppage .access .box .come p:nth-child(2) span { font-size:175%;}
#toppage .access .box:nth-child(1) .come { background: #01CAFC;}
#toppage .access .box:nth-child(2) .come { background: #009FA8;}
@media only screen and (max-width:768px){
    #toppage .access .inner { gap:40px; }
    #toppage .access .box { width:calc(50% - 20px); border-radius:50px;}
    #toppage .access .box .map { padding: 20px;}
    #toppage .access .box .come { padding: 40px 10px;}
	#toppage .access .box .come p:nth-child(2) {font-size: 100%;}
}
@media only screen and (max-width:468px){
    #toppage .access .inner { flex-direction: column; gap:20px;}
    #toppage .access .box { margin:auto; width: 100%;}
}



/*-----------------------------------------------------------------------------------
  BANNER
-----------------------------------------------------------------------------------*/
#toppage .bana .inner { display: flex; flex-wrap: wrap; gap:8.3%; text-align: center; }
#toppage .bana p { margin:auto; width:calc(50% - 4.15%);}
@media only screen and (max-width:768px){
    #toppage .bana .inner { gap:40px;}
    #toppage .bana p { width:calc(50% - 20px);}
}
@media only screen and (max-width:468px){
    #toppage .bana .inner { flex-direction: column; gap:20px;}
    #toppage .bana p { width:100%;}
}