@charset "UTF-8";
/* =========================================================
   Child Responsive 
========================================================= */
@media only screen and (max-width: 1200px) {
  .header-bar {
    height: 55px;
    background: none;
    border: none;
    box-shadow: none;
  }
  .logo-image {
    height: 55px;
    width: 170px;
    left: 20px;
  }
    .header-bar-fixed .global-nav {
        background: #ffffff;
    }
  .global-nav-button {
    border: none;
    background-color: #FFE700;
    line-height: 55px;
    height: 55px;
    width: 55px;
  }
  .global-nav-button::before {
    color: var(--color-text);
  }
  .global-nav > ul > li > a {
    height: 50px;
    margin: 0 auto !important;
    line-height: 50px !important;
    border-top: 1px solid var(--color-gray);
    font-size: 1em;
  }
  .global-nav > ul > li.header__nav-item--home > a {
    display: block;
    border: none;
  }
  .global-nav, .header-bar-fixed .global-nav {
    top: 55px;
    max-width: 100%;
    right: 0;
    padding: 0;
  }
  .global-nav a {
    color: var(--color-text) !important;
  }
  .global-nav > ul > li.header__nav-item--other > a::after {
    display: none;
  }
  .global-nav > ul > li.header__nav-item--contact > a {
    border: none;
  }
  .global-nav .menu-item-has-children > a span::before {
    color: var(--color-text);
  }
  .global-nav > ul > li > a:before {
    display: none;
  }
  .global-nav > ul > li.header__nav-item--contact > a::after {
    position: relative;
    width: auto;
    display: inline-block;
    bottom: 0;
    margin-left: 1em;
  }
  .global-nav > ul > li:hover {
   background:#ffffff;
  }	
  .global-nav .sub-menu a {
    width: 100%;
    font-size: 1em;
  }
  .global-nav .sub-menu {
    left: 0;
  }
  .content02-inner {
    padding: 0;
    width: 84%;
  }
  .inner {
    width: 84%;
  }
  .signage {
    height: auto;
    margin-top: 0 !important;
    padding-top: 7em;
  }
}
@media only screen and (max-width: 1024px) {
    .top-slider-flex {
        padding: 55px 0 55px;
    }
}
@media only screen and (max-width: 991px) {
.front-main-box-inner h2 {
    font-size: 2.5vw;
}	
  .top-slider, .header-youtube {
    height: auto;
  }
  .breadcrumb-wrapper .inner, .main > .inner, .footer .inner {
    width: 84%;
    padding: 0;
  }
.top-news.flex-inner {
    width: 70%;
}	
  .content_inner {
    padding: 6em 0 7em !important;
  }
  .career-inner {
    padding: 5em 20px 7em !important;
  }
  .item-career {
    width: calc((100% - 40px) / 3);
    /* 4 columns, 20px gutter */
    margin-bottom: 20px;
  }
}

@media only screen and (max-width: 768px) {
  .front-features__item {
    width: 100%;
    margin: 0 auto 2em;
    font-size: 1em;
  }
  .front-features__item:last-of-type {
    margin-bottom: 0;
  }
  .content02-inner {
    font-size: 1em;
  }
  .content02-button {
    position: relative;
    bottom: 0;
    width: 100%;
    margin-top: 1em;
  }
  .content02::before {
    height: 70px;
  }
  /* front-third */
  .front-split {
    padding: 4em 0 0;
  }
  .front-split__item {
    width: 100%;
    margin-bottom: 20px;
  }
  .front-split__text-box {
    width: 84%;
    margin: 0 auto !important;
    padding: 0 !important;
  }
  .front-split__text-inner {
    max-width: unset;
  }
  .front-split__image-box {
    width: 100%;
    margin: 2.5em auto 0 0 !important;
  }
  .front-split__item:nth-of-type(even) .front-split__image-box {
    margin: 2.5em 0 0 auto !important;
  }
.front-split .btn--type01 {
    justify-content: center;
}
.front-split .btn--type01 a {
    text-align: center;
    padding-left: 0px;
}	
.top-blog {
    width: 100%;
}	
.top-blog .article03 {
    width: calc((100% / 3) - 0.5em) !important;
}	
  /* セクション余白 */
  .content02 {
    padding: 4em 0 4em;
  }
    .front-topics {
        padding: 0 0 4em;
    }
  .front-topics::before {
    height: 140px;
  }
  section.footer__contact {
    padding: 7em 0 0;
  }
  .footer__contact--inner.inner {
    flex-direction: column;
    align-items: stretch;
    gap: 0;
  }
  .footer__contact--inner.inner h2, .footer__contact--inner.inner .footer__contact-btns {
    max-width: none;
    text-align: center;
  }
  .footer__contact--inner.inner .footer__contact-frog {
    max-width: 8em;
    margin: 1.5em auto;
  }
  /* ファーストビュー下2カラム */
  .front-hero__text-box {
    width: 100%;
    margin: 0 auto 2em;
  }
  .front-hero__image-box {
    height: auto;
    max-height: unset;
    writing-mode: horizontal-tb;
    -webkit-writing-mode: horizontal-tb;
    -ms-writing-mode: horizontal-tb;
    max-width: unset;
    width: 100%;
  }
  footer {
    padding: 7em 0 12em;
    font-size: 0.9em;
  }
  .post-content a[href^='tel:'] {
    color: var(--color-text);
  }
    .top-slider-content-inner {
        padding: 9em 0 7em;
		justify-content: end;
    }
  .front-hero__image-box p {
    margin: 0 auto 1em;
  }
  .service-item__body {
    flex-direction: column;
  }
  .service-item__image, .service-item__table {
    width: 100%;
  }
  .greeting__inner {
    flex-direction: column;
  }
  .greeting__img, .greeting__profile {
    width: 100%;
  }
  .greeting__body {
    margin-top: 3em;
  }
  .flow-box__body {
    flex-direction: column;
  }
  .flow-box__image {
    width: 100%;
  }
}
@media only screen and (max-width: 768px) {
    .greeting-sec {
        padding: 4em 0 0;
    }
    .part01 .greeting-sec__text-box,
	.part02 .greeting-sec__text-box,
	.part04 .greeting-sec__text-box{
        width: 100%;
        margin: 0 auto !important;
        padding: 0 !important;
    }
	.part03 .greeting-sec__text-box{
        width: 94%;
        margin: 0 0 0 10% !important;
        padding: 0 !important;
    }
    .part01 .greeting-sec__image-box,
	.part02 .greeting-sec__image-box,
	.part03 .greeting-sec__image-box,
	.part04 .greeting-sec__image-box{
        width: 100%;
        margin: 2.5em auto 0 0 !important;
    }
    .greeting-sec__text-inner {
        max-width: unset;
		margin: 2.5em auto 0 0 !important;
    }
	.part02 .greeting-sec__image-box img,
	.part03 .greeting-sec__image-box img,
	.part04 .greeting-sec__image-box img{
	aspect-ratio: 3 / 2;
    object-fit: cover;		
	}
}
@media only screen and (max-width: 767px) {
    .greeting-sec {
         padding: 2em 0 4em;
    }
	.post-content h2.greeting__title{
        font-size: 24px !important;
    }	
    .post-content .greeting-sec__text-inner h3 {
        font-size: 20px !important;
    }
}
@media only screen and (min-width: 767px) {
  a[href^='tel:'] {
    pointer-events: none;
	}
.top-slider-flex {
    width: calc(100% - 10em);
}	
.scroll-box {
    width: 10em;
}}
@media only screen and (max-width: 767px) {
p {
  font-size: 14px;
}	
.btn--type01 a {
    width: 100%;
    max-width: 100%;
	}
h2.title-type01,
p.signage-title-sub {
    font-size: 13px;
    letter-spacing: 3px;
    margin-bottom: 3em !important;	
}	
h2.title-type01 span,
.page h1.signage-title.headline-font-type,
.archive h1.signage-title.headline-font-type,
.wp-singular h1.signage-title.headline-font-type {
    font-size: 30px;
    letter-spacing: 4px;
}	

.single-career.wp-singular h1.signage-title.headline-font-type {
  font-size:18px;
  font-family: "Roboto","Noto Sans JP",sans-serif;	
  font-weight: 700;
  font-style: normal;
  letter-spacing:6px;
  line-height: 1.4 !important;	
}
	
	
.front-topics {
     padding: 1.5em 0 4em;
    }	
.front-topics__news h2 {
    width: 100%;
    text-align: center;
    margin-left: 0;
}	

    #content01,
	.front-works{
        padding: 4em 0;
    }	
 #content01 .btn--type01{
    margin-top: 2.5em !important;
}		
.top-slider-flex {
    width: calc(100% - 7em);
}	
.scroll-box {
    width: 7em;
}	
    .top-news.flex-inner {
        width: 100%;
        padding-left: 0;
    }	
  .front-topics__news.flex-inner {
    display:block;
  }	
.front-features__item-inner {
    padding: 0 2em 2em;
}
p.content02-text {
    font-size: 14px;
}	
    .front-split {
        padding: 4em 0 4em;
    }	
    .front-split__image-box,
	.front-split__item:nth-of-type(even) .front-split__inner .front-split__image-box {
        margin: 4em auto 0 0 !important;
    }	
.front-split .btn--type01 {
    margin-top: 2.5em !important;
}	
.front-split__text-inner h3 span {
    font-size: 14px;
}	
.content02 .btn--type01 {
        margin-top: 1.5em !important;
    }	
.foogallery {
    display: grid;
    grid-template-columns: repeat(2, 1fr) !important;
}	
.front-topics__blog.flex-inner {
    justify-content: center;
	text-align: center;
	padding-top: 4em;
}
.cta__area {
    padding: 4em 0;
}	
.cta__btn {
    padding-bottom: 25px;
    margin-top: 2em;
}	
.cta__area h2.title-type01 {
    margin-bottom: 2.5em !important;
}
footer .btn--type01 {
    justify-content: center;
}	
footer .btn--type01 a{
    width:100%;
}		
	
  .article03-content {
    padding: 1em 1.5em 1.5em;
  }
h3.article03-title {
    font-size: 14px;
}	
  .top-blog, .top-news {
    margin: 0px 0 -1em auto;
  }
 .top-blog .article03 {
        width: 100% !important
    }	
  .article03 {
    width: calc((100% / 2) - 0.5em);
    margin-bottom: 1em;
    margin-right: 0;
    background: none;
  }
  .article03:nth-of-type(odd) {
    margin-right: 1em;
  }
  .top-blog .article03 {
    width: calc((100% / 2) - 0.5em);
    margin-right: 0;
  }
  .top-blog .article03:nth-of-type(odd) {
    margin-right: 1em;
  }
  .top-blog::before {
    height: calc(100% - 1em);
  }
  p.copyright {
    height: auto;
  }
  .post-content p {
    margin-bottom: 1.5em;
  }
  .signage-title {
    font-size: 1.8em;
  }
  .breadcrumb-wrapper {
    height: auto;
  }
  .post-header {
    margin: 0 auto 2em;
  }
  .post-title {
    font-size: 1.6em;
  }
  #infinitescroll .article03 {
    width: calc((100% / 2) - 0.5em);
    margin-bottom: 1em;
    margin-right: 0;
  }
  #infinitescroll .article03:nth-of-type(odd) {
    margin-right: 1em;
  }
  .footer__contact--inner.inner .footer__contact-btns a.footer__btn {
    margin-right: auto;
  }
  .footer__contact--inner.inner .footer__contact-btns a.footer__btn.footer__btn--line {
    justify-content: center;
    align-items: center;
    display: -webkit-flex;
    display: flex;
  }
  .archive-news {
    margin: 0 auto;
  }
  .item-career {
    width: calc((100% - 20px) / 2);
    /* 4 columns, 20px gutter */
    margin-bottom: 20px;
  }
  .global-nav, .header-bar-fixed .global-nav {
    max-width: 100%;
  }
 .article02-title,
 h3.article02-title{
    font-size: 14px;
  }	
}
@media only screen and (max-width: 485px) {
  .top-slider-flex {
    width: 100%;
    padding: 55px 0 0;
  }
  .scroll-box {
    display: none;
  }
  a.footer__btn:last-of-type {
    margin-bottom: 0;
  }
  .post-content td, .post-content th {
    display: block;
    width: 100% !important;
  }
  .post-content th {
    padding-right: 0;
    padding-bottom: 0;
  }
  .post-content td {
    padding-top: 0.25em;
  }
  .wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output {
    text-align: left;
    padding: 10px 15px;
  }
  .flow-box::after {
    width: 30px;
    height: 30px;
    line-height: 30px;
  }
  .flow-box::before {
    left: 14px;
  }
  .flow-box {
    padding-left: 45px;
  }
    .top-blog {
        width: calc(100% - 0em);
        padding-left: 0;
        margin: 0 0 0 auto;
    }
    .top-blog .article03:nth-of-type(odd) {
        margin-right: 0;
    }	
  .article03, .article03:nth-of-type(odd) {
    width: 100% !important;
    margin: 0 auto 1em;
  }
  .article03:last-of-type {
    margin-bottom: 0;
  }
  .top-blog::before {
    height: 100%;
  }
  a.footer__btn {
    width: 100%;
    margin: 0 auto 1.5em;
  }
  a.footer__btn:last-of-type {
    margin-bottom: 0;
  }
  .footer__about-inner {
    width: 100%;
    padding: 0;
    margin: 0 auto 2em;
  }
  .footer__menu {
    width: 100%;
    max-width: unset;
    padding: 0;
  }
  p.copyright {
    position: relative;
    text-align: center;
    margin: 4em auto 0;
    font-size: 0.9em;
  }
  .front-message__inner h3, .front-split__text-inner h3 {
    font-size: 20px;
  }
	
  a.article02-link {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5em;
  }
  a.article04-link {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5em;
  }

  .top-slider-flex .top-slider-wrapper, .top-slider, .header-youtube {
    aspect-ratio: 1 / 1.25;
  }
  .top-slider-flex #top-slider-content {
    width: 100%;
    padding-top: 55px;
  }
  .front-main-box {
    width: 100%;
    margin: 0 auto 0 0;
  }
  .front-main-box-inner h2 {
    font-size: 6vw;
    margin: 0 auto 0 0.7em;
  }
  .front-main-box-inner h3 {}
  .front-main-box-inner {}
  .top-slider-content-inner {
    padding: 0;
  }
  iframe#iframe_youtube-video-player {
    width: 250% !important;
    height: 200% !important;
    top: -50% !important;
  }

  .flow-box__detail {
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transition: max-height 0.4s ease, opacity 0.3s ease;
  }
  .flow-box__text.is-open .flow-box__detail {
    max-height: 30em;
    opacity: 1;
    transition: max-height 0.4s ease, opacity 0.4s ease 0.05s;
    margin-bottom: 1em;
  }
  button.flow-box__toggle {
    display: inline-flex;
    align-items: center;
    padding: 0;
    font-size: 0.85em;
    font-weight: var(--font-bold);
    color: var(--color-primary);
    background: none;
    border: none;
  }
  button.flow-box__toggle::after {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    margin-left: 0.5em;
    border-right: 1px solid var(--color-primary);
    border-bottom: 1px solid var(--color-primary);
    transform: rotate(45deg);
    transition: transform 0.3s;
  }
  .flow-box__text.is-open button.flow-box__toggle::after {
    transform: rotate(-135deg);
  }

  .service-item__detail {
    display: block;
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transition: max-height 0.4s ease, opacity 0.3s ease;
  }
  .service-item.is-open .service-item__detail {
    max-height: 30em;
    opacity: 1;
    transition: max-height 0.4s ease, opacity 0.4s ease 0.05s;
  }
    button.service-item__toggle {
        display: inline-flex;
        align-items: center;
        margin: 0.75em 0 1.25em;
        font-size: 0.85em;
        font-weight: var(--font-bold);
        color: var(--color-primary);
        border: none;
        background: #ffffff;
        padding: 0.5em 1em;
        border: 1px solid #000;
        border-radius: 2px;
    }
  button.service-item__toggle::after {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    margin-left: 0.5em;
    border-right: 1px solid var(--color-primary);
    border-bottom: 1px solid var(--color-primary);
    transform: rotate(45deg);
    transition: transform 0.3s;
  }
  .service-item.is-open button.service-item__toggle::after {
    transform: rotate(-135deg);
  }
  #infinitescroll .article03, #infinitescroll .article03:nth-of-type(odd) {
    width: 100%;
    margin: 0 auto 1em;
  }
  .service-item__text {
    margin-bottom: 0;
  }
  .service-item__body {
    gap: 1.5em;
  }
  .service-item__image {
    margin-top: 1.5em;
  }
  .frog_parts {
    bottom: -2em;
    right: 1em;
  }
  .frog__contact {
    right: -3em;
  }
}
/*========================================
 *  サービスページ　TABLET
======================================== */

/* TABLET
======================================== */

@media (max-width: 900px) {

  .service-sec .container {
    width: min(100% - 50px, 700px);
  }

  .service-sec .service-about,
  .service-sec .service-list,
  .service-sec .consultation {
    padding: 110px 0;
  }

  .service-sec .about-grid {
    grid-template-columns: 1fr;
    gap: 60px;
  }

  .service-sec .service-card {
    grid-template-columns: 1fr;
  }

  .service-sec .service-card-image {
    min-height: 300px;
  }

  .service-sec .service-card-content {
    padding: 55px 50px;
  }

  .service-sec .support-list,
  .service-sec .consultation-grid {
    grid-template-columns: 1fr;
  }
}


/* MOBILE
======================================== */

@media (max-width: 640px) {

  .service-sec .container {
    width: calc(100% - 40px);
  }

  .service-sec .pc {
    display: none;
  }

  .service-sec .sp {
    display: inline;
  }

  .service-sec .about-heading h2,
  .service-sec .section-heading h2 {
    margin-bottom: 0;
    font-size: 24px;
  }

  .service-sec .service-list .section-heading h2 {
    margin-bottom: 24px;
  }

  .service-sec .section-heading {
    margin-bottom: 50px;
  }

  .service-sec .service-about,
  .service-sec .service-list,
  .service-sec .consultation {
    padding: 12vw 0;
  }

  .service-sec .about-grid {
    gap: 45px;
  }

  .service-sec .about-content {
    font-size: 14px;
  }

  .service-sec .quote {
    margin: 40px 0;
    padding: 0 22px;
    font-size: 18px;
  }

  .service-sec .service-card {
    margin-bottom: 40px;
  }

  .service-sec .service-card-image {
    min-height: 220px;
  }

  .service-sec .service-card-content {
    padding: 40px 28px 45px;
  }

  .service-sec .service-card-content-inner {
    padding: 0;
  }

  .service-sec .service-card-content h3 {
    font-size: 27px;
  }

  .service-sec .support-content {
    font-size: 14px;
  }

  .service-sec .support-list {
    margin: 35px 0;
  }

  .service-sec .consultation-item {
    min-height: auto;
    padding: 16px 28px 35px 28px;
  }

  .service-sec .consultation-item h3 {
    font-size: 21px;
  }
  .greeting__body h3 {
    margin: 3em auto 1.5em;
}
  .pagetop a {
    width: auto;
    height: auto;
  }	
.pagetop a::after {
    display: none;
}
	.pagetop a {
    padding-bottom: 40px;
}
    .pagetop a::before {
        height: 30px;
		width: 1px;
    }	
.pagetop a::after {
    content: '';
    display: none;
    position: absolute;
    bottom: 0;
    right: 40px;
    width: 100px;
    height: 90px;
    background-image: url(/wp-content/uploads/2026/08/totop-frog01.png);
    background-repeat: no-repeat;
    background-size: cover;
    transition: 0.4s;
    margin: 0;
}	
.dp-footer-bar li.dp-footer-bar-item:first-child {
    background-image: url(/wp-content/uploads/2026/08/totop-frog01.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: top 6px left 15px;
}	
}



/* ----------------------------------------------------------
 * 制作実績：ビューア／こだわりのポイント
 * ---------------------------------------------------------- */
@media only screen and (max-width: 991px) {
  .career-pickup__item,
  .career-pickup__item:nth-child(even) {
    flex-direction: column;
    align-items: stretch;
    gap: 1.5em;
    margin-bottom: 3.5em;
  }
  .career-pickup__image {
    flex-basis: auto;
  }
  .post-content h3.career-pickup__title,
  .career-pickup__title {
    font-size: 18px;
  }
}

@media only screen and (max-width: 768px) {
  .career-viewer__frame {
    max-height: 70vh;
  }
  .career-viewer__thumb {
    width: 56px;
    height: 56px;
  }
  .item-career__title {
    font-size: 11px;
    padding: 2.2em 0.8em 0.7em;
  }
  .career-pickup {
    margin-top: 3.5em;
    padding-top: 2.5em;
  }
  .career-pickup__lead,
  .career-pickup__body {
    font-size: 14px;
    line-height: 1.9;
  }
}