@charset "UTF-8";
/* CSS Document */

/*---------------------------------
* ユーティリティー
---------------------------------*/

html {
    font-size: 62.5%; /*16px×62.5%=10px*/
    scroll-behavior: smooth;
}

:target {
    scroll-margin-top: 130px;
}

body {
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 16px;
    font-weight: 400;
    font-style: normal;
    min-width: 1090px;
    color: #222222;
}

img {
    max-width: 100%;
    -webkit-backface-visibility: hidden;
}

a {
    color: #222222;
    text-decoration: none;
    transition: all .3s linear;
}

.wrapper {
    max-width: 1128px;
    margin: 0 auto;
}

.sp-display {
    display: none;
}

.pc-display {
    display: block;
}

.breadcrumb .wrapper ul li a img {
    vertical-align: sub;
}

/*---------------------------------
* ヘッダー
---------------------------------*/

header {
    position: fixed;
    top: 0;
    z-index: 100;
    left: 0;
    width: 100%;
}

.header_inner {
    display: flex;
    justify-content: space-between;
    background-color: #fff;
    list-style-type: none;
    padding-left: 50px;
    padding-right: 15px;
    border-bottom: 1px solid #D2D2D2;
}

.header_bl01_text {
    font-size: 12px;
    font-weight: 500;
    margin-bottom: 10.5px;
}

.header_bl01_img img {
    width: 325px;
    padding-left: 7px;
    margin: 4px 0;
}

.header_bl02 ul {
    display: flex;
    height: 100%;
}

.header_cont01 {
    font-size: 13px;
    font-weight: 500;
    display: flex;
    align-items: center;
    margin-right: 28px;
}

.header_cont01 a {
    font-size: 13px;
    margin-top: -2px;
}

.header_cont01 a:hover {
    text-decoration: underline;
}

.header_cont01::before {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    background: linear-gradient(to bottom left, transparent 50%, #0067B7 50%) top left / 100% 50% no-repeat, linear-gradient(to top left, transparent 50%, #0067B7 50%) bottom left / 100% 50% no-repeat;
    margin-right: 7.5px;
}

.header_cont02 {
    display: flex;
    align-items: center;
    margin-right: 24px;
}

.language-switcher {
    position: relative;
    margin-right: 20px;
}

.language-switcher .dropdown {
    display: none;
    position: absolute;
    background: white;
    list-style: none;
    border: 1px solid #ccc;
    padding: 0;
    width: 100px;
    height: 85px;
    z-index: 2;
}

.language-switcher.active .dropdown {
    display: block;
}

.language-switcher .dropdown li {
    padding: 5px 5px;
}

.language-switcher .dropdown li a {
    text-decoration: none;
    color: black;
    display: block;
    padding: 5px;
    font-size: 14px;
}

.language-switcher .dropdown li a:hover {
    color: #0067B7;
}

.language-switcher .dropdown.show {
    display: block;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
}

.language-toggle {
    display: flex;
    align-items: center;
    text-decoration: none;
    cursor: pointer;
    font-size: 14px;
}

.language-toggle img {
    margin-left: 15px;
    margin-right: 5px;
}

.search_box {
    width: auto;
    display: flex;
    align-items: center;
    border: 1px solid #0067B7;
    border-radius: 50px;
    position: relative;
}

.search_text {
    border: none;
    width: 120px;
    margin: 0 30px 0 10px;
    padding-bottom: 3px;
    height: 80%;
    min-height: 28px;
    font-size: 12px;
    outline: 0;
    transition: all .3s linear;
}

.search_text:focus {
    width: 250px;
    box-shadow: none !important;
}

.search_icon {
    width: 15px;
    height: 15px;
    position: absolute;
    right: 10px;
    margin-bottom: 2px;
}

.top_servive_search .search_box .search_icon{
    margin-bottom: 0px;
    right: 18px;
}

.fake-placeholder {
    position: absolute;
    left: 15px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    color: #ccc;
    font-size: 12px !important;
    transition: all 0.3s ease;
}

input:focus+.fake-placeholder {
    opacity: 0;
}

/*---------------------------------
* nav-menu
---------------------------------*/

.header_nav {
    height: 50px;
    background-color: #FFF;
    display: flex;
    position: relative;
    z-index: 1;
    top: -10px;
    border-bottom: 2px solid #0067B7;
}

.header_nav .wrapper {
    height: 100%;
}

.header_nav_inner {
    display: flex;
    width: 1135px;
    justify-content: space-around;
    margin: 0 auto;
    height: 100%;
}

.header_nav_inner>li {
    height: 100%;
    display: flex;
    align-items: center;
    position: relative;
    cursor: pointer;
    font-size: 18px;
}

.header_nav_inner>li>a:active::after {
    position: absolute;
    bottom: 0;
    left: 0;
    content: '';
    display: block;
    height: 4px;
    width: 100%;
    border-bottom: 1px solid #0067B7;
}

/* メニューテキスト修正 25/05/26 */
.menu-toggle,
.menu-text {
    font-size: 16px !important;
}

.menu-toggle img {
    margin-left: 8px;
    margin-bottom: 3px;
}

.menu-toggle:hover {
    color: #222222;
}

.arrow {
    display: inline-block;
    transition: transform 0.3s ease;
}

.arrow.rotate {
    transform: rotate(180deg);
}

.language-switcher .dropdown {
    display: none;
    position: absolute;
    background: white;
    list-style: none;
    border: 1px solid #ccc;
    padding: 0;
    width: 100px;
    height: 85px;
    z-index: 2;
}

.language-switcher.active .dropdown {
    display: block;
}

.dropdown_menu {
    display: none;
    position: absolute;
    top: 100%;
    width: 100vw; /* 全角 */
    background: #e8f4ff;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    padding: 20px;
    z-index: 1000;
}

.dropdown_menu.show {
    display: block;
}

#menuSp {
    display: none;
    position: fixed;
    left: 0;
    background-color: #E8EEF7;
    width: 100%;
    height: calc(100vh - 60px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    z-index: 1000;
    overflow-y: auto;
}

#menuSp.show {
    display: block;
}

#menuSp ul {
    padding: 20px 40px;
}

#menuSp ul li {
    padding: 15px 0px;
    border-bottom: 1px solid #cccccc;
}

#menuSp ul li a {
    color: #222222;
    font-size: 16px;
    transition: color 0.3s ease;
}

.rightArrow::before {
    background-image: url('../image/common/rightArrow.png');
}

.rightArrow::before {
    content: '';
    display: inline-block;
    width: 9px;
    height: 15px;
}

.rightArrow {
    float: right;
    margin-left: 10px;
    transition: transform 0.3s ease;
}

/* ボタンスタイル */
/* バーガーアイコンスタイル */
.burger-icon {
    width: 24px;
    height: 18px;
    position: relative;
    cursor: pointer;
}

.burger-icon::before,
.burger-icon::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 2px;
    background-color: #000;
    transition: transform 0.3s ease;
}

.burger-icon::before {
    top: 0;
}

.burger-icon::after {
    bottom: 0;
}

#closeIcon {
    display: none;
    width: 18px !important;
}

#header_sp_menu img {
    height: 22px;
    vertical-align: middle;
}

.lang-buttons {
    position: relative;
    bottom: 0;
    width: 100%;
    padding: 20px;
    display: flex;
    flex-direction: row;
    column-gap: 10px;
    text-align: center; /*menu btn text center fixed in date_20251110*/
}

.lang-button {
    padding: 12px 20px;
    background-color: #E8EEF7;
    border: 1px solid #0067B7;
    color: #0067B7;
    width: 100%;
    font-size: 16px;
    transition: background-color 0.3s ease;
    flex: 1;
}

.lang-button:hover {
    background-color: #0067B7;
    border: 1px solid #0067B7;
    color: #ffffff;
}

/* サブメニュースタイル */
.submenu {
    display: none;
    padding-left: 20px;
}

.submenu li {
    padding-bottom: 0px !important;
    border-bottom: none !important;
}

.submenu li a {
    color: #222222;
    display: flex;
    align-items: center;
    padding: 10px 15px;
}

.submenu.active {
    display: block;
    padding: 5px !important;
}

.menu-switcher.active .dropdown_menu {
    display: block;
}

.underline {
    display: none;
    height: 3px;
    background-color: #0067B7;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    transition: all 0.3s ease;
}

.current-menu-item .underline,
.underline.active {
    display: block;
}

.up-arrow {
    display: none;
    width: 12px;
    height: 12px;
    position: absolute;
    bottom: -2px;
    left: 50%;
    transform: translateX(-50%);
    transition: all 0.3s ease;
}

.up-arrow.active {
    display: inline-block;
}

.dropdown_menu.dropdown_menu_5cal .wrapper {
    max-width: calc(100% - 18.8%);
}

.dd_nav01,
.dd_nav02 {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;

    list-style-type: none;
    padding: 0;
    column-gap: 60px;
}

.dd_nav02 {
    justify-content: initial;
    margin-top: 26px;
}

.dd_nav01 a {
    display: flex;
    width: 195px;
    height: 68px;
    color: #222222;
    align-items: center;
    border-bottom: 1px solid #B2B2B2;
    box-sizing: border-box;
    line-height: 2;
    padding-bottom: 10px;
    font-size: 15px;
}

.dd_nav01.dd_nav01_5col a {
    width: 207px;
    height: 41px;
}

.dd_nav01 li {
    margin: 5px 10px;

    padding-left: 20px;
    position: relative;
}

.dd_nav01 a:hover {
    color: #0067B7;
}

.icon-app::before,
.icon-network::before,
.icon-mobile::before,
.icon-web::before,
.icon-system::before,
.icon-bto::before,
.icon-labo::before,
.icon-bulk::before,
.icon-dispatch::before,
.icon-career::before,
.icon-edu::before,
.icon-award::before,
.icon-qualify::before,
.icon-about::before,
.icon-number::before,
.icon-msg::before,
.icon-gallery::before,
.icon-service::before,
.icon-solution::before,
.icon-hr::before,
.icon-mdcrNo::before,
.icon-contact::before,
.icon-recruit::before,
.icon-news::before {
    content: '';
    display: inline-block;
    width: 21px;
    height: 21px;
    background-size: cover;
    position: absolute;
    transform: translateY(-50%);
}

.icon-mobile::before {
    width: 17px;
    height: 27px;
}

.icon-app,
.icon-network,
.icon-mobile,
.icon-web,
.icon-system,
.icon-bto,
.icon-labo,
.icon-bulk,
.icon-dispatch,
.icon-career,
.icon-edu,
.icon-award,
.icon-qualify,
.icon-about,
.icon-number,
.icon-msg,
.icon-gallery,
.icon-service,
.icon-solution,
.icon-hr,
.icon-mdcrNo,
.icon-contact,
.icon-recruit,
.icon-news {
    padding-right: 30px;
    display: inline-block;
    transition: filter 0.3s ease;
}

/* ホバー時にアイコンを青に変更 */
.menu-item:hover .icon-app,
.menu-item:hover .icon-network,
.menu-item:hover .icon-mobile,
.menu-item:hover .icon-web,
.menu-item:hover .icon-system,
.menu-item:hover .icon-bto,
.menu-item:hover .icon-labo,
.menu-item:hover .icon-bulk,
.menu-item:hover .icon-dispatch,
.menu-item:hover .icon-career,
.menu-item:hover .icon-edu,
.menu-item:hover .icon-award,
.menu-item:hover .icon-qualify,
.menu-item:hover .icon-about,
.menu-item:hover .icon-number,
.menu-item:hover .icon-msg,
.menu-item:hover .icon-gallery {
    /* 青色効果 */
    filter: brightness(0) saturate(100%) invert(25%) sepia(90%) saturate(2000%) hue-rotate(190deg) brightness(90%) contrast(90%);
}

.submenu li a span {
    display: flex;
    vertical-align: -webkit-baseline-middle;
}

.submenu li a .icon-app,
.submenu li a .icon-mobile,
.submenu li a .icon-web,
.submenu li a .icon-system,
.submenu li a .icon-network,
.submenu li a .icon-bto {
    width: 20px;
    display: inline-block;
    background-size: contain;
    background-repeat: no-repeat;
}

/* サービスアイコン */
.icon-app::before {
    background-image: url('../image/common/appIcon.png');
}

.icon-network::before {
    background-image: url('../image/common/networkIcon.png');
}

.icon-mobile::before {
    background-image: url('../image/common/mobileIcon.png');
}

.icon-web::before {
    background-image: url('../image/common/webIcon.png');
}

.icon-system::before {
    background-image: url('../image/common/systemIcon.png');
}

.icon-bto::before {
    background-image: url('../image/common/btoIcon.png');
}

.icon-labo::before {
    background-image: url('../image/common/laboIcon.png');
}

.icon-bulk::before {
    background-image: url('../image/common/comprehensiveIcon.png');
}

.icon-dispatch::before {
    background-image: url('../image/common/bulkIcon.png');
}

.icon-career::before {
    background-image: url('../image/common/careerIcon.png');
}

.icon-edu::before {
    background-image: url('../image/common/eduIcon.png');
}

.icon-award::before {
    background-image: url('../image/common/awardIcon.png');
}

.icon-qualify::before {
    background-image: url('../image/common/qualifyIcon.png');
}

.icon-about::before {
    background-image: url('../image/common/aboutIcon.png');
}

.icon-number::before {
    background-image: url('../image/common/numberIcon.png');
}

.icon-msg::before {
    background-image: url('../image/common/msgIcon.png');
}

.icon-gallery::before {
    background-image: url('../image/common/galleryIcon.png');
}

.icon-service::before {
    background-image: url('../image/common/serviceIcon.png');
}

.icon-solution::before {
    background-image: url('../image/common/solutionIcon.png');
}

.icon-hr::before {
    background-image: url('../image/common/hrIcon.png');
}

.icon-mdcrNo::before {
    background-image: url('../image/common/mdcrNoIcon.png');
}

.icon-contact::before {
    background-image: url('../image/common/contactIcon.png');
}

.icon-recruit::before {
    background-image: url('../image/common/recruitIcon.png');
}

.icon-news::before {
    background-image: url('../image/common/newIcon.png');
}

.dd_nav02 li {
    margin-right: 70px;
}

.dd_nav02 li:nth-of-type(5n) {
    width: 132px;
}

.dd_nav02 li:nth-of-type(n+6) {
    margin-top: 15px;
}

.dd_nav02 a {
    color: #fff;
    display: flex;
    align-items: center;
}

.dd_nav02 a::before {
    content: '';
    display: inline-block;
    width: 5px;
    height: 5px;
    background-color: #0067B7;
    margin-right: 12px;
}

.dd_nav02 a:hover {
    color: #0067B7;
}

.dd_nav03 {
    display: flex;
    margin-top: 30px;
}

.dd_nav03 a {
    display: flex;
    width: 193px;
    height: 41.5px;
    border: 1px solid #fff;
    color: #fff;
    margin-right: 40px;
    align-items: center;
    justify-content: center;
}

.dd_nav03 a:hover {
    background-color: #0067B7;
    border: 1px solid #0067B7;
}

.dropdown_menu_os .dd_nav02 {
    margin-top: 30px;
}

.service_dtl_wrapper .title03 h2 {
    font-size: 24px;
}

.service_dtl_wrapper .page_sec01_catch {
    margin-top: 20px;
    line-height: 1.61;
}

.service_dtl08_bl03 {
    margin-top: 60px;
}

.service_dtl08_ttl01 {
    font-size: 22px;
    font-weight: 700;
    letter-spacing: 0.05em;
    border-bottom: 1px solid #222222;
    padding-bottom: 17px;
    position: relative;
    margin-top: 60px;
}

.service_dtl08_bl02 {
    margin-top: 80px;
}

.top_servive_search {
    display: flex;
    justify-content: center;
}

.top_servive_search .search_box {
    background-color: #fff;
    border: 1px solid #A7A7A7;
    width: 674px;
    height: 67px;
}

.top_servive_search .search_text {
    width: 584px;
    margin-left: 35.8px;
    font-size: 20px;
}

.top_servive_search .search_text::placeholder {
    font-size: 20px;
}

.top_servive_search .search_icon {
    width: 21.8px;
    height: 21.8px;
}

.homeBtnWrap {
    margin-bottom: 60px;
}

.searchH101 {
    font-size: 30px;
    line-height: 1.8em;
    font-weight: bold;
    color: #FFFFFF;
}

.searchList ul li:not(:last-child) {
    margin: 0 0 20px;
}

.searchList .searchListText {
    flex: 1;
    padding: 1px 0 0 22px;
}

.searchBtn {
    text-align: center;
}

.columBtn02 {
    width: 394px !important;
    height: 64px !important;
}

/* ページ番号 */
.searchPagerWrap {
    margin-top: 60px;
    text-align: center;
}

.searchPager {
    margin: auto;
}

.searchPager li {
    display: inline-block;
    padding: 0px 4px;
}

.searchPager li span {
    box-sizing: border-box;
    background-color: #FFF;
    border: 1px solid #D6D6D6;
    border-radius: 2px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 46px;
    font-size: 16px;
    line-height: 1.5em;
    font-weight: 500;
}

.searchPager li a {
    box-sizing: border-box;
    background-color: #F9F9F9;
    border: 1px solid #D6D6D6;
    border-radius: 2px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 46px;
    font-size: 16px;
    line-height: 1.5em;
    font-weight: 500;
}

/*---------------------------------
* フッターのお問合せ先
---------------------------------*/

.footer_contact {
    border-top: 1.8px solid #0067B7;
}

.footer_contact_inner {
    padding: 50px 38px 20px;
}

.footer_contact_bl01 a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 495px;
    height: 129px;
    background-color: #0067B7;
    color: #fff;
    font-size: 30px;
    font-weight: 700;
    letter-spacing: 0.05em;
    margin: 0 auto;
    border: 1px solid #0067B7;
}

.footer_contact_bl01 a:hover {
    background-color: #fff;
    color: #0067B7;
}

.footer_contact_bl02 {
    margin-top: 37.5px;
    display: flex;
    justify-content: space-evenly;
    padding-left: 0px !important;
    align-items: center;
}

.footer_contact_dpmt {
    font-size: 30px;
    font-weight: 700;
    text-align: center;
    margin-bottom: 12px;
}

.footer_contact_nbr {
    margin-bottom: 8.5px;
    text-align: center;
}

.footer_contact_nbr span {
    font-size: 30px;
    font-weight: 700;
    letter-spacing: 0.05em;
    font-family: 'Inria Sans', sans-serif;
    pointer-events: none;
}

.footer_contact_nbr span::before {
    content: '';
    display: inline-block;
    width: 27.37px;
    height: 27.37px;
    background-image: url(../image/common/ph.png);
    background-size: cover;
    margin-right: 11.6px;
}

.footer_contact_hour {
    font-size: 17px;
    text-align: center;
}

/*---------------------------------
* 上へスクロール
---------------------------------*/

#scrollToTop {
    position: fixed;
    bottom: 20px;
    right: 20px;
    width: 50px;
    height: 50px;
    background-size: 60% !important;
    background: #3399ff url(../image/common/scrollTop.png) no-repeat center center;
    color: #ffffff;
    text-align: center;
    line-height: 50px;
    font-size: 20px;
    border-radius: 50%;
    cursor: pointer;
    display: none;
    z-index: 9999;
    opacity: 0.7;
    transition: all 0.3s ease;
}

#scrollToTop:hover {
    opacity: 1;
    background: #0080ff url(../image/common/scrollTop.png) no-repeat center center;
}

/*---------------------------------
* フッター
---------------------------------*/

footer {
    background-color: #f4f4f4;
    padding: 10px 0 0px;
    font-size: 14px;
}

footer .wrapper {
    max-width: 1280px !important;
    margin: 0 auto;
    padding: 0 35px;
}

.footer_inner {
    display: flex;
    flex-wrap: wrap;
    gap: 43px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.footer_address_col {
    flex: 0 0 280px;
}

.footer_logo {
    width: 317px;
}

.footer_logo img {
    max-width: 180px;
    width: 165px;
    height: auto;
    margin-bottom: 20px;
}

.footer_copy {
    font-size: 12px;
    font-weight: 500;
}

.footer_menu_col {
    margin-top: 95px;
    flex: 1;
}

.footer_menu_wrapper {
    display: flex;
    gap: 30px;
    justify-content: space-between;
    flex-direction: row;
}

.footer_links_container {
    display: flex;
    flex-wrap: wrap;
    gap: 32px;
    flex: 1;
}

.footer_address {
    list-style: none;
    padding: 0;
}

.footer_address li {
    font-size: 16px;
    color: #161616;
}

.footer_address strong {
    display: block;
    font-weight: 600;
    margin-bottom: 5px;
}

.footer_address span {
    line-height: 1.6;
    font-size: 14px;
}

.footer_menu_group {
    list-style: none;
    padding: 0;
    margin: 0;
    min-width: 140px;
}

.footer_menu_group li {
    margin-bottom: 15px;
}

.footer_menu_group a {
    position: relative;
    display: inline-block;
}

.footer_menu_group a::after {
    content: '';
    position: absolute;
    width: 0;
    height: 1px;
    bottom: -2px;
    left: 0;
    background-color: #222222;
    transition: width 0.3s ease;
}

.footer_menu_group a:hover::after {
    width: 100%;
}

/* ソーシャルメディアアイコン */
.social_icons {
    display: flex;
    flex-direction: column;
    gap: 30px;
    list-style: none;
    padding: 0;
    margin: 0;
    align-self: flex-start;
}

.social_icons ul li {
    margin-bottom: 30px;
}

.social_icons ul li img {
    transition: transform 0.3s ease;
    width: 26px;
    height: 26px;
}

.social_icons ul li .facebook {
    transition: transform 0.3s ease;
    width: 28px;
    height: 28px;
}

.social_icons ul li:hover img {
    transform: scale(1.27);
    transition: all 0.3s ease;
}

.social_icons ul li .facebook:hover {
    opacity: 0.8;
    filter: brightness(0) saturate(100%) invert(25%) sepia(90%) saturate(2000%) hue-rotate(190deg) brightness(90%) contrast(90%);
}

.social_icons ul li .linkedin:hover {
    opacity: 0.8;
    filter: invert(26%) sepia(78%) saturate(1936%) hue-rotate(176deg) brightness(94%) contrast(96%);
}

.social_icons ul li .xApp:hover {
    filter: invert(100%) brightness(0%);
}

.social_icons ul li .mail:hover {
    opacity: 0.8;
    filter: invert(15%) sepia(100%) saturate(7222%) hue-rotate(336deg) brightness(95%) contrast(107%);
}

.copyright {
    font-size: 13px;
    color: #222222;
    text-align: center;
    padding: 10px 0 0;
}

@media (max-width: 1024px) {

    .footer_address {
        gap: 200px !important;
    }
}

@media screen and (max-width: 1133px) {

    /*---------------------------------
    * ユーティリティー
    ---------------------------------*/

    body {
        min-width: initial;
        /* 初期値 */
        min-width: 100%;
    }
    
    :target {
        scroll-margin-top: 80px;
    }

    .wrapper,
    .wrapper02 {
        width: calc(100% - 40px);
        margin: 0 auto;
    }

    .sp-display {
        display: block;
    }

    .pc-display {
        display: none;
    }

    .sp-inlineBlock {
        display: inline-block;
    }

    .lang-buttons .active {
        background-color: #0067B7;
        color: #ffffff;
    }

    /*---------------------------------
    * 一般
    ---------------------------------*/

    .sec_bl {
        padding: 50px 0 60px;
    }

    .title01 h2 {
        font-size: 42px;
    }

    .sub_title01 {
        font-size: 16px;
    }

    .title03 h1 {
        font-size: 20px;
    }

    .title03 h1 span {
        font-size: 20px;
    }

    .more_btn01 a {
        min-width: initial;
        display: block;
        height: auto;
        line-height: 1.5;
        padding: 20px 40px 20px 20px;
    }

    .page_wrapper {
        margin: 40px 0 0;
    }

    .service_dtl_wrapper .title03 h2 {
        font-size: 20px;
        line-height: 1.5;
    }

    .service_dtl_wrapper .page_sec01_catch {
        font-size: 20px;
    }

    .service_dtl08_bl02 {
        margin-top: 40px;
    }

    .service_dtl08_bl03 {
        margin-top: 40px;
    }

    .service_dtl08_ttl01 {
        font-size: 20px;
        line-height: 1.8;
        margin-top: 40px;
    }

    .top_servive_search form {
        width: 100%;
    }

    .top_servive_search .search_box {
        width: 100%;
        height: 55px;
    }

    .top_servive_search .search_text {
        width: 75%;
    }

    .top_servive_search form {
        width: 100%;
    }

    /*---------------------------------
    * 
    * ヘッダー
    * 
    ---------------------------------*/

    .header_sp {
        background-color: #fff;
        padding: 15px 20px 15px 0px;
        height: 80px;
    }

    .header_sp_menu {
        margin: 8px 0;
    }

    .header_sp_menu img {
        width: 22px;
    }

    .header_sp ul {
        display: flex;
        justify-content: space-between;
    }

    .header_logo a img {
        width: 270px;
        margin-top: -4px;
        margin-left: -10px;
    }

    .top_mv {
        margin-top: 0;
        padding-top: 52px;
        width: 100%;
        height: auto;
        background-size: cover;
        background-position: right 22% bottom -23px;
    }

    .top_mv_catchText02 {
        font-size: 14px;
        line-height: 1.6;
        bottom: 5%;
    }

    .top_topics_inner {
        flex-direction: column;
    }

    .footer_contact_inner {
        padding: 30px 20px 35px;
    }

    .footer_contact_bl02 {
        flex-direction: row;
    }

    .footer_contact_bl02 li {
        margin-bottom: 30px;
    }

    /* フッター */
    .footer_logo img {
        width: 115px;
    }

    .footer_menu_group {
        min-width: 120px;
    }
}

/* レスポンシブな調整 */
@media screen and (max-width: 768px) {

    .detailH101 {
        font-size: 25px;
        line-height: 1.8em;
        font-weight: bold;
        color: #FFFFFF;
    }

    .dropdown_menu {
        width: 100%;
        left: 0 !important;
    }

    .columBtn02 {
        width: 100% !important;
        height: 50px !important;
    }

    footer .wrapper {
        padding: 0px !important;
    }

    .footer_contact_nbr a {
        letter-spacing: 0 !important;
    }

    .footer_contact_bl01 a {
        width: 100% !important;
        height: 100px !important;
        font-size: 20px !important;
    }

    .footer_contact_bl02 {
        flex-direction: column;
    }

    .footer_inner {
        flex-direction: column;
        gap: 30px;
    }

    .footer_menu_wrapper {
        display: flex;
        flex-wrap: wrap;
        gap: 20px;
    }

    .footer_address_col {
        flex: 1;
    }

    .footer_links_container {
        display: block !important;
    }

    .footer_menu_group {
        margin-bottom: 20px;
    }

    .social_icons {
        justify-content: center;
        text-align: center;
    }
}

@media (min-width: 768px) and (max-width: 1024px) {
    .dropdown_menu {
        width: 50%;
    }

    .footer_inner {
        flex-direction: column;
        gap: 0px !important;
    }

    .footer_links_container {
        display: flex;
        flex-wrap: wrap;
        row-gap: 0px !important;
        column-gap: 130px !important;
    }

    .footer_menu_group {
        flex: 1 1 calc(33.33% - 20px);
        min-width: 0;
    }

    .footer_menu_group:last-child {
        order: 1;
    }

    .footer_address {
        display: flex;
        gap: 105px;
    }
}

@media (max-width: 480px) {

    .footer_inner>li {
        flex: 1 1 100%; /* 各セクションの全幅 */
    }

    .footer_menu_col ul {
        flex: 1 1 100%; /* 各リストの全幅 */
    }
}

@media screen and (max-width: 430px) {
    .service_dtl08_ttl01 {
        margin-top: 100px !important;
    }

    .searchH101 {
        display: block !important;
    }
}

@media (min-width: 320px) and (max-width: 1024px) {

    /* 25/05/12修正 */
    .icon-app,
    .icon-network,
    .icon-mobile,
    .icon-web,
    .icon-system,
    .icon-bto,
    .icon-labo,
    .icon-bulk,
    .icon-dispatch,
    .icon-career,
    .icon-edu,
    .icon-award,
    .icon-qualify,
    .icon-about,
    .icon-number,
    .icon-msg,
    .icon-gallery,
    .icon-service,
    .icon-solution,
    .icon-hr,
    .icon-mdcrNo,
    .icon-contact,
    .icon-recruit,
    .icon-news {
        padding-top: 10px;
    }

    .icon-app::before,
    .icon-network::before,
    .icon-mobile::before,
    .icon-web::before,
    .icon-system::before,
    .icon-bto::before,
    .icon-labo::before,
    .icon-bulk::before,
    .icon-dispatch::before,
    .icon-career::before,
    .icon-edu::before,
    .icon-award::before,
    .icon-qualify::before,
    .icon-about::before,
    .icon-number::before,
    .icon-msg::before,
    .icon-gallery::before,
    .icon-service::before,
    .icon-solution::before,
    .icon-hr::before,
    .icon-mdcrNo::before,
    .icon-contact::before,
    .icon-recruit::before,
    .icon-news::before {
        transform: translateY(-75%);
    }
}

/* タブレットレイアウト */
@media screen and (max-width: 1024px) {
    .footer_address_col {
        flex: 0 0 240px;
    }

    .social_icons {
        flex-direction: row;
        margin-top: 10px;
    }

    .footer_menu_col {
        flex-direction: column;
        align-items: center;
        margin-top: 15px;
    }
}

@media screen and (max-width: 853px) {
    .footer_address {
        gap: 105px !important;
    }
}

@media screen and (max-width: 768px) {
    .footer_menu_col {
        margin-top: 0px;
    }
}

@media screen and (max-width: 380px) {
    .lang-button {
        padding: 10px !important;
        text-align: center;
    }

    .footer_contact_bl02 li {
        width: 270px;
    }
}

@media screen and (max-width: 338px) {
    .footer_menu_wrapper {
        flex-direction: column;
        gap: 20px;
    }

    /* フッター */
    .footer_logo {
        width: 300px;
    }

    .footer_contact_dpmt,
    .footer_contact_nbr a {
        font-size: 25px;
    }

    .footer_contact_hour {
        font-size: 14px;
    }
}

/* スクロールを無効にする */
body.no-scroll {
    overflow: hidden; /* スクロールを禁止する */
}