@charset "utf-8";
/* CSS Document */
@media screen and (min-width:1300px) {
    body.is-desktop-pre-scroll .site-header__inner{
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transform: translateY(-10px);
    }
    body.is-desktop-pre-scroll .logo{
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
    }
    body.is-desktop-scrolled .site-header__inner{
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translateY(0);
    }
    body.is-desktop-scrolled .logo{
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
    }
}
/* Column: enable horizontal scroll within 1440px and below */
@media screen and (max-width:1440px){
    .column_content{
        overflow-x: auto;
        overflow-y: hidden;
        flex-wrap: nowrap;
        -webkit-overflow-scrolling: touch;
        padding-bottom: 10px;
    }
    .column_item{
        flex: 0 0 283px;
        min-width: 283px;
    }
    .sub_header {
        margin: 0 20px;
    }
}
@media screen and (max-width:1300px) {
    .logo {
        display: block;
    }
    .sub_logo {
        display: none !important;
    }
    .site-header__inner {
        display: none;
    }
    .menu_trigger {
        display: flex;
    }
    .sub_header {
        display: flex !important;
    }   
    .sub_trigger {
        display: none !important;
    }
}
@media screen and (max-width:1100px) {
    .sub_logo {
        display: block !important;
    }
    .fv_collage {
        width: 650px;
    }
    .fv_content__right {
        transform: translate(800px,-50%);
    }
    .sub_header {
        display: none !important;
    }
    .sub_trigger {
        display: flex !important;
    }
}
@media screen and (max-width:1090px){
    .site-header__nav{
        display: none;
    }
    .site-header__telMeta{
        display: none;
    }
    .fv_content__inner{
        grid-template-columns: 1fr;
        gap: 24px;
    }
    .column_section {
        margin-left: 0;
    }
}
@media screen and (max-width:975px){
    #about_margin {
        margin-top: -26.5vw;
    }
}
@media screen and (max-width:899px){
    .site-header__logo img{
        width: 84px;
    }
    .site-header__telNumber{
        font-size: 20px;
    }
    .fv{
        padding-top: 120px;
    }
    .fv_content__title{
        font-size: 44px;
    }
    .flow_timeline::before {
        top: 40px;
        bottom: 175px;
    }
    .form_card {
        width: calc((100% - 80px) / 3);
    }
    .contact_form {
        padding: 80px 50px;
    }

}

@media screen and (max-width:768px){
    img {
        margin: 0 auto;
    }
    .logo {
        left: 40px;
        width: 60px;
    }
    .site-header__tel{
        display: none;
    }
    .site-header__cta{
        height: 36px;
        padding: 0 12px;
        font-size: 12px;
        border-radius: 8px;
    }
    .fv{
        padding-top: 110px;
        padding-bottom: 50px;
        height: 600px;
        background: #fff;
    }
    .fv_content__title,.main_section h2{
        font-size: 24px;
        line-height: 1.2;
    }
    .fv_text.mode1 h2 {
        font-size: 24px;
        margin-bottom: 16px;
    }
    .fv_content__lead{
        font-size: 12px;
        line-height: 1.4;
        margin-top: 8px;
    }
    .fv_content__btn{
        min-width: 0;
        height: 50px;
        font-size: 15px;
        margin-top: 16px;
        padding: 14px 27px;
    }
    .fv_collage {
        width: 500px;
        gap: 10px;
    }
    .fv_content__right {
        transform: translate(600px,-50%);
    }
    .fv_content__left {
        position: absolute;
        top: 4px;
        left: 16px;
        transform: translateY(0);
    }
    .visible-sp{
        display:block;
    }
    .hidden-sp{
        display:none;
    }
    .extra_bg,.extra_bg1 {
        width: 125px;
        top: -125px;
        display: none;
    }
    #service_more {
        margin-top: 32px;
        line-height: 1;
    }
    #news_section {
        padding: 20px 0;
    }
    .section {
        padding: 0 20px;
    }
    #other_section{
        padding: 0;
        max-width: 520px;
    }
    #service_section  {
        padding: 40px 0;
    }
    .news__link{
        padding: 16px;
        flex-wrap: wrap;
        justify-content: end;
    }
    .news__left{
        align-items: flex-end;
        gap: 14px;
        width: 100%;
    }
    .news {
        padding: 0;
    }
    .news__right {
        padding: 6px 0;
    }
    .news__text,.news__more,.quiz_answer,.service_text,.reason_list li span,.column_excerpt,.footer_copy,.footer_privacy,.main_content p,.table_body p,.flow_desc,.near_text_span,.contact_content p{
        font-size: 14px;
        min-height: 0;
    }
    .news__icon {
        width: 22px;
        height: 14px;
    }
    .service__title,.fv_text h1 {
        font-size: 24px;
        line-height: 1.2;
        margin-bottom: 4px;
    }
    .service_item {
        width: calc((100% - 76px) / 3);
    }
    .service__label{
        font-size: 15px;
        line-height: 1;
    }
    .service__lead,.fv_text p {
        font-size: 14px;
        margin-top: 4px;
        line-height: 1.4;
    }
    #service_list {
        padding: 32px 0 80px;
    }
    .service_list {
        gap: 38px;
    }
    .card_title {
        font-size: 18px;
        min-height: 35px;
    }
    .about_text p{
        font-size: 12px;
        margin-top: 8px;
    }
    #reason_section {
        padding: 40px 20px;
    }
    #reason {
        gap: 20px;
        border-radius: 20px;
        padding: 20px;
        flex-direction: column-reverse;
    }
    .reason_body,.reason_img {
        max-width: 520px;
        margin: 0 auto;
    }
    .reason_list li {
        font-size: 20px;
        margin-top: 20px;
    }
    .reason_list li:first-child {
        margin-top: 28px;
    }
    .about_img {
        gap: 26px;
    }
    .about_text {
        padding: 8px;
    }
    .about_box {
        border-radius: 10px;
    }
    .about_text h5 {
        min-height: 0;
        margin-top: 0;
    }
    #about_section {
        padding: 75px 0 80px;
        background-size: auto 455px;
        background-image:url(../img/about_bg_sp.png) ;
        overflow: hidden;
    }
    #about_extra {
        margin-top: 35px;
        margin-right: 10px;
    }
    #about_margin {
        margin-top: -103px;
    }
    .about_item {
        gap: 10px;
        margin-left: 55px;
    }
    .quiz_body {
        min-width: 276px;
    }
    .quiz_section {
        gap: 4px;
        flex-direction: column;
    }
    .quiz_list {
        margin: 0;
    }
    .quiz_question {
        font-size: 16px;
    }
    .accordion_title {
        padding: 14px 0;
    }
	/* FAQ */
	#quiz,#column{
		padding: 80px 20px;
	}
	.accordion_title{
		padding: 14px 0;
	}
    .column_top,.column_content {
        flex-direction: column;
        overflow: unset;
    }
    .column_section {
        margin: 0 auto;
        padding: 0;
        max-width: 520px;
    }
    .column_body {
        max-width: 100%;
    }
    .column_title {
        font-size: 18px;
        min-height: 0;
    }
    .column_quiz {
        margin-top: 90px;
        max-width: 680px;
        padding: 0;
    }
    .sub_quiz {
        padding: 0 20px;
        margin-top: 60px;
    }
    .quiz__title {
        font-size: 20px;
    }
    .quizCta {
        padding: 32px 0;
    }
    .quizCta__text {
        font-size: 12px;
        margin-top: 10px;
        padding: 0 20px;
    }
    #recruit_more,#contact_more {
        margin-top: 16px;
        padding: 13px 10px 13px 60px;
    }
    #recruit_text,#contact_text  {
        font-size: 16px;
    }
    .quizCta__bottom {
        flex-direction: column;
        margin-top: 16px;
        gap: 0;
    }
    footer {
        margin-top: -185px;
    }
    .footer_section {
        padding: 165px 0 60px;
    }
    .footer_inner {
        flex-direction: column-reverse;
        max-width: 720px;
        padding: 0 20px;
    }
    .footer_inner::before {
        display: none;
    }
    .footer_border {
        width: 100%;
        height: 1px;
        background: #5B627D;
        margin-top: 42px;
    }
    .footer_left,.footer_address {
        flex: 0 0 auto;
        margin-top: 20px;
        font-size: 14px;
    }
    .footer_brand img {
        width: 220px;
    }
    .footer_right {
        flex-direction: row-reverse;
    }
    .footer_legal,.footer_sns {
        margin-top: 16px;
    }
    .footer_snsLink img {
        width: 28px;
        height: 28px;
    }
    .footer_navList li,.footer_otherList li {
        padding: 9px 0;
    }
    #about_sp {
        margin-left: 105px;
        gap: 16px;
    }
    .sub_section,.table_section,.issue_section
    ,.flow_section,.concept_section,.contact_section {
        padding: 40px 0;
    }
    .fv_section.mode1,.fv_section.mode2 {
        padding: 80px 40px 40px 40px;
    }
    .fv_section.other_mode1 {
        padding: 0 40px 40px;
    }
    .main_section.mode1,.main_section.mode2
    ,.flow_list {
        flex-direction: column;
        padding: 0 40px;
        gap: 20px;
    }
    .main_content,.main_img {
        width: 100%;
    }
    .main_section,.main_section_other  {
        padding: 0 40px;
    }
    .sub_content p{
        font-size: 16px;
        margin-top: 0;
    }
    .main_subtitle h6 {
        margin-top: 8px;
    }
    .table_item {
        flex-direction: column;
        align-items: start;
        gap: 8px;
    }
    .table_list {
        padding: 0 20px;
    }
    .table_body,.issue_item,.flow_content {
        width: 100%;
    }
    .table_link {
        gap: 8px;
    }
    .table_link a#service_more {
        padding: 12px 0;
        width: calc(50% - 4px);
        justify-content: center;
        position: relative;
    }
    .table_link span.news__icon {
        position: absolute;
        right: 14px;
    }
    .issue_content  {
        flex-direction: column;
        gap: 14px;
        padding: 20px;
    }
    .flow_title {
        font-size: 18px;
    }
    .flow_badge {
        width: 50px;
        height: 50px;
    }
    .flow_timeline::before {
        left: 23px;
        bottom: 110px;
    }
    .flow_badgeNumber,.near_text p {
        font-size: 16px;
    }
    .flow_badgeLabel {
        font-size: 12px;
    }
    .flow_text {
        margin-top: 16px;
    }
    .flow_step {
        padding-bottom: 20px;
        gap: 10px;
    }
    .sub_link .news__left {
        flex-direction: column;
        align-items: start;
        gap: 4px;
    }
    .sub_link .news__meta {
        flex-direction: row-reverse;
        align-items: start;
    }
    .near_text_span {
        margin-bottom: 8px;
    }
    .near_section h2 {
        font-size: 20px !important;
    }
    .near_section .main_section {
        padding: 0 32px !important;
    }
    .concept_section .main_section {
        gap: 0;
    }
    .more_section {
        padding: 80px 0 40px 0;
    }
    .more_content {
        gap: 40px;
        margin-top: 40px;
        flex-direction: column;
    }
    .more_item {
        width: 100%;
        max-width: 100%;
    }
    .more_title,.agent_title {
        font-size: 20px;
    }
    .agent_content {
        flex-direction: column;
        padding: 40px 30px;
        align-items: center;
    }
    .agent_right,.contact_submitWrap {
        margin-top: 20px;
        flex: 0 0 auto;
    }
    .agent_desc {
        font-size: 15px;
        margin-top: 10px;
    }
    .agent_actions {
        gap: 16px;
        margin-top: 16px;
    }
    .common_button .news__more {
        font-size: 16px;
    }
    .common_button span.news__icon {
        top: 16px;
    }
    .contact_submit span.news__icon {
        top: 18px;
    }
    .contact_form {
        padding: 40px 20px;
    }
    .contact_labelWrap {
        justify-content: start;
    }
    .contact_row {
        flex-direction: column;
        align-items: start;
        gap: 4px;
        margin-bottom: 10px;
    }
    .contact_submit .news__more,.form_title h6,.contact_labelText {
        font-size: 15px;
    }
    .contact_field {
        width: 100%;
    }
    .form_title {
        gap: 4px;
    }
    .form_list {
        gap: 10px;
    }
    .form_card {
        width: calc((100% - 20px) / 3);
    }
    .form_title span {
        font-size: 10px;
    }
    .workplace_nav--next {
        right: 40px;
    }
    .workplace_nav--prev {
        left: 40px;
    }
}
@media screen and (max-width:600px) {
    .form_card {
        width: calc((100% - 10px) / 2);
    }
}
@media screen and (max-width:550px) {
    .logo {
        left: 20px;
        width: 60px;
    }
    .site-header__inner{
        padding: 0 14px;
    }
    .fv_content__left {
        left: 0;
    }
    .menu_nav.is-open {
        width: 100%;
    }
    .news__left {
        gap: 20px;
        align-items: flex-start;
    }
    .service_list {
        gap: 14px;
    }
    #service_list {
        padding: 32px 40px 80px 40px;
    }
    .service_item {
        width: calc((100% - 14px) / 2);
    }
    .column_section {
        padding: 0 20px;
    }
    #quiz {
        padding: 80px 40px;
    }
    #service_section {
        padding: 40px;
    }
    .fv_content__left {
        width: 55vw;
    }
    .about_body {
        padding: 0 40px;
    }
    .about_item {
        margin-left: 0;
        gap: 10px;
    }
    #about_sp {
        margin-left: 40px;
        gap: 16px;
    }
    .fv_collage {
        width: 272px;
        gap: 8px;
    }
    .fv_content__right {
        transform: translate(315px,-50%);
    }
    a.site-header__snsLink--line:hover img {
        display: none;
    }
    .fv_content__left br {
        display: none;
    }
    .fv_sp {
        margin-top: 0;
    }
    .fv_sp br {
        display: block;
    }
    .flow_timeline::before {
        bottom: 135px;
    }
}
@media screen and (max-width:400px) {
    #about_sp {
        margin-right: -10px;
    }
    .about_item {
        margin-left: -10px;
    }
    .about_text4 {
        padding-right: 18px !important;
    }
    .about_text1 {
        padding-left: 18px !important;
    }
    #about_extra {
        margin-top: 35px;
    }
}
