@charset "utf-8";

/* 共通部品 */

.fx{ display: flex; flex-wrap: wrap; list-style: none;}
.fx4-sb{ justify-content: space-between; gap: 30px 30px;}
.fx4-sb li{ width: calc((100% - 120px) / 4);}
@media screen and (max-width: 1200px) {
  .fx4-sb li{ width: calc((100% - 30px) / 2);}
}
@media screen and (max-width: 500px) {
  .fx4-sb li{ width: 100%;}
}

.shadow1{ filter: drop-shadow(0 2px 8px rgba(0,0,0,0.20)); border: 1px solid rgba(255,255,255,0.2);}

.hr1{ display: block; margin: var(--sp-l) auto var(--sp-m) auto; max-width: 640px; width: 80%; height: 31px; border: none;position: relative;}
.hr1::after{ position: absolute; content: ""; top: 0; left: 50%; transform: translateX(-50%); width: 31px; height: 31px; background-color: #1C2D6A; border: 10px solid #fff; border-radius: 50%;}
.hr1::before{ position: absolute; content: ""; top: 15px; left: 50%; transform: translateX(-50%); width: 100%; height: 1px; background-color: #1C2D6A;}

.hr1_backgray{ display: block; margin: var(--sp-ms) auto var(--sp-m) auto; max-width: 640px; width: 80%; height: 31px; border: none; position: relative;}
.hr1_backgray::after{ position: absolute; content: ""; top: 0; left: 50%; transform: translateX(-50%); width: 31px; height: 31px; background-color: #1C2D6A; border: 10px solid #F3F3F3; border-radius: 50%;}
.hr1_backgray::before{ position: absolute; content: ""; top: 15px; left: 50%; transform: translateX(-50%); width: 100%; height: 1px; background-color: #1C2D6A;}

a.btn1{ display: block; max-width: 300px; width: 90%; position: relative; font-weight: 500; line-height: 1.2; color: #fff; text-align: center; font-style: normal; padding: 8px 30px 10px 30px; border-radius: 6px; transition: all 0.6s;}
a.btn1:hover{ transform: scale(1.05); }
.bg_orange{ background-color: #EF5C00;}
.bg_navy{ color: #fff; background-color: #1C2D6A;}
.bg_trans_dark{ color: #fff; border: 1px solid #fff;}
@media screen and (max-width: 767px) {
  a.btn1{ max-width: 240px; font-size: 14px; line-height: 1.8; padding: 3px 10px 5px 10px; border-radius: 40px; }
}

.list_nav{ width: 90%; text-align: center;}
a.btn2{ display: inline-block; position: relative; color: #1C2D6A; font-family: "Roboto", sans-serif; font-weight: 500; font-variation-settings: "wdth" 75;}
a.btn2_l{ padding: 5px 15px 5px 40px;}
a.btn2_r{ padding: 5px 40px 5px 15px;}
a.btn2_c{ padding: 5px 15px;}
a.btn2_l::before{ position: absolute; left: 10px; bottom: 15px; content: ""; width: 25px; height: 1px; background-color: #1C2D6A; transition: all 0.6s;}
a.btn2_l::after{ position: absolute; left: 10px; bottom: 15px; content: ""; width: 10px; height: 1px; background-color: #1C2D6A; transform: rotate(-45deg); transform-origin: left 0; transition: all 0.6s;}
a.btn2_r::before{ position: absolute; right: 10px; bottom: 15px; content: ""; width: 25px; height: 1px; background-color: #1C2D6A; transition: all 0.6s;}
a.btn2_r::after{ position: absolute; right: 10px; bottom: 15px; content: ""; width: 10px; height: 1px; background-color: #1C2D6A; transform: rotate(45deg); transform-origin: right 0; transition: all 0.6s;}
a.btn2:hover{ color: #EF5C00;}
a.btn2_l:hover::before{ left: 0; width: 35px;}
a.btn2_l:hover::after{ left: 0;}
a.btn2_r:hover::before{ right: 0; width: 35px;}
a.btn2_r:hover::after{ right: 0;}
@media screen and (max-width: 767px) {
  a.btn2_l::before,a.btn2_l::after,a.btn2_r::before,a.btn2_r::after{ bottom: 12px;}
  a.btn2_l::after,a.btn2_r::after{ width: 8px;}
}

.title1{ font-weight: 700; font-size: 32px; line-height: 1.2; color: #1C2D6A;}
.title1 .title_sub{ font-family: "Roboto", sans-serif; font-weight: 400; font-variation-settings: "wdth" 75; font-size: 16px;}
.titlebar{ padding-bottom: 10px; border-bottom: 1px solid #6880D7;}
@media screen and (max-width: 767px) {
  .title1{ font-size: 24px; line-height: 1.4;}
}

.tags span{ display: inline-block; font-size: 12px; padding: 3px 5px 4px 5px; line-height: 12px; background-color: #D9D9D9; color: #000; border-radius: 3px; margin-right: 5px;}
.tags span.tags_date{ background: transparent;}

/* header & nav */

.header{ z-index: 98; position: fixed; top: 30px; left: 50px; width: calc(100% - 100px); height: 80px; padding: 0 100px 0 50px; border-radius: 10px; display: flex; justify-content: space-between; align-items: center; background: linear-gradient( to right, rgba(255,255,255,0.9), rgba(255,255,255,0.9) 100px, rgba(255,255,255,0.2) ); backdrop-filter: blur(5px);}
.logo{ max-width: 240px; width: 70%; font-size: 12px; line-height: 1.0;}
.logo a{ display: block; color:#000; text-align: center;}
.logo a span{ display: block; margin-top: 8px;}
@media screen and (max-width: 767px) {
  .header{ top: 5px; left: 5px; width: calc(100% - 10px); height: 40px; padding: 0 0 0 10px; border-radius: 20px; display: flex; justify-content: space-between; align-items: center; background: linear-gradient( to right, rgba(255,255,255,0.9), rgba(255,255,255,0.9) 100px, rgba(255,255,255,0.2) ); backdrop-filter: blur(5px);}
  .logo{ max-width: 140px; width: 70%; font-size: 12px; line-height: 1.0;}
  .logo a{ display: block; color:#000; text-align: center;}
  .logo a span{ display: block; margin-top: 8px;}
}

main{ overflow: hidden;}

/* :::::: nav_pc :::::: */

.nav_pc{ position: relative;}
.nav_pc ul{ display: flex; justify-content: flex-end;}
.nav_pc ul li{ display: block;}
.nav_pc ul li a{ display: block; padding: 22px 10px; color: #000; font-size: 15px; line-height: 16px; font-weight: 500; letter-spacing: 0; transition: all .6s; filter: drop-shadow(0 0 3px rgba(255,255,255,0.70));}
.nav_pc ul li a:hover{ background-color: rgba(255,255,255,0.8);}
.nav_pc ul li.nav_contact a{ background-color: rgba(239,92,0,1.00); color: #fff; filter: none; border-radius: 5px;}
.nav_pc ul li.nav_contact a:hover{ transform: scale(1.1);/*background-color: rgba(239,92,0,0.70);*/}
.nav_pc ul li.nav_contact{ position: relative;}
@media screen and (max-width: 1320px) {
  .nav_pc ul li:not(.nav_contact){ display: none;}
}
@media screen and (max-width: 767px) {
  .nav_pc ul li.nav_contact{ display: none;}
}

/* :::::: nav_sp :::::: */

#navTgl{ display: none;}
.open,.close{ cursor: pointer; position: fixed; top: 45px; right: 80px;  }
.open { /*background-color: rgba(255,255,255,0.00);*/ z-index: 101; width: 50px; height: 50px; transition: all .6s;}
.open span,.open::before,.open::after { position: absolute; top: 24px; left: 0px; content: ""; width: 50px; height: 1px; background-color: #000; transition: all .6s;}
.open::before { transform: translateY(-6px);}
.open::after { transform: translateY(6px);}
.close { background-color: rgba(0,80,110,0.0); z-index: 99; width: 50px; height: 50px; pointer-events: none; transition: background .6s;}
#navTgl:checked + .open{ /*border: 1px solid #fff;*/}
#navTgl:checked + .open span { transform: scaleX(0);}
#navTgl:checked + .open::before { transform: rotate(135deg); background-color: #fff; }
#navTgl:checked + .open::after { transform: rotate(-135deg); background-color: #fff; }
#navTgl:checked ~ .close { pointer-events: auto;}
/*.open:hover { background-color: rgba(255,255,255,0.30); }*/
.nav_sp { z-index: 100; position: fixed; overflow: auto; top: 0; right: 0; width: 100%; height: 100%; background: rgba(28,45,106,0.9); display: flex; justify-content: center; align-items: center; transform: translateX(100%); transition: all .6s;}
.nav_sp div{ width: 90%; max-width: 400px;}
.nav_sp h2,.nav_sp a { color: #FFF;}
.nav_sp h2 { text-align: center; background-color: rgba(255,255,255,.2); /*margin-bottom: 20px;*/}
.nav_sp ul { margin: 0; padding: 0;}
.nav_sp li { list-style: none; font-size: 16px; text-align: center; line-height: 1.4; border-bottom: 1px solid rgba(255,255,255,.2);}
.nav_sp li:first-child{ border-top: 1px solid rgba(255,255,255,.2);}
.nav_sp a { display: block; padding: 1.5em 2em; text-decoration: inherit; transition: all .6s;}
#navTgl ~ .nav_sp { transform: translateX(100%);}
#navTgl:checked ~ .nav_sp { transform: none;}

@media screen and (max-width: 767px) {
  .open,.close{ top: 0px; right: 20px; display: block;}
}

/* footer */
.contact_box{ color: #fff; text-align: center; background: url("../images/contact_banner_back.jpg") center center no-repeat; background-size: cover; padding: 50px;}
.contact_box h2{ max-width: 500px; margin: 0 auto; display: block; font-size: 18px; line-height: 1.4; font-weight: 500; padding: 5px 1em 7px 1em; border-top: 1px solid #fff; border-bottom: 1px solid #fff;}
.contact_box p{ font-size: 14px; line-height: 1.6; padding: 20px;}
.contact_box address{ display: flex; justify-content: center; gap: 20px;}
.contact_box address a{ display: block; width: 220px; line-height: 20px;}
.contact_box address a.bg_trans_dark{ font-family: "Roboto", sans-serif; font-weight: 500; font-variation-settings: "wdth" 75; font-size: 110%;}
@media screen and (max-width: 520px) {
  .contact_box h2{ font-size: 16px;}
  .contact_box p{ font-size: 14px; line-height: 1.6; padding: 10px 0;}
  .contact_box{ padding: 30px 5%;}
  .contact_box address{ display: flex; justify-content: space-between; gap: 0;}
  .contact_box address a{ width: 48%; line-height: 1.2; padding: 7px 0;}
}
.footer_cover{ background-color: #202020; color: #fff; padding: 15px 5%; display: flex; justify-content: center; }
.footer_logo_address{ display: flex; justify-content: flex-start; align-items: flex-start; gap: 30px; font-size: 12px;}
.footer_logo{ width: 100px; margin-top: 5px;}
@media screen and (max-width: 420px) {
  .footer_logo_address{ display: flex; justify-content: flex-start; align-items: flex-start; gap: 15px; font-size: 12px; line-height: 1.4;}
}
  
/* main visual */

.main_v{ width: 100%; height: 100vh; background: url("../images/mv1.jpg") center center; background-size: cover; position: relative; }
.main_v_copy{ position: absolute; top: 50%; left: 50%; transform: translate(-50%,-35%);}
.main_v_copy1{background-color: rgba(255,255,255,0.10); backdrop-filter: blur(5px); padding: 40px 30px; border: 1px solid rgba(255,255,255,0.24); border-radius: 30px;}
.main_v_copy1 h1{ font-size: 56px; line-height: 64px; text-align: center; font-family: "Roboto", sans-serif; font-weight: 600; font-variation-settings: "wdth" 75; font-style: oblique; color: #fff; filter: drop-shadow(0 2px 8px rgba(0,0,0,0.50)); white-space: nowrap;}
.main_v_copy1 p{ margin-top: var(--sp-s); text-align: center; font-size: 24px; color: #fff;}
.main_v_copy2 p{ margin-top: 30px; text-align: center; font-size: 16px; color: #fff; filter: drop-shadow(0 0 4px #01276d);}
.main_v_btn{ margin-top: 30px;}
.main_v_news{ position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%); max-width: 800px; width: 90%; border-radius: 10px; overflow: hidden; border: 1px solid #EF5C00;}
.main_v_news { display: flex; flex-wrap: wrap; color: #1C2D6A; padding: 2px; background-color: rgba(255,255,255,0.85);}
.main_v_news_header{ width: 100px; background-color: #EF5C00; border-radius: 7px 0 0 7px; font-size: 13px; line-height: 1.0; font-weight: 500; color: #fff; display: flex; align-items: center; justify-content: center;}
a.main_v_news_box{ width: calc(100% - 100px); display: flex; flex-wrap: wrap; padding: 5px 0; font-weight: 500; color: #000; background-color: rgba(219,225,245,0.00); transition: all 0.6s;}
a.main_v_news_box:hover{ background-color: rgba(219,225,245,1.00);}
.main_v_news_date{ width: 90px; text-align: center; font-family: "Roboto", sans-serif; font-weight: 500; font-variation-settings: "wdth" 75; font-size: 12px; line-height: 1.0; padding: 10px 0 8px 0;}
.main_v_news_title{ width: calc(100% - 90px); font-size: 14px; line-height: 18px; padding: 6px 0 6px 0;}
@media screen and (min-width: 961px) and (max-height: 740px) {
  .main_v_copy{ transform: translate(-50%,-50%);}
}
@media screen and (min-width: 961px) and (max-height: 600px) {
  .main_v_copy{ transform: translate(-50%,-40%);}
  .main_v_news{ bottom: -50px; background-color: rgba(78,133,140,0.07);}
}
@media screen and (max-width: 960px) {
  .main_v{ background: url("../images/mv1sp1.jpg") center center; background-size: cover;}
  .main_v_copy{ transform: translate(-50%,-50%); width: 80%;}
  .main_v_copy1{ padding: 20px 15px; border: 1px solid rgba(255,255,255,0.24); border-radius: 30px;}
  .main_v_copy1 h1{ font-size: 40px; line-height: 4.8rem; white-space: normal;}
  .main_v_copy1 p{ margin-top: var(--sp-s); font-size: 16px;}
  .main_v_copy2 p{ margin-top: 20px; font-size: 14px;}
}
@media screen and (max-width: 640px) {
  .main_v_copy{ width: 90%;}
  .main_v_copy2 p{ margin-top: 20px; font-size: 14px;}
  .main_v_news_header{ width: 80px;}
  .main_v_news_box{ display: block; width: calc(100% - 80px); padding: 0 0;}
  .main_v_news_date{ width: 100%; text-align: left; padding: 6px 0 0px 10px;}
  .main_v_news_title{ width: 100%; padding: 0 0 6px 10px;}
}

/* sub visual */

.sub_v{ width: 100%; height: 400px; position: relative; margin-bottom: 50px;}
.sub_v_back1{ background: #EAF6FD url("../images/sub_back1.jpg") center center no-repeat; background-size: cover;}
.sub_v_back2{ background: #EAF6FD url("../images/sub_back2.jpg") center center no-repeat; background-size: cover;}
.sub_v_back3{ background: #EAF6FD url("../images/sub_back3.jpg") center center no-repeat; background-size: cover;}
.sub_v_back4{ background: #EAF6FD url("../images/sub_back4.jpg") center center no-repeat; background-size: cover;}
.sub_v_back42{ background: #EAF6FD url("../images/sub_back42.jpg") center center no-repeat; background-size: cover;}
.sub_v_back5{ background: #EAF6FD url("../images/sub_back5.jpg") center center no-repeat; background-size: cover;}
.sub_v_back6{ background: #EAF6FD url("../images/sub_back6.jpg") center center no-repeat; background-size: cover;}
.sub_v_back7{ background: #EAF6FD url("../images/sub_back7.jpg") center center no-repeat; background-size: cover;}
.sub_v_back8{ background: #EAF6FD url("../images/sub_back8.jpg") center center no-repeat; background-size: cover;}
.sub_v_back9{ background: #EAF6FD url("../images/sub_back9.jpg") center center no-repeat; background-size: cover;}
.sub_v_title{ position: absolute; bottom: -80px; left: 50%; transform: translateX(-50%); width: 80%; max-width: 700px; padding: 20px 20px 0 20px; background-color: rgba(255,255,255,0.10); backdrop-filter: blur(10px); text-align: center; border: 1px solid rgba(255,255,255,0.20); border-radius: 32px;}
.sub_v_title h1{ font-size: 24px; font-weight: 500; line-height: 28px; padding-bottom: 32px; color: #fff;}
.sub_v_title h1 span{ display: block;font-family: "Roboto", sans-serif; font-weight: 700; font-variation-settings: "wdth" 75; font-style: oblique; font-size: 64px; line-height: 74px; text-align: center;}
.sub_v_title p{ color: #1C2D6A; font-weight: 600;}
.sub_title_bottom2line{ padding-bottom: 3.6em;}
.sub_title_bottom1line{ padding-bottom: 1.8em;}
@media screen and (max-width: 767px) {
  .sub_v{ height: 240px;}
  .sub_v_title{ bottom: -65px; padding: 5px 10px 0 10px; border-radius: 20px;}
  .sub_v_title h1{ font-size: 14px; line-height: 20px; padding-bottom: 20px;}
  .sub_v_title h1 span{ font-size: 36px; line-height: 42px;}
  .sub_title_bottom2line{ padding-bottom: 20px;}
  .sub_title_bottom1line{ padding-bottom: 10px;}
}


/* =======================
    main
========================== */

/* home_introduce */
.home_1{ display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap;}
.home_1 figure{ width: 20%;}
.home_1 figure img{ width: 100%;}
.home_1_text{ width: 70%;}
@media screen and (max-width: 960px) {
  .home_1_text{ width: 75%;}
}
@media screen and (max-width: 480px) {
  .home_1 figure{ width: 100%;}
  .home_1 figure img{ max-width: 120px; margin: 0 auto 20px auto;}
  .home_1_text{ width: 100%;}
}

/* home_strengths */
.home_strengths li{ background-color: #E8FBFF; border-radius: 10px; border: 4px solid #fff;}
.home_strengths li figure{ padding: 6px 8% 10px 8%; background-color: #fff;}
.home_strengths li h3{ padding: 10px 10px 0 10px;}
.home_strengths li p{ padding: 10px; line-height: 1.5}
@media screen and (max-width: 500px) {
  .home_strengths li figure{ padding: 6px 0 10px 0;}
  .home_strengths li figure img{ max-width: 180px; margin: 0 auto;}
}

/* home_ */
.home_services li h3{ padding: 10px 10px 5px 10px; line-height: 1.4}
.home_services li p{ padding: 0 10px; line-height: 1.5}
@media screen and (max-width: 500px) {
  .home_services li h3{ padding: 10px 5px 3px 5px;}
  .home_services li p{ padding: 0 5px;}
}

/* home_casestudies */
.home_casestudies li{ list-style: none;}
.home_casestudies li a{ display: flex; justify-content: space-between; background-color: #fff; border-radius: 10px; overflow: hidden; filter: drop-shadow(0 2px 8px rgba(0,0,0,0.2)); margin-bottom: 40px; color: inherit; transition: all .6s;}
.home_casestudies li a:hover{ background-color: #EAF6FD;}
.home_casestudies li figure{ width: 40%; min-height: 280px;}
.home_casestudies li figure img{ object-fit: cover; width: 100%; height: 100%;}
.home_casestudies_text{ width: 60%; padding: 20px 30px;}
.home_casestudies_text h3{ display: inline-block; font-size: 22px; font-weight: 700; line-height: 1.4; padding: 10px 0 3px 0; color: #1C2D6A; border-bottom: 2px solid #6880D7;}
.home_casestudies_text p{ margin-top: 10px;}
@media screen and (max-width: 640px) {
  .home_casestudies li a{ border-radius: 8px; margin-bottom: 30px;}
  .home_casestudies li figure{ width: 30%; min-height:0px;}
  .home_casestudies_text{ width: 70%; padding: 15px 15px;}
  .home_casestudies_text h3{ font-size: 18px; padding: 5px 0 2px 0; color: #1C2D6A; border-bottom: 2px solid #6880D7;}
  .home_casestudies_text p{ margin-top: 10px;}
}

/* home_news */
.home_news li{ list-style: none; border-top: 1px solid #D9D9D9; padding: 2px 0;}
.home_news li:last-child{ border-bottom: 1px solid #D9D9D9;}
.home_news li a{ display: flex; justify-content: space-between; align-items: center; color: inherit; padding-left: 5px; background-color: #fff; transition: all .6s;}
.home_news li a:hover{ background-color: #EAF6FD;}
.home_news_date{ width: 100px; font-size: 13px; font-family: "Roboto", sans-serif; font-weight: 400; font-variation-settings: "wdth" 75;}
.home_news h3{ width: calc(100% - 220px); font-size: 16px; font-weight: 500; line-height: 1.4; color: #1C2D6A; padding: 10px 20px 10px 0;}
.home_news li figure{ width: 120px; aspect-ratio: 720 / 480;}
.home_news li figure img{ object-fit: cover; width: 100%; height: 100%;}
@media screen and (max-width: 500px) {
  .home_news li a{ align-items: flex-start;}
  .home_news_date{ width: 70px; font-size: 12px; padding: 5px 0;}
  .home_news h3{ width: calc(100% - 165px); font-size: 14px; padding: 5px 5px 5px 0;}
  .home_news li figure{ width: 95px; aspect-ratio: none; padding: 5px 0;}
}


/* =======================
    Conts
========================== */

.backmark1{ display: flex; align-items: center; min-height: 200px; background: url("../images/mark-lightgray1.png") center center no-repeat; background-size: max(230px); }
.backmark11{ display: flex; align-items: center; justify-content: center; flex-wrap: wrap; min-height: 200px; background: url("../images/mark-lightgray1.png") center center no-repeat; background-size: max(200px); }

.service_onestop_marks{ max-width: 500px; width: 90%; padding: 5px 10px; border: 1px solid #1C2D6A; border-radius: 50px; display: flex; justify-content: space-around; align-items: center; list-style: none;}
.service_onestop_marks > li{ width: 20%;  line-height: 1.4; font-size: 90%;}
.service_onestop_marks > li.service_onestop_marks3{ width: 70%;}

.service_onestop > li{ margin-top: 50px; display: flex; justify-content: space-between; flex-wrap: wrap;}
.service_onestop > li:nth-child(2n){ flex-direction: row-reverse}
.service_onestop > li figure{ width: 32%;}
.service_onestop_box{ width: 64%;}
.service_onestop_box h3{ font-size: 24px; line-height: 1.4; font-weight: 600;}
.service_onestop_box h3 span{ display: inline-block; padding-bottom: 3px; border-bottom: 3px solid #1C2D6A;}
.service_onestop_list{ background-color: #F3F3F3; padding: 10px 20px; border-radius: 10px; list-style: none;}
.service_onestop_list li{ position: relative; vertical-align: middle;}
.service_onestop_list li::before{ display:inline-block; vertical-align: middle; content:''; width:0.5em; height: 0.5em; background: #6880D7; border-radius: 50%; margin-right: 8px;}
@media screen and (max-width: 640px) {
  .service_onestop > li:nth-child(2n){ flex-direction: row}
  .service_onestop > li figure{ width: 100%; max-width: 400px;}
  .service_onestop_box{ width: 100%;}
  .service_onestop_box h3{ font-size: 20px; margin-top: 10px;}
  .service_onestop_box h3 span{ padding-bottom: 2px;}
  .service_onestop_list{ padding: 10px 15px; border-radius: 6px;}
}

.service_menu > li{ margin-top: 50px; display: flex; justify-content: space-between;}
.service_menu > li figure{ width: 100px;}
.service_menu_box{ width: calc(100% - 140px);}
.service_menu_box h3{ font-size: 24px; line-height: 50px; font-weight: 600; padding-left: 70px; background-color: #F3F3F3; color: #1C2D6A; position: relative;}
.service_menu_box h3 span{ position:absolute; display: block; width: 50px; height: 50px; font-size: 36px; line-height: 50px; left: 0; top: 0; font-family: "Roboto", sans-serif; font-weight: 600; font-variation-settings: "wdth" 75; font-style: oblique; text-align: center; background-color: #1C2D6A; color: #fff; margin-right: 20px;}
.service_menu_box h4{ font-size: 18px; font-weight: 600; margin-top: 10px;}
.service_menu_box h5{ font-size: 16px; font-weight: 600; margin-top: 10px;}
.service_menu_box p{ margin-left: 2em;}
.service_menu_box ul{ margin-left: 3em; list-style: disc;}
@media screen and (max-width: 820px) {
  .service_menu_box h3{ font-size: 20px; line-height: 40px; font-weight: 600; padding-left: 50px; background-color: #F3F3F3; color: #1C2D6A; position: relative;}
  .service_menu_box h3 span{ position:absolute; display: block; width: 40px; height: 40px; font-size: 28px; line-height: 40px;}
}
@media screen and (max-width: 640px) {
  .service_menu > li{ margin-top: 50px;}
  .service_menu > li figure{ width: 60px;}
  .service_menu_box{ width: calc(100% - 75px);}
  .service_menu_box h3{ font-size: 18px; line-height: 26px; min-height: 30px; padding-left: 40px;}
  .service_menu_box h3 span{ width: 30px; height: 30px; font-size: 20px; line-height: 30px;}
  .service_menu_box h4{ font-size: 16px; margin-top: 10px; line-height: 1.5;}
  .service_menu_box h5{ font-size: 14px; margin-top: 10px;}
  .service_menu_box p{ margin-left: 0; line-height: 1.5;}
  .service_menu_box ul{ margin-left: 1.5em; line-height: 1.5;}
}

.service_workflow{ width: fit-content; counter-reset:number; list-style-type: none!important; border-left: 10px solid #F3F3F3;}
.service_workflow li{ position: relative; padding: 0 0 20px 60px; list-style: none; }
.service_workflow li::before{ position: absolute; counter-increment: number; content: counter(number); display:inline-block; background: #1C2D6A; color: white; font-family: "Roboto", sans-serif; font-weight: 600; font-variation-settings: "wdth" 100; font-size: 16px; border-radius: 50%; left: 30px; top: 4px; width: 23px; height: 23px; line-height: 19px; padding-top: 2px; text-align: center; padding-left: 1px;}
.service_workflow li::after{ position: absolute; width: 40px; height: 1px; content: ""; background-color: #1C2D6A; top: 16px; left: -5px;}
.service_workflow li h3{ font-size: 16px;}
@media screen and (max-width: 640px) {
  .service_workflow li{ padding: 0 0 20px 50px; }
  .service_workflow li::before{ left: 22px;}
  .service_workflow li::after{ width: 28px;}
}

.service_area{ display: flex; flex-wrap: wrap;}
.service_area dt{ width: 150px; font-weight: 600;}
.service_area dd{ width: calc(100% - 150px); padding-left: 20px; padding-bottom: 1em;}
.service_area dd ul{ margin-left: 1.5em;}
@media screen and (max-width: 640px) {
  .service_area dt{ width: 80px; line-height: 1.5;}
  .service_area dd{ width: calc(100% - 80px); padding-left: 0px; line-height: 1.5;}
}


.strengths_4 > li{ display: flex; justify-content: space-between; flex-wrap: wrap; background-color: #F3F3F3; border-radius: 50px; padding: 3%; margin-top: var(--sp-m);}
.strengths_4_num{ width: 15%;}
.strengths_4_box{ width: 54%;}
.strengths_4_image{ width: 25%; /*display: flex; flex-direction: column; gap: 20px;*/}
.strengths_4_num span{ display: block; font-family: "Roboto", sans-serif; font-weight: 600; font-variation-settings: "wdth" 100; font-size: 100px; font-style: oblique; text-align: center; line-height: 1.0; color: #1C2D6A; transform: translateX(-0.1em);}
.strengths_4_image img{ display: block; border-radius: 10px; aspect-ratio: 640 / 360; object-fit: cover; object-position: center center; margin-top: 10px;}
.strengths_4_box h3{ font-size: 24px; font-weight: 700; color: #1C2D6A;}
.strengths_4_box h4{ font-size: 16px; font-weight: 600;}
.strengths_4_text2{ padding: var(--sp-s); background-color: #fff; border-radius: 10px;}
.strengths_4_box ul{ margin-left: 1.5em; list-style: disc;}
@media screen and (max-width: 900px) {
  .strengths_4 > li{ border-radius: 30px; padding: 30px 20px;}
  .strengths_4_num{ width: 20%;}
  .strengths_4_box{ width: 75%;}
  .strengths_4_image{ width: 100%; display: flex; flex-direction: row; justify-content: space-between;}
  .strengths_4_image img{ width: calc(50% - 5px);}
}
@media screen and (max-width: 640px) {
  .strengths_4 > li{ border-radius: 20px; padding: 20px 20px;}
  .strengths_4_num{ width: 100%; max-width: 120px; margin: 0 auto 0px auto; order: 1;}
  .strengths_4_box{ width: 100%; order: 3;}
  .strengths_4_image{ order: 2; margin-bottom: 10px;}
  .strengths_4_num span{ font-size: 50px;}
  .strengths_4_box h3{ font-size: 18px;}
}

.casestudies_list{ list-style: none;}
.casestudies_list li a{ display: flex; justify-content: space-between; flex-wrap: wrap; background-color: #fff; color: #000; border-radius: 10px; overflow: hidden; margin-top: var(--sp-ms); /*border: 1px solid #fff;*/ filter: drop-shadow(2px 2px 10px rgba(0, 0, 0, 0.2)); transition: all 0.6s;}
.casestudies_list li a:hover{ background-color: #E2ECF5;}
.casestudies_list li:first-child{ margin-top: var(--sp-m);}
.casestudies_list_image{ display: block; width: 35%; aspect-ratio: 4 / 3;}
.casestudies_list_image img{ width: 100%; height: 100%; object-fit: cover; object-position: center center;}
.casestudies_list_text{ width: 65%; padding: 20px; color: #000;}
.casestudies_list_text h3{ color: #1C2D6A;}
@media screen and (max-width: 640px) {
  .casestudies_list li a{ border-radius: 10px; filter: drop-shadow(2px 2px 10px rgba(0, 0, 0, 0.2)); transition: all 0.6s;}
  .casestudies_list li a:hover{ background-color: #E2ECF5;}
  .casestudies_list li:first-child{ margin-top: var(--sp-m);}
  .casestudies_list_image{ width: 100%; height: 50vw;}
  .casestudies_list_text{ width: 100%; padding: 15px;}
}

.casestudies_image{ display: block; aspect-ratio: 1920 / 1080; text-align: center; background-color: #F3F3F3;}
.casestudies_image img{ object-fit: contain; width: 100%; height: 100%;}
.casestudies_box1{ max-width: 800px;}
.casestudies_box2{ background-color: #F3F3F3; border-radius: 50px; padding: var(--sp-ms); display: flex; justify-content: space-between; flex-wrap: wrap; row-gap: var(--sp-ms); font-size: 90%;}
.casestudies_box2 figure{ width: 20%;}
.casestudies_box2_text{ width: 75%;}
.casestudies_box2_text ol, .casestudies_box2_text ul{ margin-left: 1.5em;}
@media screen and (max-width: 767px) {
  .casestudies_box2{ border-radius: 20px; padding: var(--sp-s); row-gap: var(--sp-s);}
}

.company_title{ font-size: 28px; text-align: center; filter: drop-shadow(1px 1px 2px rgba(0, 0, 0, 0.3));}
.company_title span{ color: #ff4800;}
.company_mvv{ display: flex; justify-content: center; flex-wrap: wrap; list-style: none; gap: 5%; }
.company_mvv li{ width: 30%; background-color: #F3F3F3; border-radius: 10px; overflow: hidden;}
.company_mvv h3{ background-color: #1C2D6A; text-align: center;color: #fff; font-size: 16px; line-height: 1.4; padding: 10px;}
.company_mvv h3 span{ font-family: "Roboto", sans-serif; font-weight: 600; font-variation-settings: "wdth" 100; font-size: 24px; display: block;}
.company_mvv p{ padding: 5% 6% 8% 6%; line-height: 1.6;}
@media screen and (max-width: 767px) {
  .company_mvv li{ width: 100%; border-radius: 6px;}
  .company_mvv li + li{ margin-top: 20px;}
  .company_mvv h3{ font-size: 14px; padding: 6px;}
  .company_mvv h3 span{ font-size: 20px; display: inline-block; margin-right: 0.5em;}
  .company_mvv p{ padding: 10px 5% 10px 5%;}
}

.table1 table{ border: none; width: 100%;}
.table1 tr{ border-top: 10px solid #fff;}
.table1 tr:first-child{ border-top: 0 solid #fff;}
.table1 th{ padding: 15px; background-color: #F3F3F3; font-weight: 600;}
.table1 td{ padding: 15px 0 15px 15px;}
.table1 td iframe[src*="maps"]{ width: 100%; height: 400px; border: 1px solid #F3F3F3; padding: 1px; vertical-align: bottom;}
.table1 ul{ margin-left: 1.5em;}
@media screen and (max-width: 480px) {
  .table1 tr{ border-top: 5px solid #fff;}
  .table1 th{ padding: 5px 10px;}
  .table1 td{ padding: 5px 0 5px 10px;}
  .gmap{ height: 300px;}
  .table1 td iframe[src*="maps"]{ padding: 0 0 5px 10px;}
}

.company_history{ width: fit-content; max-width: 90%; list-style-type: none!important; border-left: 10px solid #F3F3F3;}
.company_history li{ position: relative; padding: 0 0 20px 50px; list-style: none; display: flex; justify-content: flex-start;}
.company_history li::after{ position: absolute; width: 40px; height: 1px; content: ""; background-color: #1C2D6A; top: 15px; left: -5px;}
.company_history li h4{ font-size: 12px; line-height: 1.5; font-weight: 400; width: 100px; padding-top: 5px;}
.company_history li p{ width: calc(100% - 100px); line-height: 1.5; padding-top: 2px;}
@media screen and (max-width: 640px) {
  .company_history{ border-left: 6px solid #F3F3F3;}
  .company_history li{ padding: 0 0 10px 30px;}
  .company_history li::after{ width: 28px; top: 16px; left: -3px;}
  .company_history li h4{ width: 80px;}
  .company_history li p{ width: calc(100% - 80px);}
}



/* FAQリスト */

.faq_list_category{ font-size: 20px; font-weight: 600; margin: var(--sp-m) 0 var(--sp-s) 0;}
.faq_list > details{ border-bottom: 1px solid #F3F3F3;}
.faq_item { transition: all 0.6s;}
/*.faq_question:hover { background-color: #E2ECF5;}*/
.faq_question { cursor: pointer; color: #1C2D6A; list-style: none; position: relative; padding: 10px 50px 10px 50px; font-weight: 600;}
.faq_question::-webkit-details-marker { display: none;}
.faq_question::before { position: absolute; right: 20px; top: 8px; content: '↑'; transition: all 0.3s; color: #1C2D6A;}
.faq_list > details[open] > .faq_question { color: #1C2D6A; background-color: #F3F3F3;}
.faq_list > details[open] > .faq_question::before { transform: rotate(180deg);}
.faq_answer { padding: 5px 10px 10px 50px; color: #000;}
.faq_question::after{ position: absolute; left: 0; top: 7px; content: "Q"; font-family: "Roboto", sans-serif; font-weight: 600; font-variation-settings: "wdth" 100; font-size: 24px; line-height: 1.0;; background-color: #1C2D6A; color: #fff; padding: 5px 8px;}
.faq_list > details[open] > .faq_question::after{ background-color: #1C2D6A;}
@media screen and (max-width: 640px) {
  .faq_answer { padding: 5px 10px 10px 10px;}
}


.recruit_box h2{ padding-left: 50px; font-size: 150%; font-weight: 700; line-height: 1.4; position: relative; margin: 2em 0 1em 0;}
.recruit_box h2::before,.recruit_box h2::after{ position: absolute; content: ""; width: 6px; height: 1.5em;}
.recruit_box h2::before{ top: 0; left: 0; background-color: #1C2D6A;}
.recruit_box h2::after{ top: 6px; left: 6px; background-color: #A9A5A1;}
.recruit_box h3{ font-size: 120%; font-weight: 700; padding-bottom: 3px; border-bottom: 1px dashed #1C2D6A; margin: 1em 0 0.6em 50px;}
.recruit_box h4, .recruit_box h5, .recruit_box h6{ margin: 1em 0 0 50px;}
.recruit_box p{ margin: 1em 0 0 50px;}
.recruit_box table{ margin-left: 50px;}
.recruit_box th,.recruit_box td{ padding: 1em;}
.recruit_box th{ background-color: #F3F3F3; white-space: nowrap; font-weight: 600;}
.recruit_box tr{ border-top: 5px solid #fff;}
.recruit_box ol li, .recruit_box ul li{ margin-left: calc(50px + 2em);}
.recruit_box ol li{ padding-left: 0.5em;}
@media screen and (max-width: 640px) {
  .recruit_box h2{ padding-left: 30px; font-size: 150%; font-weight: 700; line-height: 1.4; position: relative; margin: 2em 0 1em 0;}
  .recruit_box h2::before,.recruit_box h2::after{ position: absolute; content: ""; width: 6px; height: 1.5em;}
  .recruit_box h2::before{ top: 0; left: 0; background-color: #1C2D6A;}
  .recruit_box h2::after{ top: 6px; left: 6px; background-color: #A9A5A1;}
  .recruit_box h3{ font-size: 120%; font-weight: 700; padding-bottom: 3px; border-bottom: 1px dashed #1C2D6A; margin: 1em 0 0.6em 30px;}
  .recruit_box h4, .recruit_box h5, .recruit_box h6{ margin: 1em 0 0 30px;}
  .recruit_box p{ margin: 1em 0 0 30px;}
  .recruit_box table{ margin-left: 30px;}
  .recruit_box th,.recruit_box td{ padding: 1em;}
  .recruit_box th{ background-color: #F3F3F3; white-space: nowrap; font-weight: 600;}
  .recruit_box tr{ border-top: 5px solid #fff;}
  .recruit_box ol li, .recruit_box ul li{ margin-left: calc(30px + 2em);}
  .recruit_box ol li{ padding-left: 0.5em;}
}





/* =======================
    docbox1
========================== */

.docbox1 p{ margin-top: 1em;}
.docbox1 p a:not(:has(img)){ border-bottom: 1px dotted #AAA; margin-bottom: -1px;}
.docbox1 h2{ font-size: 150%; font-weight: 700; line-height: 1.4; margin-top: 1em; border-left: 5px solid #1C2D6A; padding: 0.5em 0 0.5em 28px; color: #1C2D6A;}
.docbox1 h3{ font-size: 120%; font-weight: 700; line-height: 1.4; margin-top: 1em; border-top: 1px solid #1C2D6A; border-bottom: 1px solid #1C2D6A; padding: 0.3em 0; text-align: center; color: #1C2D6A;}
.docbox1 h4{ font-size: 115%; font-weight: 600; margin-top: 1em; border-left: 2px solid #1C2D6A; border-bottom: 1px solid #1C2D6A; padding: 0 0 5px 20px;}
.docbox1 h5{ font-size: 115%; font-weight: 700; line-height: 1.4; margin-top: 1em; border-bottom: 1px dashed #1C2D6A; padding: 0.3em 0;}
.docbox1 h6{ font-size: 105%; font-weight: 600; margin-top: 1.2em;}
.docbox1 h6::before{ content: "■"; margin-right: 0.6em;}
.docbox1 ul{ margin-top: 1em; list-style: disc; margin-left: 1.5em;}
.docbox1 ol{ margin-top: 1em; margin-left: 1.5em;}
.docbox1 ul li,.docbox1 ol li{ margin-top: 0.3em; position: relative;}
.docbox1 ol li{ padding-left: 5px;}
.docbox1 > table{margin-top: 1em;}
.docbox1 > table th,.docbox1 > table td{ border: 1px solid #000; padding: 0.5em 1em; text-align: left; vertical-align: top;}
.docbox1 > table th{ font-weight: 600; white-space: nowrap;}
.docbox1 > table th > p:first-child,.docbox1 > table td > p:first-child{ margin-top: 0;}
.docbox1 > *:first-child{ margin-top: 0;}
@media screen and (max-width: 767px) {
  .docbox1 p{ margin-top: 0.5em;}
  .docbox1 p a:not(:has(img)){ border-bottom: 1px dotted #AAA; margin-bottom: -1px;}
  .docbox1 h2{ font-size: 120%; padding: 0.5em 0 0.5em 18px;}
  .docbox1 h3{ font-size: 110%; margin-top: 1em; padding: 0.3em 0;}
  .docbox1 h4{ font-size: 110%; margin-top: 1em; padding: 0 0 5px 20px;}
  .docbox1 h5{ font-size: 110%; margin-top: 1em; padding: 0.3em 0;}
  .docbox1 h6{ font-size: 100%; margin-top: 1.2em;}
  .docbox1 h6::before{ margin-right: 0.6em;}
  .docbox1 ul{ margin-top: 1em;}
  .docbox1 ol{ margin-top: 1em;}
  .docbox1 ul li,.docbox1 ol li{ margin-top: 0.3em;}
  .docbox1 ol li{ padding-left: 5px;}
  .docbox1 > table{margin-top: 1em;}
  .docbox1 > table th,.docbox1 > table td{ padding: 0.5em 1em;}
}




/* =======================
    MovableType.net
========================== */

.mt-be-columns{ display: flex; justify-content: space-between; flex-wrap: wrap; margin: 0; padding: 0; column-gap: 0!important; }
.mt-be-column{ width: 50%; margin: 0 0 0 0; }
/*.mt-be-column p,.mt-be-column h2,.mt-be-column h3,.mt-be-column h4,.mt-be-column h5,.mt-be-column h6{ padding: 1px; margin-top: 1em;}*/
.mt-be-column p:has(img),.mt-be-column :has(img){ width: 100%; margin-top: 0; padding: 1px 1px 1px 1px;}
@media screen and (max-width: 480px) {
  .mt-be-column{ width: 100%;}
}