@charset "utf-8";

@media all and (max-width: 1399px) {
  .cont_sort{ padding: 20px 25px; }
  .cont_sort i{ width: 60px; color: var(--color-02); font-size: 3.5em; line-height: 1.125em; text-align: center; }
  .cont_sort span{ width: calc(100% - 60px); }
  .cont_sort span b{ font-size: 1.125em; }
  .cont_sort span p{ font-size: .875em; }
}

@media all and (max-width: 1199px) {
  :root{
  --height-01: 60px;
  }

  .logo{ margin: 12px 0;}
  .logo a{ width: 212px; height: 36px; }

  .bnr_inr{ height: auto; padding: 100px 0; background: #243954; }
  .bnr_index{ background: linear-gradient(rgba(27, 42, 68, .7), rgba(27, 42, 68, .7)), url('../img/pic-bnr.webp') right 14% center no-repeat;}
  .bnr_view{ background: linear-gradient(rgba(27, 42, 68, .7), rgba(27, 42, 68, .7)), url('../img/pic-bnr_view.webp') right 20% top 15% no-repeat;}
  .bnr_qa{ background: linear-gradient(rgba(27, 42, 68, .7), rgba(27, 42, 68, .7)), url('../img/pic-bnr_qa.webp') right 10% top 40% no-repeat;}
  .bnr_abt{ background: linear-gradient(rgba(27, 42, 68, .7), rgba(27, 42, 68, .7)), url('../img/pic-bnr_abt.webp') right 10% top 70% no-repeat;}
  .bnr_atty{ background: linear-gradient(rgba(27, 42, 68, .7), rgba(27, 42, 68, .7)), url('../img/pic-bnr_atty.webp') right 10% top 55% no-repeat;}
  .bnr_serv{ background: linear-gradient(rgba(27, 42, 68, .7), rgba(27, 42, 68, .7)), url('../img/pic-bnr_serv.webp') right 10% top 45% no-repeat;}
  .bnr_cont{ background: linear-gradient(rgba(27, 42, 68, .7), rgba(27, 42, 68, .7)), url('../img/pic-bnr_cont.webp') right 10% top 35% no-repeat;}

  #i_news .box_index .box_img{ height: auto; aspect-ratio: 21 / 10; }
  #i_news .box_index .box_cap{ height: auto;}
  #i_news .box_img{ height: auto; }

  #i_join .row > div span b{ font-size: 1.75em; line-height: 1.325em; }
  #i_join .row > div span p{ margin-top: 5px; font-size: 1em; }

  .abt_ft_wrap span{ padding-left: 20px; }

  .cont_grid .cont_grid_child:nth-child(1) { order: 3;}

  .btm_sec_wrap.btm_view{ background: var(--color-01) url('../img/pic-btm_sec_view.webp') left 0% top 28% no-repeat; background-size: 300px auto; }
  .btm_sec_wrap.btm_qa{ background: var(--color-01) url('../img/pic-btm_sec_qa.webp') left 0% top 28% no-repeat; background-size: 300px auto; }
  .btm_sec_wrap.btm_abt{ background: var(--color-01) url('../img/pic-btm_sec_abt.webp') left 0% top 28% no-repeat; background-size: 250px auto; }
  .btm_sec_wrap.btm_atty{ background: var(--color-01) url('../img/pic-btm_sec_atty.webp') left 0% top 5% no-repeat; background-size: 300px auto; }
  .btm_sec_wrap.btm_serv{ background: var(--color-01) url('../img/pic-btm_sec_serv.webp') left 0% top 28% no-repeat; background-size: 250px auto; }
  .btm_sec_wrap.btm_cont{ background: var(--color-01) url('../img/pic-btm_sec_cont.webp') left 0% top 28% no-repeat; background-size: 250px auto; }
  .btm_sec_wrap .row > div:last-child{ justify-content: center; }
  .btm_sec_wrap .row > div:last-child a{ margin: 0 10px; }
}

@media all and (max-width: 991px) {
  .qa_wrap .q_wrap p{ text-overflow: clip; white-space: normal; overflow: auto;}

  #i_join .row > div{ flex-wrap: wrap; }
  #i_join .row > div span{ width: calc(100% - 100px); padding: 0 0 0 40px;}
  #i_join .row > div a{ margin: 20px auto 0 auto; }

  #i_abt h2{ margin: 40px 0 40px 0; padding: 0 0 30px 0; border-bottom: var(--border-01); }
  #i_abt .i_abt_pic{ width: 150px; height: 186px; right: 20px; bottom: 40px; }

  .share_wrap .share{ flex-wrap: wrap;}
  .share_wrap .share:nth-child(1) span:nth-child(1){ width: 100%; margin-bottom: 10px;}
}

@media all and (min-width: 768px) and (max-width: 991px) {
  .sub2_info_wrap{ margin: 20px 0; flex-wrap: wrap;}
  .sub2_info_wrap .sub2_info, .sub2_info_wrap .sub2_info2{ width: 100%; }
  .sub2_info_wrap .sub2_info2{ margin: 40px 0 20px 0;}
}

@media all and (max-width: 768px) {
}

@media all and (max-width: 767px) {
  .copyright{ margin-bottom: 40px; }

  .bnr_cont::before{ background-position: right top; background-size: 300px auto; }
  .bnr_wrap h1, .bnr_wrap b{ font-size: 2.8em; }
  .bnr_wrap p{ font-size: 1.125em; }

  #i_news .box_index .box_cap, #i_h_news .box_cap{ height: auto; font-size: 1.25em;}
  #i_news .box_index .box_author span{ width: 46px;}
  #i_news .box_index .box_author p{ width: calc(100% - 46px); margin-left: 10px; font-size: 1em; }
  #i_news .box_index .quote{ display: none; }
  #i_news .box_cap{ height: auto; }

  #i_join .row > div i{ margin: 0 auto;}
  #i_join .row > div span{ width: 100%; margin-top: 20px; padding: 0;}
  #i_join .row > div span b{ font-size: 1.5em; line-height: 1.5em; text-align: center; display: block; }
  #i_join .row > div span p{ margin-top: 20px;}
  #i_join .row > div a{ margin: 40px auto 0 auto; }

  .pagination_wrap{ text-align: center; }
  .pagination{ display: none; }
  .pagination_jump{ float: none;}

  .float_wrap{ width: 100%; bottom: 0; right: 0; display: flex; }
  .float_wrap a{ width: calc(100% / 2); height: 40px; margin: 0 !important; border-radius: 0;}
  .float_wrap a p{ margin: 0; padding: 2px 0 0 0; font-weight: 700; line-height: 1em; text-align: center; }
  .float_wrap a p span{ margin: 0; font-size: .875em !important; line-height: 1em; display: inline-block; }

  .cnt_wrap{ padding: 30px 30px;}

  .abt_01_2{ flex: .6;}

  .cnt_wrap.cnt_border_l{ border-left: 0; }

  #link h3{ text-overflow: clip; white-space: normal; }

  .btm_sec_wrap.btm_view{ background: var(--color-01) url('../img/pic-btm_sec_view.webp') left 1% top 28% no-repeat; background-size: 250px auto; }
  .btm_sec_wrap.btm_qa{ background: var(--color-01) url('../img/pic-btm_sec_qa.webp') left 1% top 28% no-repeat; background-size: 250px auto; }
  .btm_sec_wrap.btm_abt{ background: var(--color-01) url('../img/pic-btm_sec_abt.webp') left -5% top 28% no-repeat; background-size: 220px auto; }
  .btm_sec_wrap.btm_atty{ background: var(--color-01) url('../img/pic-btm_sec_atty.webp') left -10% top 20% no-repeat; background-size: 300px auto; }
  .btm_sec_wrap.btm_serv{ background: var(--color-01) url('../img/pic-btm_sec_serv.webp') left -5% top 28% no-repeat; background-size: 220px auto; }
  .btm_sec_wrap.btm_cont{ background: var(--color-01) url('../img/pic-btm_sec_cont.webp') left -5% top 28% no-repeat; background-size: 220px auto; }

  .cont_step_wrap{ justify-content: space-between; }
  .cont_step{ flex-wrap: wrap; }
  .cont_step i{ width: 30px; margin: 0 auto 10px auto; line-height: 30px;}
  .cont_step p{ width: 100%; padding: 0 10px; font-size: .75em; text-align: center;}
  .cont_step_line{ width: 40px; margin: 0 0px;}

  .cont_form_sort i{ font-size: 1.5em; }
  .cont_form_sort p{ margin-top: 15px; font-size: .875em; }
}

@media all and (max-width: 600px) {
  .box_wrap2{ flex-wrap: wrap; }
  .box_wrap2 .box_img_wrap{ width: 100%;}
  .box_wrap2 .box_img{ aspect-ratio: 21 / 10; }
  .box_wrap2 .box_txt_wrap{ width: 100%;}
  .box_wrap2 .box_txt_wrap .box_cap{ height: auto; }

  .sub2_info_wrap{ margin: 20px 0; flex-wrap: wrap;}
  .sub2_info_wrap .sub2_info, .sub2_info_wrap .sub2_info2{ width: 100%; }
  .sub2_info_wrap .sub2_info2{ margin: 40px 0 20px 0;}

  .btm_sec_wrap.btm_view{ background: var(--color-01) url('../img/pic-btm_sec_view.webp') center top 10% no-repeat; background-size: 200px auto; }
  .btm_sec_wrap.btm_qa{ background: var(--color-01) url('../img/pic-btm_sec_qa.webp') center top 10% no-repeat; background-size: 220px auto; }
  .btm_sec_wrap.btm_abt{ background: var(--color-01) url('../img/pic-btm_sec_abt.webp') center top 13% no-repeat; background-size: 200px auto; }
  .btm_sec_wrap.btm_atty{ background: var(--color-01) url('../img/pic-btm_sec_atty.webp') center top 5% no-repeat; background-size: 250px auto; }
  .btm_sec_wrap.btm_serv{ background: var(--color-01) url('../img/pic-btm_sec_serv.webp') center top 13% no-repeat; background-size: 200px auto; }
  .btm_sec_wrap.btm_cont{ background: var(--color-01) url('../img/pic-btm_sec_cont.webp') center top 12% no-repeat; background-size: 200px auto; }
  .btm_sec_wrap .row > div:nth-child(2){ width: 100%; margin-top: 100px; text-align: center; }
  .btm_sec_wrap .row > div:nth-child(2) div{ width: 100%; }
  .btm_sec_wrap .row > div:last-child a{ margin: 0 5px; padding: 8px 15px; font-size: 1em; }
  .btm_sec_wrap .row > div:last-child i{ margin-left: 5px;}
  .btm_sec_wrap b{ width: 100%; font-size: 1.5em; }
  .btm_sec_wrap p{ font-size: 1.125em; }
}

@media all and (max-width: 575px) {
  :root{
  --height-01: 60px;
  --padding-01: 50px 0;
  }

  h2{ font-size: 1.325em; }
  h3{ font-size: 1.25em; }
  h4{ font-size: 1.125em; }
  h5{ font-size: 1.15em; }
  h6{ font-size: 1em; }

  main section:last-child{ padding-bottom: 80px; }

  section#i_news h2, section#i_scenario h2, section#i_news2 h2, section#i_qa h2{ margin-bottom: 30px; padding-bottom: 20px;}
  section#i_news h2 b, section#i_scenario h2 b, section#i_news2 h2 b, section#i_qa h2 b{ margin-right: 10px;}
  section#i_news h2 span, section#i_scenario h2 span, section#i_news2 h2 span, section#i_qa h2 span{ margin: 8px 0 0 4px; font-size: .3em;}

  .g-4-5 { --bs-gutter-x: 1.25rem; --bs-gutter-y: 1.25rem;}

  .breadcrumb-item{ font-size: .75em; }

  .bnr_eyebrow{ margin-bottom: 15px; font-size: .875em;}
  .bnr_eyebrow::before{ width: 20px;}

  .bnr_inr{ height: auto; padding: 60px 0;}
  .bnr_cont::before{ background-size: 250px auto; }
  .bnr_wrap h1, .bnr_wrap b{ margin-bottom: 15px; font-size: 2.25em; text-shadow: 0 0 8px rgba(0, 0, 0, .75); }
  .bnr_wrap p{ margin-top: 15px; font-size: 1.125em; text-shadow: 0 0 8px rgba(0, 0, 0, .75); }
  .bnr_srch input{ width: calc(100% - 100px);}
  .bnr_srch button{ width: 100px; font-size: 1.125em;}
  .bnr_tags a{ height: 34px; padding: 8px 10px; font-size: .75em; }

  .scenario_wrap i{ width: 75px; }
  .scenario_wrap p{ margin-top: 5px; font-size: 1.25em;}

  .qa_wrap .box_info{ flex-wrap: wrap; }
  .qa_wrap .box_info .box_author, .qa_wrap .box_info .box_view{ width: 100%; }
  .qa_wrap .box_info .box_view{ display: none; }
  .qa_wrap .q_wrap i, .qa_wrap .a_wrap i{ width: 34px; line-height: 32px; }
  .qa_wrap .q_wrap p{ padding-top: 3px; font-size: 1.125em;}

  #i_abt h2{ margin: 40px 0 30px 0; padding: 0 0 20px 0; }
  #i_abt .i_abt_pic{ width: 130px; height: 161px; bottom: 30px; }

  .abt_ft_wrap{ flex-wrap: wrap;}
  .abt_ft_wrap i{ margin: 0 auto 10px auto; }
  .abt_ft_wrap span{ width: 100%; margin-top: 5px; padding: 0; text-align: center; }

  .cnt_wrap h1{ font-size: 1.5em; }
  .cnt2_wrap{ padding: 20px 20px;}

  .sub2_info_wrap{ margin: 20px 0;}
  .main_sub_sort_wrap a{ margin-right: 5px; font-size: .813em;}
  .sub2_info_wrap .sub2_info p{ font-size: .813em;}
  .sub2_info_wrap .sub2_info2{ margin-top: 30px;}
  .sub2_info_wrap .sub2_info2 a:nth-child(1) i{ margin-
    right: 8px;}
  .sub2_info_wrap .sub2_info2 a:nth-child(2) i{ margin-left: 8px;}
  .sub2_info_wrap .sub2_info2 a{ font-size: .875em; }

  footer .logo{ float: none; width: 236px; margin: 0 auto 20px auto;}
  footer .logo_txt{ width: 100%; text-align: center; }
  footer .f_social{ margin: 0 0 20px 0; justify-content: center; }
  footer .f_social a{ margin: 0 8px;}

  .cnt_wrap{ padding: 20px 20px;}

  .ul_wrap{ padding: 20px; flex-wrap: wrap;}
  .ul_wrap i{ margin: 0 auto 20px auto;}
  .ul_wrap p{ width: 100%; }

  .h2_t1::before{ margin-right: 20px; }
  .h2_t1::after{ margin-left: 20px; }

  .abt_01{ display: block;}
  .abt_01_2{ width: 100%; height: 400px; margin-top: 20px;}
  .abt_subtitle{ width: 100%; font-size: .813em; }
  .abt_title{ font-size: 1.5em; }
  .abt_quote{ padding: 46px 40px; }
  .abt_quote p{ color: #666; font-size: 1.125em; line-height: 1.875em;}
  .abt_quote::before, .abt_quote::after{ font-size: 3em; }

  .abt_02 .abt_02_item i{ width: 60px; font-size: 2em; }
  .abt_02 .abt_02_item i::after{ font-size: .65em; top: 18px; right: 16px; }
  .abt_02 .abt_02_item span b{ margin-bottom: 8px; font-size: 1.5em; }
  .abt_02 .abt_02_item span p{ font-size: 1.125em; }

  .serv_item{ gap: 15px;}
  .serv_item i{ width: 66px; padding: 15px;}
  .serv_item span b{ font-size: 1.125em;}
  .serv_item span p{ font-size: .938em; }

  .cont_form_sort i{ font-size: 2em; }
  .cont_form_sort p{ font-size: 1em; }

}

@media all and (max-width: 480px) {
  .bnr_eyebrow{ margin-bottom: 10px; font-size: .813em;}
  .bnr_eyebrow::before{ width: 18px;}
  .bnr_cont::before{ background-size: 200px auto; }
  .bnr_wrap h1, .bnr_wrap b{ margin-bottom: 10px; font-size: 2em;}
  .bnr_wrap p{ margin-top: 10px; font-size: 1em; }

  .abt_01_2{ height: 300px;}

  .cont_step_line{ width: 8px; margin: 0 0px;}
}

@media all and (max-width: 375px) {
  .bnr_eyebrow{ margin-bottom: 8px; font-size: .75em;}
  .bnr_eyebrow::before{ width: 15px;}
  .bnr_cont::before{ background-size: 180px auto; }
  .bnr_wrap h1, .bnr_wrap b{ font-size: 1.75em;}
  .bnr_wrap p{ margin-top: 8px; }
}

@media all and (max-width: 374px) {
}