.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
=============================================*/
.bg_gray { background:#F5F5F5;}
.bg_lightblue { background:#E5EFEF;}
.bg_darkblue { background:#005288;}
#toppage .inner { margin: auto; padding:160px 0; width: 90%; max-width:1120px;}
#toppage img { width: 100%; height: auto;}
#toppage .musimegane { margin-bottom: 120px;}
#toppage .musimegane span {position: relative;}
#toppage .musimegane span::before {
    display: block; clear: both; content:"";
    position: absolute; right:-140px; bottom: -60px;
    width: 100%; height:auto; max-width: 250px; aspect-ratio: 534 / 338;
    background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2026/05/mushimegane_half.webp") no-repeat right bottom;
    background-size: 100% auto;
}

#toppage .fs114 {
    font-family: "Noto Sans JP", sans-serif;
    font-size: 114px;
    font-weight: 700;
    color: #005288;
}
#toppage .fs60 {
    margin-bottom: 60px;
    font-family: "Zen Kaku Gothic New", sans-serif;
    font-size: 375%;
    font-weight: 700;
    color: #005288;
    text-align: center;
}
#toppage .fs40 {
    margin-bottom: 60px;
    font-family: "Zen Kaku Gothic New", sans-serif;
    font-size: 250%;
    font-weight: 700;
    color: #005288;
    text-align: center;
}
@media only screen and (max-width:768px){ 
    #toppage .inner { padding:100px 0;}
    #toppage .musimegane { margin-bottom: 80px;}
    #toppage .musimegane span::before { right:-80px; bottom: -40px; max-width: 150px;}
    #toppage .fs114 { font-size:70px;}
    #toppage .fs60 { font-size: 312.5%;}
    #toppage .fs40 { font-size: 200%;}
}
@media only screen and (max-width:468px){
    #toppage .inner { padding:60px 0; width: 80%;}
    #toppage .musimegane { margin-bottom: 60px;}
    #toppage .musimegane span::before { right:-40px; bottom: -30px;  max-width: 100px;}
    #toppage .fs114 { font-size:40px;}
    #toppage .fs60 { margin-bottom: 20px; font-size: 137.5%;}
    #toppage .fs40 { margin-bottom: 20px; font-size: 125%;}
}



#toppage .btn { margin: auto;}
#toppage .btn a {
    position: relative;
    display: block;
    padding: 0 50px;
    width: 100%;
    color: #fff;
    font-size: clamp(87.5%, 2.7vw, 175%);
    font-weight: 700;
    line-height: 70px;
    text-align: center;
    text-decoration: none;
    border: 2px solid #fff;
    border-radius: 100px;
    background: #005288;
}
#toppage .btn a::before {
    display: block; clear: both; content:"";
    position: absolute; top: 0; bottom: 0; right: 50px;
    margin: auto;
    width: 56px; height:56px; aspect-ratio: 1 / 1;
    background:#fff url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2026/05/arrow_g.webp") no-repeat;
    background-size: 100% auto;
    border-radius: 56px;
}
#toppage .btn.b_yoyaku { margin:0 auto; max-width: 700px;}
#toppage .btn.b_yoyaku a {
    line-height: 100px;
    background: radial-gradient(#FFB610 0, #ED5C00 100%);
    border: none;
}
#toppage .btn.b_search { margin:0 auto; max-width: 700px;}
#toppage .btn.b_search a {
    line-height: 100px;
    background: radial-gradient(#76DAFF 0, #3829B1 100%);
    border: none;
}
#toppage .btn.b_other { margin:0 auto; max-width: 700px;}
#toppage .btn.b_other a {
    font-size: clamp(87.5%, 2vw, 137.5%);
    line-height: 70px;
    background:#6FD0E0;
}
#toppage .btn.b_other a::before {
    display: block; clear: both; content:"";
    position: absolute; top: 0; bottom: 0; right: 40px;
    margin: auto;
    width: 40px; height: 40px; aspect-ratio: 1 / 1;
    background:url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2026/05/arrow_w.webp") no-repeat;
    background-size: 100% auto;
    border-radius: 40px;
}
#toppage .btn.b_link a {
    font-size: clamp(87.5%, 2vw, 137.5%);
    line-height: 70px;
    background:none;
}
#toppage .btn.b_link a::before {
    display: block; clear: both; content:"";
    position: absolute; top: 0; bottom: 0; right: 20px;
    margin: auto;
    width: 40px; height: 40px;
    background:url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2026/05/arrow_w.webp") no-repeat;
    background-size: 100% auto;
    border-radius: 40px;
    transform: rotate(90deg);
}
@media only screen and (min-width:769px){
    #toppage .btn a:hover { opacity: 0.7;}
}
@media only screen and (max-width:768px){
    #toppage .btn a { padding:0 25px;}
    #toppage .btn a::before { width: 40px; height: 40px; right: 30px;}
    #toppage .btn.b_yoyaku a { line-height: 80px;}
    #toppage .btn.b_search a { line-height: 80px;}
    #toppage .btn.b_other a { line-height: 70px;}
    #toppage .btn.b_linkr a { line-height:70px; text-align:left;}
}
@media only screen and (max-width:468px){
    #toppage .btn a { padding:0;}
    #toppage .btn a::before { width: 24px !important; height: 24px !important; right: 10px !important;}
    #toppage .btn.b_yoyaku a { line-height: 40px;}
    #toppage .btn.b_search a { line-height: 40px;}
    #toppage .btn.b_other a { line-height: 40px; font-size: 11px;}
    #toppage .btn.b_link a { line-height: 40px; font-size: 11px;}
}


#sp_fix { display: none;}
@media only screen and (max-width:468px){
    #sp_fix {
        display: block;
        position: fixed; bottom: 10px; left: 0; right: 0;
        margin: auto;
        width: 90%;
    }
    #sp_fix .btn.b_yoyaku a { line-height: 60px;}
    #sp_fix .btn.b_yoyaku a::before { display: none;}
}


#content { padding: 0;}


/*-----------------------------------------------------------------------------------
  ABOUT
-----------------------------------------------------------------------------------*/
#toppage .about_top { position: relative; z-index: 9;}
#toppage .about_top .inner { padding:50px 0;}
#toppage .about_top::before,
#toppage .about_top::after {
    display: block; clear: both; content:"";
    position: absolute; right:0;
    width:100%; 
    height: 120px;
    background:#005288;
}
#toppage .about_top::before {
    top:-118px;
    clip-path: polygon(100% 0, 100% 100%, 0 100%);
}
#toppage .about_top::after {
    bottom: -118px;
    clip-path: polygon(100% 0, 0 0, 0 100%);
}
#toppage .about_top .data { margin: 50px auto; width: 100%; max-width:980px;}
#toppage .about_top ul { display: flex; gap:20px;}
#toppage .about_top ul li {
    width: 33.3%;
    font-size:181.2%;
    text-align: center;
    line-height: 67px;
    color: #fff;
    border: 4px solid #fff;
    border-radius: 20px;
}
@media only screen and (max-width:768px){
    #toppage .about_top::before,
    #toppage .about_top::after { height: 80px;}
    #toppage .about_top::before { top:-80px;}
    #toppage .about_top::after { bottom: -80px;}
}
@media only screen and (max-width:468px){
    #toppage .about_top .inner { padding:20px 0;}
    #toppage .about_top::before,
    #toppage .about_top::after { height: 30px;}
    #toppage .about_top::before { top:-30px;}
    #toppage .about_top::after { bottom: -30px;}
    #toppage .about_top .data { margin: 20px auto;}
    #toppage .about_top ul { gap:10px;}
    #toppage .about_top ul li {
        font-size: 75%;
        line-height: 30px;
        border: 2px solid #fff;
        border-radius: 10px;
    }
}


/*-----------------------------------------------------------------------------------
  SEMINAR
-----------------------------------------------------------------------------------*/
#toppage .seminar {
    position: relative;
    background:url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2026/05/bg2.webp") no-repeat bottom center;
    background-size: cover;
}
#toppage .seminar p + p { margin-top: 20px;}
@media only screen and (max-width:468px){
    #toppage .seminar {
        background:url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2026/05/bg2_sp.png") no-repeat bottom center;
        background-size:100% auto;
    }
}

/*-----------------------------------------------------------------------------------
  GALLERY
-----------------------------------------------------------------------------------*/
#toppage .gallery {
    position:relative;
    aspect-ratio: 1920 / 280;
}
#toppage .gallery .gallery_slider {
    position: absolute; z-index: -7; top:-50%; bottom: -50%; 
    display: flex;
    margin: auto;
}
#toppage .gallery .gallery_slider img { width: 100%; height:100%; object-fit: cover;}



/*-----------------------------------------------------------------------------------
  WHAT
-----------------------------------------------------------------------------------*/
#toppage .what {
    position: relative;
    background:url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2026/05/bg3.webp") no-repeat top center;
    background-size: cover;
}
#toppage .what .inner { padding: 200px 0 400px;}
#toppage .what .box {
    position: relative;
    display: flex; flex-wrap: wrap;  align-items: flex-start;
    color:  #fff;
}
#toppage .what .box .pic { position: relative; width: 35%;}
#toppage .what .box .pic img { aspect-ratio: 1 / 1; object-fit: cover; border-radius: 30px;}
#toppage .what .box .txt {
    display: flex; flex-direction: column; gap:40px;
    width: calc(100% - 35%);
    font-family: "M PLUS 1p", sans-serif;
}
#toppage .what .box .mid { font-size:225%; line-height: 150%;}
#toppage .what .box .come { font-size:125%; line-height: 200%;}
#toppage .what .box .b_search { margin-left: 0; width: 100%; max-width: 500px;}
#toppage .what .box .b_search a { font-size: 181.5%; line-height: 60px;}
#toppage .what .box .b_search a::before { width: 35px; height: 35px;}
@media only screen and (max-width:768px){
    #toppage .what .inner { padding-bottom: 250px;}
    #toppage .what .box .pic { position:absolute; top: 0; right: 0;}
}
@media only screen and (max-width:468px){
    #toppage .what {
        background:url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2026/05/bg3_sp.png") no-repeat top center;
        background-size:100% auto;
    }
    #toppage .what .inner { padding:80px 0 150px;}
    #toppage .what .box { display: block;}
    #toppage .what .box .pic { width: 100px; top:-20px; right: -6%;}
    #toppage .what .box .txt { width: 100%;}
    #toppage .what .box .mid { font-size:125%;}
    #toppage .what .box .come { font-size:87.5%;}
    #toppage .what .box .b_search a { font-size: 100%; line-height:40px;}
    #toppage .what .box .b_search a::before { width: 25px; height: 25px;}
}



/*-----------------------------------------------------------------------------------
  CONTENTS
-----------------------------------------------------------------------------------*/
#toppage .guide { position: relative;}
#toppage .guide .inner { padding-top: 0;}
#toppage .guide::before {
    display: block; clear: both; content:"";
    position: absolute; top: -200px; left: 0;
    width: 100%; height:  240px;
    background:url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2026/05/bg4.webp") no-repeat top center;
}
@media only screen and (max-width:768px){
    #toppage .guide::before {
        top: -150px; height: 150px;
        background-size: 1000px auto;
    }
}
@media only screen and (max-width:468px){
    #toppage .guide::before {
        top: -80px; height: 80px;
        background-size: 468px auto;
    }
}

#toppage .guide h2 { text-align: center;}
#toppage .guide h2 b { display: block;}
#toppage .guide_list { display: flex; gap:100px;}
#toppage .guide .box {
    position: relative;
    width: 33.3%;
    color:#126293;
}
#toppage .guide .box .txt {
    margin-top: 20px;
    font-family: "M PLUS 1p", sans-serif;
    font-size: 125%;
    text-align: center;
}
@media only screen and (max-width:768px){
    #toppage .guide_list { gap:10px;}
    #toppage .guide .box { padding:15px;}
    #toppage .guide .box .txt { font-size: 100%;}
}
@media only screen and (max-width:468px){
    #toppage .guide h2 b { margin-bottom: 10px;}
    #toppage .guide_list { flex-direction: column; gap:10px;}
    #toppage .guide .box { 
        display: flex; gap:30px;
        padding: 15px;
        width: 100%;
    }
    #toppage .guide .box .pic { width: 80px;}
    #toppage .guide .box .txt {
        margin: 0;
        padding: 10px 0 0;
        width: calc(100% - 80px - 30px);
        font-size: 75%;
        line-height: 150%;
        text-align: left;
    }
}


#toppage .guide .youtube {
    margin: 40px auto 0;
    width: 100%; height: auto; max-width: 900px;
}
#toppage .guide .youtube iframe {
    margin: auto;
    width: 100%; height: auto; max-width: 900px;
    aspect-ratio: 560 / 315;
}


/*-----------------------------------------------------------------------------------
  TOKUCYO
-----------------------------------------------------------------------------------*/
#toppage .tokucyo h2 { text-align: center;}
#toppage .tokucyo h2 span:nth-child(1)::before { display: none;}
#toppage .tokucyo .come {
    margin-bottom: 40px;
    font-family: "M PLUS 1p", sans-serif;
    font-size:125%;
    color: #126293;
    text-align: center;
}
#toppage .tokucyo .zu {
    margin: auto;
    max-width: 875px;
}
@media only screen and (max-width:768px){
    #toppage .tokucyo .come { font-size: 112.5%;}
}
@media only screen and (max-width:468px){
    #toppage .tokucyo .come { font-size: 100%;}
}



/*-----------------------------------------------------------------------------------
  TOKUTEN
-----------------------------------------------------------------------------------*/
#toppage .tokuten h2 { text-align: center; color: #fff;}
#toppage .tokuten ul { display: flex; flex-wrap: wrap; gap:40px; margin: 0 auto 140px;}
#toppage .tokuten ul li { width: calc(50% - 20px);}
#toppage .tokuten ul li:nth-child(3) { width: 100%;}
#toppage .tokuten .b_yoyaku { position: relative;}
#toppage .tokuten .b_yoyaku::before,
#toppage .tokuten .b_yoyaku::after {
    display: block; clear: both; content:"";
    position: absolute;
    background-size: 100% auto !important;
}
#toppage .tokuten .b_yoyaku::before {
    left: -7%; top:-100%;
    width: 30%; aspect-ratio: 391 / 197;
    background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2026/05/tokuten_fukidashi.webp") no-repeat;
}
#toppage .tokuten .b_yoyaku::after {
    left:-18%; bottom: -10%;
    width:17%; aspect-ratio: 220 / 177;
    background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2026/05/katsuo.webp") no-repeat;
    transform: scaleX(-1);
}
@media only screen and (max-width:768px){
    #toppage .tokuten ul { gap:20px; margin: 0 auto 100px;}
    #toppage .tokuten .b_yoyaku { max-width: 400px;}
    #toppage .tokuten .b_yoyaku::before { top: -80%;}
}
@media only screen and (max-width:468px){
    #toppage .tokuten .innner { width: 90%;}
    #toppage .tokuten h2 { font-size: 240%;}
    #toppage .tokuten ul { flex-direction: column; margin: 0 auto 80px;}
    #toppage .tokuten ul li { width: 100%;}
    #toppage .tokuten .b_yoyaku::before { left: 0;  top: -120%;}
    #toppage .tokuten .b_yoyaku::after { left:-5%; bottom: 30%;}
}



/*-----------------------------------------------------------------------------------
  POINT
-----------------------------------------------------------------------------------*/
#toppage .point {
    background:#F5F5F5 url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2026/05/bg5.webp") no-repeat right bottom;
    background-size: 100% auto;
}
#toppage .point h2 { text-align: center;}
#toppage .point .point_list {
    position: relative;
    display: flex; flex-wrap: wrap; gap:30px;
    margin: auto; max-width: 900px;
}
#toppage .point .point_list .box {
    padding: 40px 30px;
    width: calc(50% - 15px);
    color: #fff;
    border-radius: 50px;
}
#toppage .point .point_list .box:nth-child(1) { background:#005288;}
#toppage .point .point_list .box:nth-child(2) { background:#3995BE;}
#toppage .point .point_list .box:nth-child(3) { background:#37A59F;}
#toppage .point .point_list .box:nth-child(4) { background:#005288;}
#toppage .point .point_list .box:nth-child(5) { background:#48BCD0;}
#toppage .point .point_list .box:nth-child(1){
    display: flex; gap:20px;
    padding: 80px 70px 40px;
    width: 100%;
}
#toppage .point .point_list .box:nth-child(1) .mid { width: 370px;}
#toppage .point .point_list .box:nth-child(1) .come {
    padding-bottom: 100px;
    width: calc(100% - 370px - 20px);
    background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2026/05/katsuo.webp") no-repeat right bottom;
    background-size: 100px auto;
}
#toppage .point .point_list .box .mid {
    padding: 50px 20px 0;
    font-family: "M PLUS 1p", sans-serif;
    font-size: 26px;
    font-weight: 700;
    line-height: 150%;
    min-height: 200px;
    background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2026/05/mushimegane_all.webp") no-repeat;
    background-size:  auto 200px;
}
#toppage .point .point_list .box .mid span { font-size: 36px; color: #FECC52;}
#toppage .point .point_list .box .come { min-height: 100px; margin-bottom: 20px; padding: 0 20px;}
@media only screen and (max-width:768px){
    #toppage .point .point_list .box {
        display: block !important;
        padding: 40px !important;
        width: 100% !important;
        border-radius: 40px;
    }
    #toppage .point .point_list .box:nth-child(1) .mid { width:  100%;}
    #toppage .point .point_list .box:nth-child(1) .come { width: 100%;}
    #toppage .point .point_list .box .mid {
        margin-bottom: 20px;
        padding: 30px 30px 0;
        font-size: 20px;
        min-height:120px;
        background-size: auto 120px;
    }
    #toppage .point .point_list .box .mid span { font-size: 26px; }
    #toppage .point .point_list .box .come { min-height:inherit;}
}
@media only screen and (max-width:468px){
    #toppage .point .inner { padding-bottom: 120px;}
    #toppage .point .point_list .box { padding: 20px !important; border-radius: 30px;}
    #toppage .point .point_list .box .mid { padding: 30px 0 0; background-position: right center;}
    #toppage .point .point_list .box .come { padding: 0;}
}



/*-----------------------------------------------------------------------------------
  CASE
-----------------------------------------------------------------------------------*/
#toppage .case .inner { position: relative;}
#toppage .case .inner::before,
#toppage .case .inner::after {
    display: block; clear: both; content:"";
    position: absolute;
    background-size: 100% auto !important;
}
#toppage .case .inner::before {
    top:7%; right: 2%; z-index: 9;
    width: 27%; height: auto; aspect-ratio: 1052 / 600;
    background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2026/05/katuyou1.webp") no-repeat;
}
#toppage .case .inner::after {
    top: -5%; right: -15%; z-index: 8;
    width: 37%; height: auto; aspect-ratio: 1350 / 900;
    background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2026/05/katuyou2.webp") no-repeat;
}
#toppage .case h2 { text-align:left;}
#toppage .case h2 b { display: block; text-align:left;}
#toppage .case .case_slider {
    background:#F5F5F5;
    border-radius: 50px;
}
#toppage .case .case_slider .box {
    position: relative;
    display: flex; flex-wrap: wrap;  align-items: flex-start; gap: 50px;
    padding: 90px;
    color:  #126293;
}
#toppage .case .case_slider .box .mid {
    position: absolute; top: 70px; left: 50px;
    font-size: 110px;
    font-weight: 500;
    color: #fff;
}
#toppage .case .case_slider .box .pic { position: relative; width: 45%; padding-top: 40px;}
#toppage .case .case_slider .box .pic img { aspect-ratio: 1 / 1; object-fit: cover; border-radius: 30px;}
#toppage .case .case_slider .box .txt { width: calc(100% - 45% - 50px);}
#toppage .case .case_slider .box .flow {
    display: flex; flex-direction: column; gap:30px;
}
#toppage .case .case_slider .box .flow li {
    position: relative;
    padding: 10px 20px;
    text-align: center;
    background: #fff;
    border: 1px solid #126293;
}
#toppage .case .case_slider .box .flow li + li::before {
    display: block; clear: both; content:"";
    position: absolute; top: -32px; left: 0; right: 0;
    margin: auto;
    width: 0; height: 0;
    border-style: solid;
    border-right: 15px solid transparent;
    border-left: 15px solid transparent;
    border-top: 15px solid #126293;
    border-bottom: 0;
}
#toppage .case .btn { margin-top: 20px;}
@media only screen and (max-width:768px){
    #toppage .case .inner::before { top:3%; right: 5%; width: 20%;}
    #toppage .case .inner::after { top: -3%; right: -10%; width: 30%;}
    #toppage .case h2 b { margin-bottom: 30px;}
    #toppage .case .case_slider .box { padding: 40px;}
    #toppage .case .case_slider .box .mid { top: 50px; left: 50px; font-size: 70px; }
    #toppage .case .case_slider .box .pic { width: 40%; padding-top: 60px;}
    #toppage .case .case_slider .box .txt { width: calc(100% - 40% - 50px);}
    #toppage .case .case_slider .box .flow li { padding: 10px; font-size: 87.5%; line-height: 150%;}
}
@media only screen and (max-width:468px){
    #toppage .case .inner { padding-top: 130px;}
    #toppage .case .inner::before {
        top:3%; right:inherit; left:-5%;
        width: 40%; height: auto; aspect-ratio: 1052 / 600;
        border-top-left-radius: 20px;
        border-bottom-left-radius: 20px;
    }
    #toppage .case .inner::after {
        top: -5%; right:-10%;
        width:100%; height: auto; aspect-ratio: 1350 / 600;
        border-radius: 20px;
    }
    #toppage .case h2 b { display: block!important; margin-bottom:0px!important;}
    #toppage .case .case_slider { width: 100%; border-radius: 30px;}
    #toppage .case .case_slider .box { flex-direction: column; gap:20px; padding: 20px 20px 40px;}
    #toppage .case .case_slider .box .mid { top: 30px; left:30px; font-size: 50px; }
    #toppage .case .case_slider .box .pic  { width: 100%; padding-top: 20px;}
    #toppage .case .case_slider .box .pic span { font-size: 75%;}
    #toppage .case .case_slider .box .txt { width: 100%;}
    #toppage .case .btn.b_more a {padding: 10px 0; line-height: 150%;}
}



/*-----------------------------------------------------------------------------------
  CONTENTS
-----------------------------------------------------------------------------------*/
#toppage .kigyo {
    background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2026/05/bg1.webp") repeat-y;
    background-size: 100% auto;
}
#toppage .kigyo .inner { padding-bottom: 300px;}
#toppage .kigyo h2 { text-align: center;}
#toppage .kigyo .kigyo_list { 
    display: flex; flex-direction: column; gap:60px;
    margin: 0 auto 100px; padding: 50px 90px; max-width:1200px;
    background: rgba(255,255,255,0.60);
}
#toppage .kigyo dl { display: flex; flex-direction: column; gap:40px;}
#toppage .kigyo dt {
    margin: auto;
    width:100%; max-width:250px;
    font-size: 112.5%;
    font-weight: bold;
    color:  #126293;
    line-height: 50px;
    text-align: center;
    border: 1px solid #126293;
}
#toppage .kigyo dd {
    display: flex; flex-wrap: wrap; justify-content: center; gap:10px 20px;
    text-align: center;
    font-weight: bold;
}
#toppage .kigyo dd a { color:  #126293;}
#toppage .kigyo .b_search { width:80%; max-width:700px; margin-bottom: 40px;}
#toppage .kigyo .b_other { width: 70%; max-width:600px;}
@media only screen and (max-width:768px){
    #toppage .kigyo .inner { padding-bottom: 250px;}
    #toppage .kigyo .kigyo_list { padding: 50px;}
}
@media only screen and (max-width:468px){
    #toppage .kigyo .inner { padding-bottom: 150px;}
    #toppage .kigyo .kigyo_list { gap:40px; margin-bottom: 40px; padding:30px;}
    #toppage .kigyo dl { gap:20px;}
    #toppage .kigyo dt { font-size: 100%; line-height: 30px;}
    #toppage .kigyo dd { flex-direction: column;}
    #toppage .kigyo .b_search { width:100%; margin-bottom: 20px;}
    #toppage .kigyo .b_other { width:100%;}
}



/*-----------------------------------------------------------------------------------
  CONTENTS
-----------------------------------------------------------------------------------*/
#toppage .contents { position: relative;}
#toppage .contents .inner { padding-top: 0;}
#toppage .contents::before {
    display: block; clear: both; content:"";
    position: absolute; top: -200px; left: 0;
    width: 100%; height: 240px;
    background:url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2026/05/bg4.webp") no-repeat top center;
}
@media only screen and (max-width:768px){
    #toppage .contents::before {
        top: -150px; height: 150px;
        background-size: 1000px auto;
    }
}
@media only screen and (max-width:468px){
    #toppage .contents::before {
        top: -80px; height: 80px;
        background-size: 468px auto;
    }
}


/* Contents */
#toppage .contents .contentss ul#tab { display: flex; gap:30px;}
#toppage .contents .contentss ul#tab li {
    position: relative;
	cursor: pointer;
	padding: 10px 50px;
    font-family: "M PLUS 1p", sans-serif;
    color: #fff;
    font-size: 168.5%;
}
#toppage .contents .contentss ul#tab li:before {
    display: block; clear: both; content:"";
    position: absolute; top:0;  right:-30px;
    width: 30px;
    height: 100%;
    clip-path: polygon(0 0, 100% 100%, 0 100%);
}
#toppage .contents .contentss ul#tab li,
#toppage .contents .contentss ul#tab li::before { background: #D6D6D6;}
#toppage .contents .contentss ul#tab li:nth-child(1).select,
#toppage .contents .contentss ul#tab li:nth-child(1).select::before { background: #126293;}
#toppage .contents .contentss ul#tab li:nth-child(2).select,
#toppage .contents .contentss ul#tab li:nth-child(2).select::before { background: #37A59F;}
#toppage .contents .contentss ul#tab li:nth-child(3).select,
#toppage .contents .contentss ul#tab li:nth-child(3).select::before { background: #6FD0E0;}
#toppage .contents .contentss .disnon { display: none;}
#toppage .contents .contentss .content_wrap {
    padding: 100px;
    font-family: "M PLUS 1p", sans-serif;
    background: #fff;
}
#toppage .contents .contentss .box { display: flex; flex-wrap: wrap;  align-items: flex-start; gap: 50px;}
#toppage .contents .contentss .box .pic { position: relative; width: 40%;}
#toppage .contents .contentss .box .pic img { aspect-ratio: 1 / 1; object-fit: cover; border-radius: 30px;}
#toppage .contents .contentss .box .txt {
    position: relative;
    display: flex; flex-direction: column; gap:40px;
    padding: 40px 0;
    font-weight: bold;
    width: calc(100% - 40% - 50px);
}
#toppage .contents .contentss .box .mid { font-size:150%; letter-spacing: 2px;}
#toppage .contents .contentss .box .come1 { font-size:100%;}
#toppage .contents .contentss .box .come2 {
    padding: 5px;
    font-size:125%;
    text-align: center;
    border: 1px solid #ddd;
}
#toppage .contents .contentss .box .come2 small { display: block; line-height: 120%;}
#toppage .contents .contentss .careermatching .pic::before,
#toppage .contents .contentss .careermatching .pic::after,
#toppage .contents .contentss .careermatching .txt::before {
    display: block; clear: both; content:"";
    position: absolute;
    background-size: 100% auto !important;
}
#toppage .contents .contentss .careermatching .pic::before {
    left:-5%; bottom: 5%;
    width: 40%; height: auto; aspect-ratio: 424 / 536;
    background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2026/05/contents2_1.webp") no-repeat;
}
#toppage .contents .contentss .careermatching .pic::after {
    right: -5%; top: -5%;
    width: 40%; height: auto; aspect-ratio: 433 / 320;
    background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2026/05/contents2_2.webp") no-repeat;
}
#toppage .contents .contentss .careermatching .txt::before {
    right:-70px; top:-70px;
    width: 100px; height: auto; aspect-ratio: 1 / 1;
    background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2026/05/yoyaku_fukidashi2.webp") no-repeat;
}
@media only screen and (max-width:768px){
    #toppage .contents .contentss ul#tab { display: flex; gap:30px;}
    #toppage .contents .contentss ul#tab li { padding: 10px 20px; font-size: 125%;}
    #toppage .contents .contentss .content_wrap { padding:40px;}
    #toppage .contents .contentss .box { gap: 40px;}
    #toppage .contents .contentss .box .txt { padding:20px 0; gap:20px;}
    #toppage .contents .contentss .box .mid { font-size:125%;}
    #toppage .contents .contentss .box .come1 { font-size:87.5%;}
    #toppage .contents .contentss .box .come2 { font-size:100%;}
}
@media only screen and (max-width:468px){
    #toppage .contents .contentss ul#tab { display: flex; gap:10px;}
    #toppage .contents .contentss ul#tab li { padding:0 0 0 5px; font-size: 10px;}
    #toppage .contents .contentss ul#tab li:before { right:-10px; width: 10px;}
    #toppage .contents .contentss .content_wrap { padding:20px;}
    #toppage .contents .contentss .box { flex-direction: column; gap:20px;}
    #toppage .contents .contentss .box .pic,
    #toppage .contents .contentss .box .txt { width: 100%;}
    #toppage .contents .contentss .box .txt { padding:0; gap:20px;}
    #toppage .contents .contentss .box .come1 { font-size:75%;}
    #toppage .contents .contentss .box .come2 { font-size:75%;}
    #toppage .contents .contentss .careermatching .txt::before { right:-10px; top:-70px; width: 70px;}
}

/* Soudan */
#toppage .contents .soudan { padding: 100px 0;}
#toppage .contents .soudan h3 {
    font-family: "M PLUS 1p", sans-serif;
    font-weight: 700;
}
#toppage .contents .soudan_list { display: flex; gap:35px;}
#toppage .contents .soudan .box {
    width: 33.3%;
    padding: 25px;
    color:#126293;
    background: #fff;
    border-radius: 20px;
}
#toppage .contents .soudan .box .txt {
    margin: auto;
    width:86%;
    font-family: "M PLUS 1p", sans-serif;
    text-align: center;
}
#toppage .contents .soudan .box .mid {
    margin-bottom: 10px;
    padding: 20px 0;
    font-size: 150%;
    border-bottom: 1px solid #126293;
}
#toppage .contents .soudan .box .come { font-size: 112.5%;}
@media only screen and (max-width:768px){
    #toppage .contents .soudan { padding: 80px 0;}
    #toppage .contents .soudan_list { gap:10px;}
    #toppage .contents .soudan .box { padding:15px;}
    #toppage .contents .soudan .box .mid { padding: 15px 0; font-size: 125%;}
    #toppage .contents .soudan .box .come { font-size: 100%;}
}
@media only screen and (max-width:468px){
    #toppage .contents .soudan { padding: 60px 0;}
    #toppage .contents .soudan_list { flex-direction: column; gap:10px;}
    #toppage .contents .soudan .box { width: 100%; padding: 15px;}
    #toppage .contents .soudan .box .mid { padding: 10px 0; font-size: 125%;}
    #toppage .contents .soudan .box .come { font-size: 100%;}
}

/* Banner */
#toppage .contents .banner {
    padding: 60px 0;
    background: #fff;
    border: 8px solid #126293;
    border-radius: 30px;
}
#toppage .contents .banner ul {
    position: relative;
    display: flex; flex-wrap: wrap; gap:30px;
    margin: auto;
    width: 90%; max-width: 900px;
}
#toppage .contents .banner ul::before {
    display: block; clear: both; content:"";
    position: absolute; top:-13%; left: -18%; z-index: 9;
    width: 25%; height: auto; aspect-ratio: 1 / 1;
    background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2026/05/yoyaku_fukidashi.webp") no-repeat;
    background-size: 100% auto !important;
}
#toppage .contents .banner ul li:nth-child(1),
#toppage .contents .banner ul li:nth-child(4) { width: 100%;}
#toppage .contents .banner ul li:nth-child(2),
#toppage .contents .banner ul li:nth-child(3) { width: calc(50% - 15px);}
#toppage .contents .banner .b_yoyaku { margin-top: 60px; width: 90%; max-width: 700px;}
#toppage .contents .banner ul li a { position: relative; display: block;}
#toppage .contents .banner ul li:nth-child(1) a::after,
#toppage .contents .banner ul li:nth-child(3) a::after,
#toppage .contents .banner ul li:nth-child(4) a::after {
    display: block; clear: both; content:"";
    position: absolute;
    width: 100%; height: auto; 
    background-size: 100% auto !important;
}
#toppage .contents .banner ul li:nth-child(1) a::after {
    right: -2%; bottom: 0;
    width:30%; aspect-ratio: 551 / 530;
    background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2026/05/yoyaku_illust1.webp") no-repeat;
}
#toppage .contents .banner ul li:nth-child(3) a::after {
    right: -5%; bottom: -5%;
    width:23%; aspect-ratio: 211 / 227;
    background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2026/05/yoyaku_illust2.webp") no-repeat;
}
#toppage .contents .banner ul li:nth-child(4) a::after {
    right: -1%; bottom: 0;
    width:33%; aspect-ratio: 613 / 403;
    background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2026/05/yoyaku_illust3.webp") no-repeat;
}
@media only screen and (max-width:468px){
    
    #toppage .contents .banner { padding: 7% 5%;}
    #toppage .contents .banner ul { width: 100%; gap:10px;}
    #toppage .contents .banner ul::before {
        top:-7%; left: -15%;
        width: 35%; height: auto;
    }
    #toppage .contents .banner ul li { width: 100% !important;}
    #toppage .contents .banner ul li:nth-child(1) a::after {
        right: -3%; bottom:inherit; top:2%;
        width:35%; aspect-ratio: 391 / 564;
    }
    #toppage .contents .banner ul li:nth-child(3) a::after {
        right: -3%; bottom:inherit; top:-2%;
        width:23%;
    }
    #toppage .contents .banner ul li:nth-child(4) a::after {
        right: -3%; bottom:inherit; top:35%;
        width:45%;
    }
    #toppage .contents .banner + .btn { margin-top: 20px !important;}
    #toppage .contents .banner .b_yoyaku { margin-top: 20px; width: 100%;}
    #toppage .contents .banner .b_yoyaku a { font-size: 75%;}
}



/*-----------------------------------------------------------------------------------
  FAQ
-----------------------------------------------------------------------------------*/
#toppage .faq {
    background: url("http://kochi-iju.jp/lp/kochi-job/realfair/wp-content/uploads/2026/05/bg1.webp") repeat-y;
    background-size: 100% auto;
}
#toppage .faq .faq_list {
    display: flex; flex-wrap: wrap; flex-direction: column; gap:30px;
    color: #005288;
}
#toppage .faq dl { padding:20px 60px;}
#toppage .faq dt { padding-right: 50px;}
#toppage .faq dt {
    position: relative;
    cursor: pointer;
    font-size:125%;
    font-weight:700;
    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:0;}
    #toppage .faq dt { font-size: 137%;}
    #toppage .faq dd { font-size:100%;}
}
@media only screen and (max-width:468px){
    #toppage .faq h3 { margin-bottom: 40px;}
    #toppage .faq .faq_list { gap:20px; }
    #toppage .faq dt { font-size: 112.5%; padding: 5px 60px 5px 0;}
    #toppage .faq dd { font-size:87.5%;}
}



/*-----------------------------------------------------------------------------------
    INFORMATION
-----------------------------------------------------------------------------------*/
#toppage .info .inner { 
    display: flex; flex-direction: column; gap:120px;
    max-width: 1320px;
}
@media only screen and (max-width:768px){
    #toppage .info .inner { gap:100px;}
}
@media only screen and (max-width:468px){
    #toppage .info .inner { gap:40px;}
}


/* About */
#toppage .about dl {
    display: flex; flex-wrap: wrap; align-items: center;
    color: #005288;
    border-bottom: 1px solid #005288;
}
#toppage .about dl:nth-child(1) { border-top: 1px solid #005288;}
#toppage .about dt,
#toppage .about dd { padding: 20px 0; font-size: 125%;}
#toppage .about dt { width:30%; text-align: center;}
#toppage .about dd { width:70%;}
@media only screen and (max-width:768px){
    #toppage .about dt,
    #toppage .about dd { font-size: 100%;}
    #toppage .about dt { width:20%;}
    #toppage .about dd { width:80%;}
}
@media only screen and (max-width:468px){
    #toppage .about dt,
    #toppage .about dd { width:100%;}
    #toppage .about dl { flex-direction: column; text-align: center;}
    #toppage .about dt { padding-bottom:0; font-weight:700;}
    #toppage .about dd { padding-top:10px;}
}


/* Access */
#toppage .access .box {
    display: flex; flex-wrap: wrap; justify-content: space-between; gap:40px;
    margin: auto; width: 100%; max-width: 1120px;
}
#toppage .access .box + .box {margin-top: 60px;}
#toppage .access .box .map {  width:40%;}
#toppage .access .box .map iframe { width: 100%; height: auto; aspect-ratio: 1 / 1;}
#toppage .access .box .txt { width: calc(60% - 40px);}
#toppage .access .box .txt h4 {
    width: 100%; max-width: 300px;
    font-size: 250%;
    line-height: 100px;
    color: #fff;
    text-align: center;
    background: #005288;
}
#toppage .access .box .come {
    padding: 30px 0 0 70px;
    font-weight: 700;
    color: #005288;
}
#toppage .access .box .come p:nth-child(1) { font-size: 250%; line-height: 140%;}
#toppage .access .box .come p:nth-child(1) span { font-size:150%;}
#toppage .access .box .come p:nth-child(2) { margin-top: 20px; font-size: 125%;}
@media only screen and (max-width:768px){
    #toppage .access .box { gap:30px;}
    #toppage .access .box .txt h4 { max-width: 200px; font-size: 187.5%; line-height:70px; }
    #toppage .access .box .come { padding: 30px 0 0 ;}
    #toppage .access .box .come p:nth-child(1) { font-size:150%;}
    #toppage .access .box .come p:nth-child(2) { font-size:100%; font-weight: 500;}
}
@media only screen and (max-width:468px){
    #toppage .access .box { flex-direction: column; gap:20px;}
    #toppage .access .box + .box {margin-top: 40px;}
    #toppage .access .box .map,
    #toppage .access .box .txt {  width:100%;}
    #toppage .access .box .txt h4 { max-width:100px; font-size:87.5%; line-height:30px; }
    #toppage .access .box .come { padding:10px 0 0;}
    #toppage .access .box .come p:nth-child(1) { font-size:100%;}
    #toppage .access .box .come p:nth-child(2) { margin-top: 0; font-size: 75%;}
}


/* Banner */
#toppage .info .bana { display: flex; gap:40px;}
#toppage .info .bana p { width: calc(50% - 10px);}
@media only screen and (max-width:768px){
    #toppage .info .bana { gap:30px;}
}
@media only screen and (max-width:468px){
    #toppage .info .bana { gap:20px;}
}