@charset "UTF-8";

/*
Theme Name: Johokiki-renewal
Author:
Description:
*//*
YUI 3.18.1 (build f7e7bcb)
Copyright 2014 Yahoo! Inc. All rights reserved.
Licensed under the BSD License.
http://yuilibrary.com/license/
*/

html{color:#000;background:#FFF}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal}ol,ul{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}q:before,q:after{content:''}abbr,acronym{border:0;font-variant:normal}sup{vertical-align:text-top}sub{vertical-align:text-bottom}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;*font-size:100%}legend{color:#000}#yui3-css-stamp.cssreset{display:none}
input, select {
    vertical-align:middle;
}

a { text-decoration: none;}
a:visited{ color: unset }
a, a:visited, a:hover, a:active {
    color: inherit;
}
body {
    width: auto;
    /* max-width: 1280px; */
    margin: 0 auto;

}
body {
    /* font-family: "Helvetica Neue",
      Arial,
      "Hiragino Kaku Gothic ProN",
      "Hiragino Sans",
      Meiryo,
      sans-serif; */
    font-family: "Noto Sans JP", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
}
.wrapper {
    width: 100%;
    margin: 0 auto;
    padding-top: 5.1rem;
    letter-spacing: 0.05em;
    font-feature-settings: "palt" 1;
}
@media only screen and (max-width: 768px) {
    .wrapper {
        padding-top: 3.8rem;
    }
}
img {
    max-width: 100%;
    display: block;
}
#breadcrumbs {
    color:  #707070;
    font-size: 12px;
    padding: 0 1rem;
    margin: 10px 0;
}
@media only screen and (max-width: 768px) {
    #breadcrumbs {
        padding: 0 20px;
    }
}
a:hover {
    opacity: 0.7;
}


/* HEADING */

h1 {
    letter-spacing: 0.2rem;
}

h2 {
    margin-bottom: 30px;
    font-size: 70px;
    letter-spacing: .1em;
    line-height: 1.5;
    font-family: "Noto Sans JP", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    color: #2F5B74;
}
h2.center {
    margin: 0 auto 30px;
    text-align: center;
}
h2.anim_item {
    position: relative;
    width: fit-content;
}
h2.anim_item::after {
    content: "";
    width: 100%;
    height: calc(100% + 14px);
    position: absolute;
    top: 0;
    left: 0;
    background-color: #2F5B74;
    clip-path: inset(0 100% 0 0);
}
h2 span.ja {
    display: block;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: .1em;
}

h2.anim_item span.en,
h2.anim_item span.ja {
    opacity: 0;
}

h2.onTitle.anim_item::after {
    animation: sweep-in-out 0.7s ease-in-out forwards;
}
h2.onTitle.anim_item span.en,
h2.onTitle.anim_item span.ja {
    animation: fadeIn 0.1s ease forwards 0.35s;
}

@keyframes sweep-in-out {
    0%   { clip-path: inset(0 100% 0 0); }
    45%  { clip-path: inset(0 0 0 0); }
    65%  { clip-path: inset(0 0 0 0); }
    100% { clip-path: inset(0 0 0 100%); }
}

@keyframes fadeIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}

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

    h2 {
        margin-bottom: 25px;
        font-size: 50px;
    }
    h2.center {
        display: block;
        margin: 0 auto 25px;
    }

    h2 span.ja {
        font-size: 16px;
    }

}

/* COMMON LAYOUT */
.l_grid {
    display: grid;
    gap: 20px;
}

.l_grid--2col {
    grid-template-columns: 1fr 1fr;
}

.l_grid--3col {
    grid-template-columns: repeat(3, 1fr);
}

.l_grid--sidebar {
    grid-template-columns: 300px 1fr;
}

.l_grid__item--main {
    grid-column: 2;
}

.l_grid__item--sidebar {
    grid-column: 1;
}

.l_grid__item--full {
    grid-column: 1 / -1;
}

.l_grid--reverse {
    direction: rtl;
}

.l_grid--reverse > * {
    direction: ltr;
}

@media (max-width: 768px) {
    .l_grid--2col,
    .l_grid--sidebar {
        grid-template-columns: 1fr;
    }

    .l_grid__item--sidebar,
    .l_grid__item--main {
        grid-column: auto;
    }
}

.width_900 {
    max-width: 900px;
    width: 100%;
    margin-left: auto!important;
    margin-right: auto!important;
}
@media (max-width: 768px) {
    .width_900 {
        max-width: none;
    }
}


.menuBlock {
    display: grid;
    grid-template-columns: max-content max-content;
    gap: 40px;
    align-items: center;
    justify-content: space-between;
}

.menuBlock + .btn_box {
    margin-top: 20px;
}

.menuBlock:not(:first-of-type) {
    margin-top: 40px;
}

.menuBlock__media img {
    display: block;
    height: auto;
    max-width: 100%;
    justify-content: space-between;
}

.menuBlock__body {
    min-width: 0;
    /* max-width: 427px; */
    /* width: 100%; */
    width: 427px;
}

.menuBlock__body .btn_box {
    margin-top: 60px;
}

.menuBlock__title {
    font-size: 24px;
    font-weight: bold;
    line-height: 1.5;
    color: #2F5B74;
}

.menuBlock__lead {
    margin-top: 10px;
    font-size: 18px;
    font-weight: bold;
    line-height: 2;
    color: #2F5B74;
}

.menuBlock__text {
    margin-top: 10px;
    font-size: 14px;
    line-height: 1.5;
}

.menuBlock__text + .check_list {
    margin-top: 10px;
}


.menuBlock--reverse {
    grid-template-columns: 1fr max-content;
}

.menuBlock--reverse .menuBlock__media {
    order: 2;
}

.menuBlock--reverse .menuBlock__body {
    order: 1;
}

.menuBlock__media img {
    width: auto;
    max-width: 300px;
    height: auto;
}

@media (max-width: 767px) {
    .menuBlock,
    .menuBlock--reverse {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .menuBlock__media,
    .menuBlock__body,
    .menuBlock--reverse .menuBlock__media,
    .menuBlock--reverse .menuBlock__body {
        order: initial;
    }

    .menuBlock__media img {
        max-width: 100%;
    }

    .menuBlock__body .btn_box {
        margin-top: 40px;
    }

    .menuBlock__body {
        width: 100%;
    }


}
/* HEADING END */


.contents_wrap {
    max-width: 1040px;
    padding: 0 20px;
    margin: 0 auto;
}


.fadeBottom {
    opacity: 0;
    -webkit-transform: translateY(50px);
            transform: translateY(50px);
    -webkit-transition: opacity 2s,-webkit-transform 2s;
    transition: opacity 2s,-webkit-transform 2s;
    transition: opacity 2s,transform 2s;
    transition: opacity 2s,transform 2s,-webkit-transform 2s;
}

.fadeBottom.fadeInBottom {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
}

/*▼▼▼ HEADER ▼▼▼*/
.brand {
    font-size: 12px;
    color: #707070;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    max-width: 135px;
    margin-left: 1rem;
    align-content: center;
}
@media only screen and (max-width: 768px) {
    .brand {
        margin: 0 auto;
    }
}
.brand span{
    color: #707070;
}
.brand img {
    width: auto;
    height: 28px;
}
.site-header {
    position: fixed;
    top: 0;
    width: 100%;
    background-color: #fff;
    margin: 0 auto;
    z-index: 10;
}
.site-header__wrapper {
    display: flex;
    padding: 8px;
    /* position: fixed;
    left: 50%;
    transform: translateX(-50%); */
    z-index: 5;
    background: #fff;
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
}
@media only screen and (max-width: 768px) {
    .site-header__wrapper {
        display: unset;
        position: fixed;
        background: #fff;
        z-index: 999;
        width: 100%;
    }
}

.nav {
    width: 100%;
}
.nav__wrapper {
    display: flex;
    justify-content: space-evenly;
}

@media (min-width: 600px) {
    .nav__wrapper {
        display: flex;
    }
}
@media only screen and (max-width: 768px) {
    .nav__wrapper {
        position: absolute;
        top: 100%;
        right: 0;
        left: 0;
        z-index: -1;
        background-color: #d9f0f7;
        visibility: hidden;
        opacity: 0;
        transform: translateY(-100%);
        transition: transform 0.3s ease-out, opacity 0.3s ease-out;
    }
    .nav__wrapper.active {
        visibility: visible;
        opacity: 1;
        transform: translateY(0);
    }
}
.nav__item {
    position: relative;
}
.nav__item a {
    display: block;
    font-weight: bold;
    padding: 1rem 0.7rem;
    color: #707070;
    font-size: 13px;
    text-align: center;
}
.nav__item a p {
    color: #C9C8C8;
    font-size: 10px;
    margin: unset;
}
.nav__toggle {
    display: none;
}
@media only screen and (max-width: 768px) {
    .nav__toggle {
        display: block;
        position: absolute;
        right: 1rem;
        top: 1rem;
    }
}
ul.menu_second-level {
    visibility: hidden;
    opacity: 0;
    z-index: 1;
}
.nav__wrapper > .nav__item{
    position: relative;
}
.nav__item .menu_second-level {
    position: absolute;
    top: 65px;
    left: -27px;
    width: 180px;
    background: rgb(255 255 255 / 90%);
    -webkit-transition: all .2s ease;
    transition: all .2s ease;
}
.nav__item .menu_second-level li {
    border-top: 1px solid #2F5B74;
    margin-bottom: -1px;
}
.nav__item .menu_second-level li:first-child {
    border-top: 0;
}
.nav__item:hover .menu_second-level {
    top: 74px;
    visibility: visible;
    opacity: 1;
    z-index: 2;
}
    .footer_nav__wrapper > .nav__item{
        position: relative;
    }
    .footer_nav__item .menu_second-level {
        position: absolute;
        top: 65px;
        left: -27px;
        width: 180px;
        background: rgb(255 255 255 / 90%);
        -webkit-transition: all .2s ease;
        transition: all .2s ease;
    }
    .footer_nav__item .menu_second-level li {
        border-top: 1px solid #2F5B74;
        margin-bottom: -1px;
    }
    .footer_nav__item .menu_second-level li:first-child {
        border-top: 0;
    }
    .footer_nav__item:hover .menu_second-level {
        top: 50px;
        visibility: visible;
        opacity: 1;
        z-index: 2;
    }
/* 下矢印 */
.init-bottom:after {
    position: absolute;
    top: 40%;
    right: -3px;
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    margin: 0 0 0 15px;
    border-right: 1px solid #707070;
    border-bottom: 1px solid #707070;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}
.footer_nav__item .init-bottom:after {
    border-right: 1px solid #ffffff;
    border-bottom: 1px solid #ffffff;
}
#humberger {
    position: relative;
    height: 20px;
    width: 28px;
    display: inline-block;
    box-sizing: border-box;
}
#humberger div {
    position: absolute;
    left: 0;
    height: 2px;
    width: 28px;
    background-color: #2F5B74;
    border-radius: 2px;
    display: inline-block;
    box-sizing: border-box;
}
#humberger div:nth-of-type(1) {
    bottom: 20px;
}
#humberger div:nth-of-type(2) {
    bottom: 10px;
}
#humberger div:nth-of-type(3) {
    bottom: 0;
}
.mobile-header {
    display: none;
}
@media only screen and (max-width: 768px) {
    .mobile-header {
        display: block;
    }
}
/*　ハンバーガーメニューボタン　*/
.hamburger {
    display : block;
    position: fixed;
    z-index : 11;
    right : 20px;
    top   : 8px;
    width : 42px;
    height: 42px;
    cursor: pointer;
    text-align: center;
  }
  .hamburger span {
    display : block;
    position: absolute;
    width   : 30px;
    height  : 2px ;
    left    : 6px;
    background : #BBBBBB;
    -webkit-transition: 0.3s ease-in-out;
    -moz-transition   : 0.3s ease-in-out;
    transition        : 0.3s ease-in-out;
  }
  .hamburger span:nth-child(1) {
    top: 10px;
  }
  .hamburger span:nth-child(2) {
    top: 20px;
  }
  .hamburger span:nth-child(3) {
    top: 30px;
  }

  /* スマホメニューを開いてる時のボタン */
  .hamburger.active span:nth-child(1) {
    top : 16px;
    left: 6px;
    background :#fff;
    -webkit-transform: rotate(-45deg);
    -moz-transform   : rotate(-45deg);
    transform        : rotate(-45deg);
  }

  .hamburger.active span:nth-child(2),
  .hamburger.active span:nth-child(3) {
    top: 16px;
    background :#fff;
    -webkit-transform: rotate(45deg);
    -moz-transform   : rotate(45deg);
    transform        : rotate(45deg);
  }

  /* メニュー背景　*/
  nav.globalMenuSp {
    position: fixed;
    z-index : 2;
    top  : -50px;
    left : 0;
    color: #fff;
    background: rgb(48 91 116);
    text-align: center;
    height: 100%;
    transform: translateY(-150%);
    transition: all 0.6s;
    width: 100%;
  }
  @media only screen and (max-width: 630px) {
  nav.globalMenuSp {
width: unset;
  }
  }

  nav.globalMenuSp ul {
    padding: 0;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    margin-top: 1rem;
  }

  nav.globalMenuSp ul li {
    list-style-type: none;
    padding: 0;
    width: 100%;
    transition: .4s all;
    border-bottom: 1px solid #fff;
  }
  nav.globalMenuSp ul li:last-child {
    padding-bottom: 0;
    border-bottom: none;
  }
  nav.globalMenuSp ul li a {
    display: block;
    margin: 1rem 0;
    text-decoration :none;
    font-weight: bold;
  }

  nav.globalMenuSp ul li a{
    font-size: 20px;
  }
  nav.globalMenuSp ul li a p{
    font-size: 16px;
  }
  @media only screen and (max-width: 768px) {
    nav.globalMenuSp ul li a {
        margin: 8px 0;
      }
    nav.globalMenuSp ul li a{
        font-size: 18px;
      }
      nav.globalMenuSp ul li a p{
        font-size: 14px;
      }
  }
  /* クリックでjQueryで追加・削除 */
  nav.globalMenuSp.active {
    opacity: 100;
    display: block;
    transform: translateY(0%);
    padding: 1rem;
    top: 0;
  }
/* CONTACT CTA */
.pc_fixed_nav {
    position: fixed;
    top: 50%;
    right: -24px;
    z-index: 4;
    transform: translate(-50%, -50%);
}

.contact-cta,
.information-cta-pc {
    position: relative;
}
.contact-cta-pc,
.information-cta-pc {
    padding: 12px;
    /* position: fixed; */
    /* top: 50%;
    right: -24px; */
    /* z-index: 4; */
    /* transform: translate(-50%, -50%); */
    background: #fff;
    color: #2F5B74;
    border: 1px solid #2F5B74;
    display: flex;
    flex-flow: column;
    align-items: center;
}

.contact-cta-pc {
    /* top: 50%;
    right: -24px; */
}

.information-cta-pc {
    /* top: 50%;
    right: -24px; */
}

.contact-cta-pc span{
    color: #2F5B74;
}
.contact-cta-pc img{
    width: 24px;
    height: auto;
    margin-top: 3px;
}
.contact-cta-pc span,
.information-cta-pc span {
    font-size: 18px;
    font-weight: bold;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
}
.sp_fixed_nav {
    display: none;
}

@media only screen and (max-width: 768px) {
    .sp_fixed_nav {
        display: grid;
        grid-template-columns: 1fr 1fr;
        position: fixed;
        z-index: 4;
        bottom: 0;
        left: 0;
        width: 100%;
    }
}

.contact-cta-mobile,
.information-cta-mobile {
    /* position: fixed;
    z-index: 4;
    bottom: 0;
    left: 0; */
    background: #2F5B74;
    padding: 12px;
    width: 100%;
    height: auto;
    text-align: center;
    display: flex;
}
.information-cta-mobile {
    border-right: 1px solid #fff;
    box-sizing: border-box;
}
.contact-cta-mobile span,
.information-cta-mobile span {
    color: #fff;
    font-weight: bold;
}
.contact-cta-mobile img{
    width: 24px;
    height: 25px;
    margin-left: 8px;
}
.contact-cta-mobile .fl-bx,
.information-cta-mobile .fl-bx {
    justify-content: center;
}
.sub-navi .dropdown-list {
    display: none;
}
.sub-menu {
    position: relative;
}
#arrow::after {
    content: '▼';
    position: absolute;
    font-size: 16px;
    top: 3px;
    padding-left: 8px;
}
.dropdown_toggle #arrow::after {
    content: '▲';
    position: absolute;
}

.globalMenuSp .sub-navi ul li input[type="checkbox"]{
    display:none;
}
label[for="sub-menu"]{
    display:block;
    font-size: 20px;
    font-weight: bold;
    margin: 1rem 0;
}
label[for="sub-menu"] p {
    font-size: 16px;
}
@media only screen and (max-width: 768px) {
    label[for="sub-menu"]{
        display:block;
        font-size: 18px;
        font-weight: bold;
        margin: 1rem 0;
    }
    label[for="sub-menu"] p {
        font-size: 16px;
    }
}
label[for="sub-menu"]::before{
    transform:rotate(225deg);
}
#sub-menu:checked + .dropdown-list{
    display:block;
}
.sub-navi li input {
    display: none;
}
.sub-menu {
    font-size: 20px;
    font-weight: bold;
}
.sub-menu p{
    font-size: 16px;
}
.dropdown-list li {
    border-bottom: unset !important;
}
.dropdown-list li a {
    font-size: 16px !important;
    font-weight: normal !important;
}
.dropdown-list {
    margin-top: unset !important;
}



/*▲▲▲ HEADER END ▲▲▲*/


/*▼▼▼ FOOTER ▼▼▼*/
.site-footer__wrapper {
    background: #2F5B74;
    margin: 0 auto;
}
@media only screen and (max-width: 768px) {
    .site-footer__wrapper {
        margin-bottom: 3rem;
    }
}
.footer-containner {
    max-width: 900px;
    margin: 0 auto;
}
.footer_nav__item a {
    display: block;
    font-weight: bold;
    padding: 1.5rem 1rem;
    color: #fff;
    font-size: 13px;
    text-align: center;
}
@media only screen and (max-width: 768px) {
    .footer_nav__item a {
        padding: 1rem;
        font-size: 12px;
    }
}
.footer_nav__item .menu_second-level a {
    color:  #2F5B74;
    padding: 6px;
}
.footer_nav__item a p {
    color: #C9C8C8;
    font-size: 10px;
    margin: unset;
}
.footer-containner .footer_nav__wrapper{
    border-bottom: 1px solid #fff;
}
.footer_nav {
    width: 100%;
}
.footer_nav__wrapper {
    display: flex;
    justify-content: space-evenly;
    flex-wrap: wrap;
}

@media (min-width: 600px) {
    .footer_nav__wrapper {
        display: flex;
    }
}
/* @media only screen and (max-width: 768px) {
    .footer_nav__wrapper {
        position: absolute;
        top: 100%;
        right: 0;
        left: 0;
        z-index: -1;
        background-color: #d9f0f7;
        visibility: hidden;
        opacity: 0;
        transform: translateY(-100%);
        transition: transform 0.3s ease-out, opacity 0.3s ease-out;
    }
    .footer_nav__wrapper.active {
        visibility: visible;
        opacity: 1;
        transform: translateY(0);
    }
    .footer_nav__item a {
        padding: 1rem 1rem 0.5rem;
    }
} */
.footer-subcontainer {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 8.5px;
}
.footer-logo {
    padding: 1rem;
    margin: 1rem;
    background: #fff;
    width: 246px;
    display: flex;
    justify-content: center;
    place-items: center;
}
.footer-logo img{
    width: 100%;
    height: auto;
}
.footer-adresss {
    padding: 0 1rem;
    margin: 1rem;
}
.footer-adresss li {
    font-size: 12px;
    color: #fff;
}
.copyright {
    font-size: 12px;
    color: #fff;
    padding-bottom: 24px;
    text-align: center;
}
.copyright p{
    letter-spacing: 0.2rem;
}
/*▲▲▲ FOOTER END ▲▲▲*/


/*▼▼▼ INDEX ▼▼▼*/

/* Repeatable css */
.container {
    max-width: 1024px;
    margin: 0 auto;
    margin-bottom: 50px;
}
@media only screen and (max-width: 768px) {
    .container {
        max-width: 428px;
        margin: 0 auto;
    }
}
.container p {
    color: #707070;
    font-size: 16px;
    margin: 10px 0;
    line-height: 2;
}

.container-background {
    margin: 45px 0 30px;
    width: 100%;
    background: linear-gradient(339.5deg, rgba(248,248,248,1) 50%, rgba(237,237,237,1) 50%);
    max-height: 490px;
}
.display-mobile {
    display: none;
}
@media only screen and (max-width: 768px) {
    .display-pc {
        display: none;
    }
    .display-mobile {
        display: block;
    }
    .container-background {
    max-height: unset;
    }
}
.fl-bx {
    display: flex;
}
.inner {
    margin: 0 3rem;
}
@media only screen and (max-width: 768px) {
    .inner {
        margin: 0 1rem;
    }
}

/* Repeatable css END */

/* Common */
.pc {
    display: block!important;
}

.sp {
    display: none!important;
}

@media only screen and (max-width: 768px) {
    .pc {
        display: none!important;
    }

    .sp {
        display: block!important;
    }
}

/* Top KV */
.kv_area {
    margin-bottom: 30px;
    position: relative;
}

.kv_area .inner {
    position: relative;
    width: 100%;
    /* height: 100%; */
    max-width: 1000px;
    height: 548px;
    margin: 0 auto;
    padding-bottom: 3rem;
}

.kv_area .inner .kv-text {
    position: absolute;
    left: 0;
    top: 164px;
    color: #2F5B74;
    font-weight: bold;
}

.kv_area .inner .kv-text h2 {
    font-size: 38px;
    line-height: calc(46 / 38);
    letter-spacing: .1em;
    font-weight: bold;
}

.kv_area .inner .kv-text h2 span {
    display: block;
    margin-bottom: 4px;
    font-size: 24px;
    line-height: calc(36 / 24);
}

.kv_area .inner .kv-text p {
    margin-top: 4px;
    font-size: 16px;
    line-height: calc(24 / 16);
    letter-spacing: .1em;
}

.kv_area .inner .kv {
    position: absolute;
    right: -45px;
    top: 48px;
    /* width: 58%; */
    width: 576px;
    z-index: -1;
}

.kv_area .inner .kv img {
    width: 100%;
}

@media only screen and (max-width: 768px) {
    .kv_area .inner {
        display: flex;
        flex-direction: column;
        padding: 30px 20px 70px;
        height: auto;
        box-sizing: border-box;
        text-align: center;
    }

    .kv_area .inner .kv-text {
        position: static;
        margin-bottom: 20px;
    }

    .kv_area .inner .kv-text h2 {
        font-size: 30px;
    }

    .kv_area .inner .kv-text h2 span {
        margin-bottom: 4px;
        font-size: 20px;
    }

    .kv_area .inner .kv-text p {
        margin-top: 4px;
        font-size: 15px;
    }

    .kv_area .inner .kv {
        position: static;
        width: 95%;
    }
}


/* Top Slider */
.top-slider {
    margin-bottom: 30px;
    position: relative;
}
.swiper {
    position: relative;
    width: 100%;
    max-width: 1280px;
    max-height: 694px;
    padding-bottom: 3rem;
}
@media only screen and (max-width: 768px) {
    .swiper {
        width: 100%;
        height: 650px;
        padding-bottom: 4rem;
    }
}
.swiper-slide {
    position: relative;
    text-align: center;
    font-size: 18px;
    background: #fff;
    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}
.swiper-slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.swiper-container {
    padding-bottom: 38px;
}
.slider-text {
    z-index: 2;
    position: absolute;
    font-size: 34px;
    font-weight: bold;
    text-align: left;
    top: 5%;
    margin: 4rem;
    left: 5%;
    line-height: 4rem;
    color: #fff;
    letter-spacing: 0.5rem;
}
@media only screen and (max-width: 768px) {
    .slider-text {
        font-size: 28px;
        top: 5%;
        margin:0 0 0 20px;
        left: 0;
        line-height: 2.5rem;
    }
}
.swiper-pagination {
    position:absolute;
    left: unset !important;
}
@media only screen and (max-width: 768px) {
    .swiper-pagination {
        bottom: 0px !important;
    }
}
.swiper-pagination-bullet {
    background: #2F5B74;
    width: 14px; height: 14px;
    margin: 0 var(--swiper-pagination-bullet-horizontal-gap,31px) !important;
}

.news-float {
    position: absolute;
    bottom: 47px;
    margin-left: auto;
    margin-right: auto;
    left: 0;right: 0;
    max-width: 874px;
    display: flex;
    z-index: 2;
    background-color: #fff;
    color: #6A6A6A;
    padding: 6px 12px;
    border: 1px solid #d5d5d5;
    align-items: center;
    height: 50px;
}
@media only screen and (max-width: 768px) {
    .news-float {
        bottom: 0;
        max-width: 90vw;
        padding: 4px 6px;
        height: 48px;
    }
}
.news-float h3 {
    font-weight: bold;
    font-size: 14px;
    border-right: 1px solid #C9C8C8;
    margin-right: 3px;
    padding-right: 12px;
}
.news-float p {
    font-size: 12px;
    border-left: 1px solid #C9C8C8;
    padding-left: 12px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.news-btn {
    margin-left: auto;
    width: 200px;
    text-align: end;
}
.news-btn a{
    font-size: 14px;
}
@media only screen and (max-width: 768px) {
    .news-btn a{
        font-size: 14px;
    }
}
/* Top Slider END */

/* Catchphrase/Mission */
.top-catchphrase {
    padding: 0 20px;
}
.top-catchphrase h2 {
    margin: 10px auto;
}
.top-catchphrase h2 {
    font-size: 24px;
    color: #707070;
    text-align: center;
    /* line-height: 36; */
    /* letter-spacing: 200; */
}
.top-mission {
    margin: 30px 0 45px;
}
.top-mission {
    padding: 0 20px;
}
.top-mission-img {
    position: relative;
    overflow: hidden;
    background: url(assets/images/test-top-mission.jpg);
    background-position:center;
}
@media only screen and (max-width: 768px) {
    .top-mission-img {
        height: 220px;
        height: auto;
        background-size: cover;
    }
}
.top-mission-img::before {
    content: "";
    position: absolute;
    top: 0;
    left: 110px;
    width: 100%;
    height: 100%;
    background: linear-gradient(312deg, rgba(47,91,116,1) 50%, rgba(0,0,0,0) 50%);
}
.top-mission-text {
    position: absolute;
    top: 0;
    width: 100%;
    text-align-last: right;
    text-align: -webkit-right;
}
.top-mission-text h2{
    font-size: 40px;
    color: #FFFCFC;
    font-weight: bold;
    margin: 1rem;
}
.top-mission-text h3{
    font-size: 18px;
    color: #FFFFFF;
    font-weight: bold;
    margin: 2rem auto;
    max-width: 900px;
    line-height: 2.5rem;
}
@media only screen and (max-width: 768px) {
    .top-mission-text h2{
        font-size: 30px;
        color: #FFFCFC;
        font-weight: bold;
        margin: 1rem;
    }
    .top-mission-text h3{
        font-size: 16px;
        color: #FFFFFF;
        font-weight: bold;
        margin: 2rem auto;
        max-width: 900px;
        line-height: 2.5rem;
    }
}
/* Catchphrase/Mission END */

/* Top Subheader */
.top-subheader {
    margin: 30px auto;
    max-width: 370px;
    position: relative;
}
@media only screen and (max-width: 768px) {
    .top-subheader {
        max-width: unset;
    }
}
.top-subheader h2{
    font-size: 26px;
    font-weight: bold;
    color: #2F5B74;
    text-align:center;
    padding-bottom: 0.7rem;
    border-bottom: 5px solid #EFE250;
}

.container .top-subheader h2{
    margin: 0 16px;
}

/* Top Subheader END*/


/* Top Reason/Pointer */
.top-about-heading {
    margin: 30px auto;
    display: flex;
    background: linear-gradient(346.5deg, rgba(220,226,244,1) 50%, rgba(235,240,255,1) 50%);
    max-width: 247px;
    height: 60px;
    align-items: center;
    justify-content: center;
    color: #707070;
    box-shadow: 3px 3px 4px rgb(0 0 0 / 15%);
}
.top-about-heading h2{
    color: #707070;
}

.top-about-reasons {
    margin: 30px 0 45px;
    padding: 0 20px;
}
.top-about-reasons-3 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
@media only screen and (max-width: 768px) {
    .top-about-reasons-3 {
        justify-content: center;
    }
}
.top-about-reasons-3 li{
    margin: 1rem 0;
    max-width: 290px;
    color: #707070;
    width: 30%;
}
@media only screen and (max-width: 768px) {
    .top-about-reasons-3 li{
        width: 100%;
    }
}
.top-about-reasons-3 img{
    width: 100%;
    height: auto;
}
.top-about-reasons-3 li h3{
    text-align: center;
    font-weight: bold;
    font-size: 18px;
    margin: 0.5rem 0 1rem;
}
/* Top Reason/Pointer END */

/* Services */
.top-service {
    padding: 30px 1rem 45px;
}
@media only screen and (max-width: 768px) {
    .top-service {
        padding: 1rem;
    }
}
.top-service .top-subheader {
    margin: 0 auto 40px;
}
.top-services-3 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
@media only screen and (max-width: 768px) {
    .top-services-3 {
        justify-content: center;
    }
}
.top-services-3 li{
    margin: 1rem 0;
    color: #707070;
    position: relative;
    width: 32%;
}
@media only screen and (max-width: 768px) {
    .top-services-3 li{
        width: 100%;
    }
}
.top-service-img a{
    height: 100%;
    width: 100%;
}
.top-service-img h3{
    position: absolute;
    text-align: center;
    font-size: 18px;
    color: #fff;
    margin: 1.25rem;
    bottom: 0;
    text-align-last: right;
    right: 0;
}
.top-service-img {
    position: relative;
    overflow: hidden;
}
/* .top-service-img::before {
    content: "";
    position: absolute;
    top: 24px;
    width: 100%;
    height: 100%;
    background: linear-gradient(331deg, rgba(47,91,116,0.7) 50%, rgba(0,0,0,0) 50%);
} */
.top-service-img {
    outline: 1px solid white;
    outline-offset: -11px;
    z-index: 3;
}
/* Services END */



/* NEW SERVICE */
.top_service {
    margin-bottom: 50px;
}

.top_service .service_box {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
}

.top_service .service_box .service_item a {
    position: relative;
    display: block;
}

.top_service .service_box .service_item a .service_txt {
    position: absolute;
    bottom: 27px;
    left: 50%;
    transform: translateX(-50%);
    width: calc(100% - 22px);
    color: #FFFFFF;
}

.top_service .service_box .service_item a .service_txt h3 {
    position: relative;
    margin-bottom: 15px;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: 0;
}

.top_service .service_box .service_item a .service_txt h3::before {
    position: absolute;
    bottom: -5px;
    left: 0;
    content: "";
    display: block;
    width: 100%;
    height: 2px;
    background-color: #FFFFFF;
}

.top_service .service_box .service_item a .service_txt p {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.4;
    letter-spacing: .01em;
}

@media only screen and (max-width: 768px) {
    .top_service .service_box {
        display: block;
    }
    .top_service .service_box .service_item {
        width: 100%;
    }
}

/* NEW SERVICE END */


/* NEW REASON */
.top_reason {
    margin-bottom: 60px;
}

.top_reason .reason_box {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 35px;
}

.top_reason .reason_box .reason_item .reason_txt {
    margin-top: 10px;
}

.top_reason .reason_box .reason_item .reason_txt h3 {
    font-size: 16px;
    font-weight: 700;
    letter-spacing: .01em;
    line-height: 1.4;
    color: #2F5B74;
    text-align: center;
}

.top_reason .reason_box .reason_item .reason_txt p {
    margin-top: 7px;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: .01em;
    line-height: 1.4;
}


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

    .top_reason .reason_box {
        display: block;
    }

    .top_reason .reason_box .reason_item:not(:first-of-type) {
        margin-top: 30px;
    }

}

/* NEW REASON END */


/* Blog */
.top_blog {
    margin-bottom: 90px;
}

.blog_bg {
    background: url(assets/images/blog_background.jpg);
    background-position: center;
    background-size: cover;
}
@media only screen and (max-width: 425px) {
    .blog_bg {
        background: url(assets/images/blog_background.png);
        background-size: cover;
    }
}
.top-blog {
    margin: 2rem 1rem;
}
.top-blog-3 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
@media only screen and (max-width: 768px) {
    .top-blog-3 {
        justify-content: center;
    }
}
.top-blog-3  figure{
    margin: unset;
}

.top-blog-3 li{
    width: 32%;
    color: #707070;
}
@media only screen and (max-width: 768px) {
    .top-blog-3 li{
        max-width: unset;
        width: 100%;
    }
}
.top-blog-3 li h3{
    color: #3D3D3D;
    font-size: 16px;
}
.top-blog-3 li p{
    color: #3D3D3D;
}
.top-blog-page {
    margin-bottom: 1rem;
}
.top-blog-page span {
    font-size: 12px;
    color: #3B4043;
}

.top-blog-3 figure {
    margin: unset;
    height: 140px;
    overflow: hidden;
    width: 100%;
}
.top-blog-3 figure img {
    object-fit: cover;
    width: 100%!important;
    height: 100%!important;
}

.top-blog-cta {
    display: flex;
    width: 100%;
    justify-content: flex-end;
    padding: 0 20px;
    box-sizing: border-box;
}
.top-blog-cta a {
    /* margin: 30px auto;
    display: flex;
    background: linear-gradient(346.5deg, rgba(220,226,244,1) 50%, rgba(235,240,255,1) 50%);
    max-width: 247px;
    height: 60px;
    align-items: center;
    justify-content: center;
    color: #707070;
    box-shadow: 3px 3px 4px rgb(0 0 0 / 15%); */
    display: flex;
    justify-content: center;
    align-items: center;
    width: 200px;
    height: 50px;
    background-color: #2B404C;
    font-size: 14px;
    letter-spacing: .01em;
    line-height: 1.5;
    color: #FFFFFF;
    transition: .3s;
}
.top-blog-cta a::hover {
    background-color: #FFFFFF;
    color: #2B404C;
}


.post-type-archive-post .top-blog , .post-type-archive-post .top-blog-cta{
    display: none;
}

.blog-container {
    color: #707070;
}
.blog-container h1{
    color: #707070;
   font-size: 38px;
}
.blog-container h2{
    color: #707070;
   font-size: 28px;
}
.blog-container p{
    color: #707070;
   font-size: 16px;
   /* letter-spacing: ;
   line-height: ; */
}
/* Blog END */



/*▲▲▲ INDEX END ▲▲▲*/


/*▼▼▼ SUBPAGE  ▼▼▼*/


/* repeatable  */
.subheader {
    height: 454px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    padding: 1rem;
}
@media only screen and (max-width: 768px) {
    .subheader {
        height: 520px;
    }
}
/* .subheader::before {
    content: "";
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    filter: brightness(90%);
} */
.subhead_text {
   text-align: center;
}
.subhead_text h1 {
   font-size: 34px;
   font-weight: bold;
   letter-spacing: 0.5rem;
}
.subhead_text span {
   font-size: 26px;
}
/* repeatable  END */

/*▼▼ Office Solution Archive ▼▼*/
.office_sol_bg {
    background: url(assets/images/office-solution/office_solution_background.jpg);
    background-position: center;
    background-size: cover;
}
.solution-office ul li a {
    height: 340px;
}
.solution-about {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.solution-about-img, .solution-about-text {
    width: 48%;
    margin-bottom: 40px;
}
@media only screen and (max-width: 768px) {
    .solution-about-img, .solution-about-text {
        width: unset;
        padding: 1rem 20px;
        margin-bottom: unset;
    }
    .solution-about {
        justify-content: center;
    }

    .inner .solution-about-img, .inner .solution-about-text {
        width: unset;
        padding: 1rem 0;
        margin-bottom: unset;
    }
}
.solution-about-img img {
   height: 230px; width: auto;
   margin: 0 auto;
}
.solution-about-text {
    margin:0;
}
.solution-about-text p{
    margin:0;
}
.solution-list ul {
    margin: 0 1rem;
}
.solution-list ul {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
@media only screen and (max-width: 768px) {
    .solution-list ul {
        justify-content: center;
    }
}
.solution-container {
    width: 32%;
    margin: 1rem 0;
}
@media only screen and (max-width: 768px) {
    .solution-container {
        width: 100%;
        margin: 1rem 0  1.5rem;
    }
}
.solution-container a{
    display: flex;
    flex-direction: column;
}
.solution-container h2{
    font-size: 16px;
    color: #40687F;
    margin-top: 10px;
    font-weight: bold;
}
.solution-container p{
    font-size: 14px;
    margin: 5px 0 0;
}
.solution-container span{
    font-size: 12px;
}
.read_more_btn {
    color: #40687F;
    margin-top: auto;
    margin-left: auto;
}
/*▲▲ Office Solution Archive END ▲▲*/


/*▼▼ RENTAl ▼▼*/
.remtal-tabel {
    margin: 2rem 0;
}
.rental-subtitle {
    max-width: 500px !important;
}
.rental-subtitle  span{
    font-size: 18px;
}

.rental-about-reasons {
    margin: 2rem 0;
}
.rental-about-reasons-3 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
@media only screen and (max-width: 768px) {
    .rental-about-reasons-3 {
        justify-content: center;
    }
}
.rental-about-reasons-3 li{
    margin: 1rem 0;
    max-width: 290px;
    color: #707070;
    width: 30%;
}
@media only screen and (max-width: 768px) {
    .rental-about-reasons-3 li{
        width: 100%;
        max-width: unset;
    }
}
.rental-about-reasons-3 img{
    width: 100%; height: auto;
}
.rental-about-reasons-3 li h3{
    text-align: center;
    font-weight: bold;
    font-size: 18px;
    margin: 0.5rem 0 1rem;
}
.rental-about-reasons-point img {
    height: 220px; width: auto;
}


.rental-copy-reasons-3 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
@media only screen and (max-width: 768px) {
    .rental-copy-reasons-3 {
        justify-content: center;
    }
}
.rental-copy-reasons-3 li{
    margin: 1rem 0;
    max-width: 290px;
    color: #707070;
    width: 30%;
}
@media only screen and (max-width: 768px) {
    .rental-copy-reasons-3 li{
        width: 100%;
        max-width: unset;
    }
}
.rental-copy-reasons-3 img{
    width: 100%; height: auto;
}
.rental-copy-reasons-3 li h3{
    font-weight: bold;
    font-size: 18px;
    margin: 10px 0 5px;
    color: #40687F;
}
.rental-copy-reasons-3 li p{
    color: #3D3D3D;
    margin-top: 5px;
}
.rental-copy-reasons-point img {
    height: 200px; width: auto;
}

.rental-table table{
    width: 100%;
    border-collapse:separate;
    border-spacing: 0;
}
.responsive-table {display: none;}
@media only screen and (max-width: 768px){
    .responsive-table {
        display: block;
    }
}
.rental-table table th,.rental-table table td{
    font-size: 20px;
    color: #707070;
    font-weight: bold;
}
@media only screen and (max-width: 768px){
    .rental-table table th{
        font-size: 16px;
        color: #707070;
        font-weight: bold;
    }
    .rental-table table td{
        font-size: 16px;
        color: #707070;
    }
}

.rental-table table th:last-child{
    border-right: 1px solid #707070;
}

.rental-table table th{
    text-align: center;
    color:white;
    background: #2F5B74;
    border-left: 1px solid #707070;
    border-top: 1px solid #707070;
    border-bottom: 1px solid #707070;
    width: 25%;
    padding: 8px 0;
}
.rental-table table td{
    text-align: center;
    border-left: 1px solid #707070;
    border-bottom: 1px solid #707070;
    border-top:none;
    width: 25%;
    padding: 8px 0;
    color: #707070;
}
.rental-table table td:last-child{
    border-right: 1px solid #707070;
}
@media only screen and (max-width: 768px){
    .mobile-5-col th:nth-child(1), .mobile-5-col td:nth-child(1)  {
        width: 15%;
    }
    .mobile-5-col th:nth-child(2), .mobile-5-col td:nth-child(2)  {
        width: 20%;
    }
    .mobile-5-col th:nth-child(3), .mobile-5-col td:nth-child(3)  {
        width: 15%;
    }
    .mobile-5-col th:nth-child(4), .mobile-5-col td:nth-child(4)  {
        width: 15%;
    }
}
.copy-banner{
    margin: 2rem 0;
}
.copy-banner ul{
    display: flex;
    justify-content: space-between;
}
.copy-banner ul li{
    width: 48%;
}
@media only screen and (max-width: 768px) {
    .copy-banner ul{
        display: block;
    }
    .copy-banner ul li{
        width: 100%;
        margin-bottom: 1rem;
    }
}
.copy-banner ul li a img:hover{
   opacity: 0.7;
}
.rental-internet {
    margin: 1rem auto;
}
.rental-internet ul{
    display: flex;
    justify-content: space-between;
}
.rental-internet ul li{
    width: 48%;
}
.rental-internet ul li h3{
   color: #2F5B74;
   font-size: 26px;
   font-weight: bold;
}
@media only screen and (max-width: 768px) {
    .rental-internet ul{
        display: block;
    }
    .rental-internet ul li{
        width: 100%;
    }
    .rental-internet ul li h3{
       font-size: 20px;
       padding: 1rem 0 0;
    }
}
.wifi-notice {
    margin-top: 4rem;
    font-size: 14px;
}
.rental-internet-img {
    margin: 0 3rem;
}
.rental-internet-p {
    margin: 0 3rem;
}
.rental-wifi {
    margin: 3rem 0 1rem;
}
@media only screen and (max-width: 768px) {
    .rental-internet-img, .rental-internet-p {
        margin: 0;
    }
    .rental-wifi {
        margin: 1rem 0 1rem;
    }
}
.rental-wifi table{
    width: 100%;
    border-collapse:separate;
    border-spacing: 0;
}
.rental-wifi table th,.rental-wifi table td{
    font-size: 20px;
    color: #707070;
    font-weight: bold;
}


.rental-wifi table th:last-child{
    border-right: 1px solid #707070;
}

.rental-wifi table th{
    text-align: center;
    color:white;
    background: #2F5B74;
    border-left: 1px solid #707070;
    border-top: 1px solid #707070;
    border-bottom: 1px solid #707070;
    width: 20%;
    padding: 8px 0;
}

.rental-wifi table td{
    text-align: center;
    border-left: 1px solid #707070;
    border-bottom: 1px solid #707070;
    border-top:none;
    width: 20%;
    padding: 8px 0;
    color: #707070;
}
.rental-wifi table td:last-child{
    border-right: 1px solid #707070;
}
@media only screen and (max-width: 768px) {
    .rental-wifi table th{
        border-bottom: unset;
    }
    .rental-wifi table td{
        border-left: 1px solid #707070;
        border-right: unset;
        border-top: 1px solid #707070;
        border-bottom: unset;
    }
    .rental-wifi table tr:last-child td:last-child{
        border-bottom: 1px solid #707070;
    }
    .mobile-text p{
        font-size: 14px;
    }
    .rental-wifi table th, .rental-wifi table td {
        font-size: 16px;
        width: 15%;
    }
}
@media only screen and (max-width: 768px) {
    .center {
        display: flex;
        justify-content: center;
    }
}
.rental-wifi-2 {
    margin: 3rem 0 1rem;
}
.rental-wifi-2 table{
    width: 100%;
    border-collapse:separate;
    border-spacing: 0;
}
.rental-wifi-2 table th,.rental-wifi-2 table td{
    font-size: 20px;
    color: #707070;
    font-weight: bold;
}

.rental-wifi-2 table th:last-child{
    border-right: 1px solid #707070;
}

.rental-wifi-2 table th{
    text-align: center;
    color:white;
    background: #2F5B74;
    border-left: 1px solid #707070;
    border-top: 1px solid #707070;
    border-bottom: 1px solid #707070;
    width: 25%;
    padding: 8px 0;
}

.rental-wifi-2 table td{
    text-align: center;
    border-left: 1px solid #707070;
    border-bottom: 1px solid #707070;
    border-top:none;
    width: 25%;
    padding: 8px 0;
    color: #707070;
}
.rental-wifi-2 table td:last-child{
    border-right: 1px solid #707070;
}
@media only screen and (max-width: 768px) {
    .rental-wifi-2 table th{
        border-bottom: unset;
    }
    .rental-wifi-2 table td{
        border-left: 1px solid #707070;
        border-right: unset;
        border-top: 1px solid #707070;
        border-bottom: unset;
    }
    .rental-wifi-2 table tr:last-child td:last-child{
        border-bottom: 1px solid #707070;
    }
    .rental-wifi-2 table th, .rental-wifi-2 table td {
        font-size: 16px;
        width: 15%;
    }
}
.rental-wifi-3 {
    margin: 3rem 0 1rem;
}
.rental-wifi-3 table{
    width: 100%;
    border-collapse:separate;
    border-spacing: 0;
}
.rental-wifi-3 table th,.rental-wifi-3 table td{
    font-size: 20px;
    color: #707070;
    font-weight: bold;
}

.rental-wifi-3 table th:last-child{
    border-right: 1px solid #707070;
}

.rental-wifi-3 table th{
    text-align: center;
    color:white;
    background: #2F5B74;
    border-left: 1px solid #707070;
    border-top: 1px solid #707070;
    border-bottom: 1px solid #707070;
    width: 50%;
    padding: 8px 0;
}

.rental-wifi-3 table td{
    text-align: center;
    border-left: 1px solid #707070;
    border-bottom: 1px solid #707070;
    border-top:none;
    width: 50%;
    padding: 8px 0;
    color: #707070;
}
.rental-wifi-3 table td:last-child{
    border-right: 1px solid #707070;
}
@media only screen and (max-width: 768px) {
    .rental-wifi-3 table th, .rental-wifi-3 table td {
        font-size: 16px;
    }
}

/*▲▲ RENTAl END ▲▲*/



/*▼▼ Solution Service ▼▼*/

.solution-service ul{
    display: grid;
    grid-template-columns: repeat(5, 180px);
    gap: 20px;
    justify-content: center;
}
@media only screen and (max-width: 1024px) {
    .solution-service ul{
        grid-template-columns: repeat(4, 180px);
    }
}
@media only screen and (max-width: 768px) {
    .solution-service ul{
        grid-template-columns: repeat(2, 160px);
    }
}
@media only screen and (max-width: 320px) {
    .solution-service ul{
        grid-template-columns: repeat(2, 140px);
    }
}
.solution-service ul {
    margin: 0 1rem;
}
.service-container {
    margin: 1rem 0;
    display: flex;
}
@media only screen and (max-width: 768px) {
    .service-container{
        width: 100%;
    }
}

.service-container img{
    height: 150px;
}
.service-container a{
    display: flex;
    flex-direction: column;
    align-items: center;
}
.service-container h3{
    flex: 1;
    height: 100%;
    min-height: 0;
    font-size: 16px;
    color: #3B4043;
    margin-top: 16px;margin-bottom: 16px;
    font-weight: bold;
    position: relative;
}
.icon-link:after {
    content: '';
    background-image: url(assets/images/link_window_icon.png);
    height: 18px;
    background-size: cover;
    width: 18px;
    display: inline-block;
    background-position-y: 2px;
    background-repeat: no-repeat;
    background-position-x: 2px;
}
.service-container p{
    flex: 2;
    height: 100%;
    min-height: 0%;
    font-size: 14px;
    margin:  0 0;
    color: #3D3D3D;
}
.service-container a h3{
    display: flex;
    align-items: center;
    text-align: center;
}
/*▲▲ Solution Service  END ▲▲*/

/*▼▼ Solution Subpage Background Images ▼▼*/
/* office */
.document_sol_bg {
    background: url(assets/images/office-solution/office-sol-document/solution_document_background.jpg);
    background-position: center;
    background-size: cover;
}
.audiovisual_it_sol_bg {
    background: url(assets/images/office-solution/office-sol-audiovisual/);
    background-position: center;
    background-size: cover;
}
.cost_reduction_sol_bg {
    background: url(assets/images/office-solution/office-sol-cost_reduction/cost_reduction_background.jpg);
    background-position: center;
    background-size: cover;
}
.customer_service_communication_sol_bg {
    background: url(assets/images/office-solution/office-sol-customer_service_communication/);
    background-position: center;
    background-size: cover;
}
.office_design_sol_bg {
    background: url(assets/images/office-solution/office-sol-design/office_design_background.jpg);
    background-position: center;
    background-size: cover;
}
.office_design_sol_bg .subhead_text h1, .office_design_sol_bg .subhead_text span{
    color: #0B0B0B;
}
.network_security_sol_bg {
    background: url(assets/images/office-solution/office-sol-network_security/network_security_background.jpg);
    background-position: center;
    background-size: cover;
}
.office_comprehensive_support_sol_bg {
    background: url(assets/images/office-solution/office-sol-office_comprehensive_support/);
    background-position: center;
    background-size: cover;
}
.office_it_sol_bg {
    background: url(assets/images/office-solution/office-sol-office_it/office_it_background.jpg);
    background-position: center;
    background-size: cover;
}
.countermessure_sol_bg {
    background: url(assets/images/office-solution/office-sol-prevention/prevention_background.jpg);
    background-position: center;
    background-size: cover;
}

/* store */
.sound_system_sol_bg {
    background: url(assets/images/office-solution/store-solution/store-sol-sound_system/);
    background-position: center;
    background-size: cover;
}
.pos_register_sol_bg {
    background: url(assets/images/office-solution/store-solution/store-sol-pos_register/);
    background-position: center;
    background-size: cover;
}
.order_system_sol_bg {
    background: url(assets/images/office-solution/store-solution/store-sol-order_system/);
    background-position: center;
    background-size: cover;
}
.camera_signage_sol_bg {
    background: url(assets/images/office-solution/store-solution/store-sol-camera_signage/);
    background-position: center;
    background-size: cover;
}
.general_communication_sol_bg {
    background: url(assets/images/office-solution/store-solution/store-sol-general_communication/);
    background-position: center;
    background-size: cover;
}
.sales_promotion_sol_bg {
    background: url(assets/images/office-solution/store-solution/store-sol-sales_promotion/);
    background-position: center;
    background-size: cover;
}
.contact_bg {
    background: url(assets/images/contact_background.jpg);
    background-position: center;
    background-size: cover;
}
.contact_bg .subhead_text {
    color: #707070;
}
/* Rentals */
.rental_sol_bg {
    background: url(assets/images/rental-solution/rental_solution_background.jpg);
    background-position: center;
    background-size: cover;
}
/* NEWS */
.news_sol_bg {
    background: url(assets/images/news_background.jpg);
    background-position: center;
    background-size: cover;
}
@media only screen and (max-width: 768px) {
    .news_sol_bg {
        background: url(assets/images/news_background_mobile.jpg);
        background-position: center;
        background-size: cover;
    }
}

/*▲▲  END ▲▲*/

/*▼▼ Store Solution ▼▼*/
.solution-store ul li a{
    height: 320px;
}
@media only screen and (max-width: 768px) {
    .solution-store ul li a{
        height: unset;
    }
}
.store_sol_bg {
    background: url(assets/images/store-solution/store_solution_background.jpg);
    background-position: center;
    background-size: cover;
}
/* .solution-documment .service-container a {
    height: ;
} */
/*▲▲ Store Solution END ▲▲*/

/*▼▼ NEWS ▼▼*/
.news-container {
    color: #707070;
    padding: 0 20px;
}
.news-container h1{
    color: #707F89;
   font-size: 38px;
}
.news-container h2{
    color: #707F89;
   font-size: 28px;
}
.news-container time{
    color: #3B4043;
}
.news-container p{
    color: #3B4043;
   font-size: 16px;
   /* letter-spacing: ;
   line-height: ; */
}
.archive-news {
    margin: 0 auto;
    padding: 0 1rem;
}
.news-item {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.news-list:nth-child(2n+1) .news-item { flex-direction: row; }         /* 奇数番目は左から右へ並べる */
.news-list:nth-child(2n  ) .news-item { flex-direction: row-reverse; } /* 偶数番目は右から左へ並べる */

.news-item__thumbnail, .news-item__content {
    width: 48%;
    margin-bottom: 3rem;
}
@media only screen and (max-width: 768px) {
    .news-item__thumbnail {
        margin-bottom: 1rem;
    }
    .news-item__thumbnail, .news-item__content {
        width: 100%;
    }
}
.news-item__thumbnail img {
    object-fit: cover;
    height: 250px;
    width: 100%;
}
@media only screen and (max-width: 768px) {
    .news-item__thumbnail img {
        object-fit: cover;
        height: 200px; width: 100%;
    }
}
.news-item__content {
    padding: 0.5rem;
    display: flex;
    flex-direction: column;
}
.news-item__content-title {
    padding-bottom: 1rem;
}
.news-item__content-bottom {
    width: 100%;
    display: flex;
    justify-content: space-between;
    margin-top: auto;
}
.news-item__content-lower {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
}
.news-item__category-icon {
    color: #fff;
    background: #6a6a6a;
    padding: 0 1.5rem;
    margin-bottom: 1rem;
}
.news-item_read-more {
    height: 60px; width: 240px;
    margin-top: auto; margin-left: auto;
    display: flex;
    background: linear-gradient(346.5deg, rgba(220,226,244,1) 50%, rgba(235,240,255,1) 50%);
    align-items: center; justify-content: center;
    color: #707070;
    box-shadow: 3px 3px 4px rgb(0 0 0 / 15%);
    margin-right: 1rem;
}
@media only screen and (max-width: 768px) {
    .news-item_read-more {
        height: 50px; width: 160px;
        margin-right: unset;
    }
}
/* final */
.news-list-new {
    border-bottom:1px solid #707070;
    display: flex;
    width: 80%;
    margin: 0 auto;
    padding: 1rem;
}
.news-list-new:last-of-type {
    border-bottom: none;
}
.news-list-new h3{
    margin:0 8px;
    color: #2F5B74;
    font-size: 14px;
}
.news-list-new span{
    color: #363434;
    font-size: 14px;
}
.news-item__entry-date-new {
    padding-right: 1rem;
    border-right: 1px solid #707070;
}
@media only screen and (max-width: 768px) {
    .news-list-new {
        width: unset;
        margin: 0;
        padding: 1rem;
    }
    .news-list-new h3{
        margin:0 8px;
        color: #2F5B74;
        font-size: 14px;
    }
    .news-list-new span{
        color: #363434;
        font-size: 14px;
    }
    .news-item__entry-date-new {
        padding-right: 1rem;
        border-right: 1px solid #707070;
    }
}
.pagination_cont {
    margin: 0 auto;
}
.pagination {
    clear: both;
    padding: 20px 0;
    position: relative;
    font-size: 14px;
    line-height: 14px;
  }
  .pagination span, .pagination a {
    display: block;
    float: left;
    width: auto;
    margin: 2px 12px 2px 12px;
    padding: 6px 9px 5px 9px;
    text-decoration: none;
  }
  .pagination a:hover {
    opacity: 0.7;
  }
.page-numbers {
    color: #98A6B5;
    font-size: 18px;
}
.pagination .current {
    color: #496F85;
    font-size: 18px;
}
.nav-links {
    display: flex;
    width: 100%;
    margin: 0 auto;
    justify-content: center;
}
.nav-links ul{
    display: flex;
    justify-content: center;
    align-items: center;
}

.pagination .next, .pagination .prev {
    color: #496F85;
    padding: 7px;
    border: 2px solid #496F85;
    border-radius: 20%;
    height: 20px;
    width: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    font-weight: bold;
}
/*▲▲ NEWS ▲▲*/

/*▼▼ ABOUT  ▼▼*/
.about_us_bg {
    background: url(assets/images/about-us/about-us-background.jpg);
    background-position: center;
    background-size: cover;
}
.about-2-col {
    display: flex;
    justify-content: space-between;
    margin-top: 50px;
}
.about-col-left {
    width: 25%;
}
.about-col-right {
    width: 75%;
    padding-left: 3rem;
}
.about-col-right .about-speach p{
    line-height: 2;
    margin: 0;
}

@media only screen and (max-width: 768px) {
    .about-2-col {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }
    .about-col-left {
        width: 80%;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }
    .about-col-right {
        width: 100%;
        padding-left: 0;
    }
    .about-col-right .about-speach p{
        line-height: 2;
        margin: 0;
    }
}
.about-col-left-2, .about-col-right-2 {
    width: 48%;
}
@media only screen and (max-width: 768px) {
    .about-col-left-2, .about-col-right-2 {
        width: 100%;
        margin-bottom: 3rem;
    }
}
.about-col-left p {
    line-height: unset;
}
.about-info {
    font-size: 16px;
    color: #707070;
}
.about-info th {
    border-right: 1px solid #707070;
    border-bottom: 1px solid #707070;
    width: 120px;
    padding:6px 0 6px;
}
.about-info tr:last-child th:last-of-type {
    border-bottom: none;
}
.about-info td {
    border-bottom: 1px solid #707070;
    padding: 6px 8px;
}
.about-info tr:last-child td:last-child {
    border-bottom: none;
}

.company-timeline{
    position: relative;
    width: 100%;
    margin: 0 auto;
    list-style-type: none;
}
.company-timeline li {
    margin-bottom: 58px;
    position: relative;
    display: flex;
    justify-content: left;
}
.company-timeline li p{
    margin-left: 7rem;
}
.company-timeline::before{
    position: absolute;
    left: 42px;
    top: 0;
    content: '';
    display: block;
    width: 2px;
    height: 95%;
    margin-left: -3px;
    background: rgb(147 147 147);
    z-index: 1;
}
.company-timeline div {
    position: relative;
}
.company-timeline div .year {
    color: #fff;
    background-color: #2F5B74;
    width: 79px;
    height: 79px;
    border-radius: 50%;
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
    top: 0;
}

/*▲▲ ABOUT END ▲▲*/


/*▼▼ RECRUIT ▼▼*/
.recruit_bg {
    background: url(assets/images/recruit/recuit_background.jpg);
    background-position: center;
    background-size: cover;
}
.recruit_newgraduate_bg {
    background: url(assets/images/recruit/recuit_background_new.jpg);
    background-position: center;
    background-size: cover;
}
.recruit_career_change_bg {
    background: url(assets/images/recruit/recuit_background_change.jpg);
    background-position: center;
    background-size: cover;
}
.recruit_career_change_bg .subhead_text {
    color:#221E1E;
}
.welcome-speach {
    padding: 0 1rem;
}
.welcome-speach h2{
    text-align: center;
    font-size: 24px;
    color: #707070;
    letter-spacing: 0.35rem;
}
.welcome-speach p{
    text-align: center;
    letter-spacing: 0.25rem;
    line-height: 1.75rem;
}
@media only screen and (max-width: 768px) {
    .welcome-speach h2{
        font-size: 18px;
        letter-spacing: 0.25rem;
        line-height: 2rem;
    }
    .welcome-speach p{
        font-size: 16px;
        letter-spacing: 0.1rem;
        line-height: 1.9rem;
    }
}
.recruit-about-company {
    position: relative;
    display: flex;
    flex-wrap: wrap;
}
.recruit-about-company-left, .recruit-about-company-right {
    width: 50%;
}
@media only screen and (max-width: 768px) {
    .recruit-about-company-left, .recruit-about-company-right {
        width: 100%;
    }
    .recruit-about-company-left {
        margin:0 1rem;
    }

}
.recruit-about-company-left img{
    max-width: unset;
}
@media only screen and (max-width: 768px) {
    .recruit-about-company-left{
        height: 300px;
        background: url(assets/images/recruit/recruit-about-company.jpg);
        background-position: center;
    }
    .recruit-about-company-left img{
        max-width: inherit;
    }
}
.triangle::before {
    content: "";
    position: absolute;
    top: 0;
    left: 110px;
    width: 100%;
    height: 100%;
    background: linear-gradient(312deg, rgba(47,91,116,1) 50%, rgba(0,0,0,0) 50%);
}

.recruit-mission-img {
    position: relative;
    overflow: hidden;
}
@media only screen and (max-width: 768px) {
    .recruit-mission-img {
        background-size: cover;
        background-color: #305b74;
    }
}

.recruit-mission-img::before {
    content: "";
    position: absolute;
    top: 0;
    left: 30%;
    width: 100%;
    height: 100%;
    background: linear-gradient(304deg, rgba(47,91,116,1) 50%, rgba(0,0,0,0) 50%);
}
.recruit-mission-img::before {
    left: 33%;
}
.recruit-mission-text {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    text-align-last: right;
    text-align: -webkit-right;
    display: flex;
    align-items: end;
    justify-content: space-between;
    flex-direction: column;
}
.recruit-mission-text h2{
    font-size: 38px;
    color: #FFFFFF;
    font-weight: bold;
    margin: 3rem 1.8rem;
    max-width: 900px;
    line-height: 2.5rem;
    letter-spacing: 0.3rem;
}
.recruit-mission-text h3{
    font-size: 18px;
    color: #FFFFFF;
    font-weight: bold;
    margin: 1.8rem;
    max-width: 900px;
    line-height: 2.5rem;
    letter-spacing: 0.3rem;
}
@media only screen and (max-width: 768px) {
    .recruit-mission-text h2{
        font-size: 28px;
        margin: 1rem 1.8rem;
    }
    .recruit-mission-text h3{
        font-size: 16px;
        line-height: 2.5rem;
        margin:0 1rem 8px;
    }
}
@media only screen and (max-width: 375px) {
    .recruit-mission-text h3{
        line-height: 2rem;
        letter-spacing: unset;
        margin:0 1rem 8px 0;
    }
}
.recruit-about-company-right {
    background: #F5F5F5;
    display: flex;
    flex-flow: column;
    justify-content: space-evenly;
    align-items: center;
}
.recruit-about-company-right h2{
   color: #2F5B74;
   font-size: 26px;
   margin: 1rem;
   font-weight: bold;
}
.recruit-about-company-right p{
   color: #707070;
   font-size: 16px;
   line-height: 1.75;
   margin: 0 1rem;
}
@media only screen and (max-width: 768px) {
    .recruit-about-company-right p{
        margin: 0 16px;
    }
}

.recruit-about-cta {
    width: 100%; height: 60px; max-width: 247px;
    margin: 3rem auto;
    display: flex;
    background: linear-gradient(346.5deg, rgba(220,226,244,1) 50%, rgba(235,240,255,1) 50%);
    align-items: center;
    justify-content: center;
    color: #707070;
    box-shadow: 3px 3px 4px rgb(0 0 0 / 15%);
}
.recruit-about-cta h3{
    color: #707070;
}
@media only screen and (max-width: 768px) {
    .recruit-about-cta {
        margin: 2rem;
    }
}
.recruit-bgd{
    width: 100%;
    margin:50px 0;
}
.recruit-banner {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    border: 1px solid #707070;
    margin: 1rem;
    margin-bottom: 60px;
    box-shadow: 3px 3px 4px rgb(0 0 0 / 15%);
}
.recruit-banner-img, .recruit-banner-text {
    width: 48%;
}
@media only screen and (max-width: 768px) {
    .recruit-banner {
        margin: 0 1rem 2rem;
    }
    .recruit-banner-img, .recruit-banner-text {
        width: 100%;
        text-align: center;
    }
}
.recruit-tags {
    display: flex;
    margin-bottom: 1rem;
}
.recruit-tags span{
    color: #fff;
    background: #6a6a6a;
    padding: 0 1.5rem;
    margin-right: 1rem;
}
.recruit-banner-text {
    padding: 1rem;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
}
.recruit-banner-text h2 {
    font-size: 24px;
    font-weight: bold;
    margin: 2rem 0;
    color: #605D5D;
}
.recruit-banner-cta {
    width: 100%; height: 60px; max-width: 247px;
    display: flex;
    background: linear-gradient(346.5deg, rgba(220,226,244,1) 50%, rgba(235,240,255,1) 50%);
    align-items: center;
    justify-content: center;
    color: #707070;
    box-shadow: 3px 3px 4px rgb(0 0 0 / 15%);
    margin-left: auto;
}
.recruit-banner-cta h3{
    color: #707070;
}
@media only screen and (max-width: 768px) {
    .recruit-banner-cta {
        margin:0 auto;
    }
}
@media only screen and (max-width: 768px) {
    .order-1 {
        order: 1;
    }
    .order-2 {
        order: 2;
    }

}
.requirements {
    max-width: 900px;
    margin: 0 auto;
}
.recruit-subheader {
    max-width: 500px;
}
.requirements-cat {
    border-bottom: 1px solid #707070;
    margin-bottom: 1rem;
}
.requirements-cat:last-child{
    border-bottom: none;
}
.requirements-cat h3 {
    font-size: 18px;
    font-weight: bold;
    color: #707070;
}
.requirements-cat p {
    font-size: 18px;
    margin: unset;
    margin-bottom: 1rem;
    color: #707070;
}
@media only screen and (max-width: 768px) {
.recruit-sub-banner {
 margin: 0 0 2rem;
}
}
/*▲▲ RECRUIT END ▲▲*/


/*▼▼ お問い合わせ ▼▼*/
.contact {
    margin: 0 auto;
}
/*ContactForm7カスタマイズ*/

table.CF7_table{
	width:80%;
	margin:0 auto;
}
.single .entry-content table.CF7_table,
.page .entry-content table.CF7_table{
	display:table;
}

/*入力欄*/
.CF7_table input, .CF7_table textarea {
    border: 1px solid #CDD6DD;
    padding: 6px;
    width: 100%;
}
.CF7_table .flex-check input {
    width: unset;
    margin-right: 8px;
}

.CF7_table ::placeholder {
	color:#797979;
}

/*「必須」文字*/
.CF7_table tbody {
    margin: 0 auto;
}
.CF7_table tbody tr th {
    width: 30%;
    color: #707F89;
    font-weight: bold;
}
.CF7_table tbody tr td {
    width: 65%;
}
@media only screen and (max-width: 768px) {
    .CF7_table tbody tr th {
        width: 100%;
        color: #707F89;
    }
    .CF7_table tbody tr td {
        width: 100%;
    }
}
.CF7_table .flex-check {
   display: flex;
}
.CF7_table .flex-check .first label, .CF7_table .flex-check .last label {
   display: flex;
   width: 100%;
   align-items: center;
   padding: 6px;
}
.CF7_req{
	font-size:.9em;
	padding: 5px;
	background: #f79034;/*オレンジ*/
	color: #fff;
	border-radius: 3px;
	margin-right:1em;
}
.CF7_table tr

/*「任意」文字*/
.CF7_unreq{
	font-size:.9em;
	padding: 5px;
	background: #bdbdbd;/*グレー*/
	color: #fff;
	border-radius: 3px;
	margin-right:1em;
}
.CF7_table th {
    text-align: inherit;
    text-align: -webkit-auto;
}
/* タイトル列 */
@media screen and (min-width: 768px){
	.CF7_table th{
	width:30%;/*横幅*/
	padding: 1rem;
	}
}

/* レスポンシブ */
@media screen and (max-width: 768px){
	table.CF7_table{
	width:95%;
	}
	.CF7_table tr, .CF7_table td, .CF7_table th{
	display: block;
	width: 100%;
    line-height:2.5em;
    text-align: left;
    text-align: -webkit-left;
	}
	/* .CF7_table th{
	background-color:#ebedf5;
	} */
}

.CF7_btn{
	text-align:center;
	margin-top:20px;
}

.wpcf7-spinner{
	width:0;
	margin:0;
}

.CF7_table tbody tr:last-child th:last-of-type {
    vertical-align: text-top;
}
.CF7_table input {
    display: inline;
}

.CF7_table input[type="text"]:focus {
    outline: none;
    box-shadow: 0px 0px 5px #61C5FA;
    border:1px solid #5AB0DB;
}
.CF7_table input[type="text"]:focus:hover {
    outline: none;
    box-shadow: 0px 0px 5px #61C5FA;
    border:1px solid #5AB0DB;
    border-radius:0;
}
.CF7_table .wpcf7-select{
    border: 1px solid #CDD6DD;
    padding: 6px;
    width: 100%;
    width: 102.5%;
}

.wpcf7-submit {
    width: 100%;
    height: 60px;
    max-width: 247px;
    display: flex;
    background: linear-gradient(346.5deg, rgba(220,226,244,1) 50%, rgba(235,240,255,1) 50%);
    align-items: center;
    justify-content: center;
    color: #707070;
    box-shadow: 3px 3px 4px rgb(0 0 0 / 15%);
    margin: 0 auto;
    border: none;
}
/*▲▲ お問い合わせ END ▲▲*/

/*▼▼ 下層ページ共通 ▼▼*/
.page_main_header .inner {
    max-width: 1010px;
    width: 100%;
    margin: 0 auto;
}

.page_main_header .inner .subhead_text {
    color: #2F5B74;
    text-align: left;
}

.page_main_header .inner .subhead_text h1 {
    font-size: 60px;
    font-family: 'Noto Sans JP';
    font-weight: 400;
    line-height: 1.1;
}

.page_main_header .inner .subhead_text span {
    display: block;
    margin-top: 10px;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: .2em;
}

#breadcrumbs.blue {
    font-size: 12px;
    font-weight: bold;
    color: #2F5B74;
}

.page_main_heading {
    margin-bottom: 50px;
    padding: 0 20px;
}

.page_main_heading .inner {
    max-width: 1010px;
    width: 100%;
    margin: 0 auto;
}

.page_main_heading .inner .box {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}

.page_main_heading .inner .box .heading {
    font-size: 38px;
    font-weight: bold;
    color: #2F5B74;
}

.page_main_heading .inner .box p {
    font-size: 14px;
    line-height: calc(20 / 14);
}

.page_main_heading .inner .box + .btn_box {
    margin-top: 30px;
}


.btn_box a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 200px;
    height: 50px;
    background-color: #2B404C;
    font-size: 14px;
    letter-spacing: .01em;
    line-height: 1.5;
    color: #FFFFFF;
    transition: .3s;
}

.btn_box.right {
    display: flex;
    justify-content: flex-end;
}

.breadcrumb_box {
    max-width: 1024px;
    margin: 0 auto;
    margin-bottom: 50px;
}

.check_list li {
    position: relative;
    padding-left: 1.5em;
    font-size: 14px;
    line-height: 2.1;
}

.check_list li::before {
    position: absolute;
    top: 0;
    left: 0;
    font-family: "Font Awesome 5 Free";
    content: "\f058";
    color: #2F5B74;
    /* line-height: 1.5; */
}

.page_cta {
    background-color: #F7F7F7;
}

.page_cta .inner {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 40px;
    padding: 60px 20px 50px;
}

.page_cta .inner .btn_cta {
    max-width: 384px;
    width: 100%;
}

.page_cta .inner .btn_cta a {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    /* max-width: 384px; */
    width: 100%;
    height: 76px;
    border-radius: 100px;
    border: 2px solid #EA3D4C;
    box-sizing: border-box;
    font-size: 16px;
    font-weight: bold;
}

.page_cta .inner .btn_cta a::before {
    position: absolute;
    top: 50%;
    right: 20px;
    content: "";
    display: block;
    width: 5px;
    height: 5px;
    border-right: 2px solid;
    border-bottom: 2px solid;
    transform: translateY(-50%) rotate(-45deg);
}

.page_cta .inner .btn_cta.cta_red a {
    color: #fff;
    background-color: #EA3D4C;
}

.page_cta .inner .btn_cta.cta_red a::before {
    border-color: #fff;
}

.page_cta .inner .btn_cta.cta_white a {
    color: #EA3D4C;
    background-color: #fff;
}

.page_cta .inner .btn_cta.cta_white a::before {
    border-color: #EA3D4C;
}


@media screen and (max-width: 768px){
    .design_marketing_bg {

    }

    .page_main_heading .inner .box {
        flex-direction: column;
        align-items: center;
        gap: 30px;
    }

    .page_main_heading .inner .box .heading {
        font-size: 28px;
    }

    .page_main_header .inner .subhead_text h1 {
        font-size: 45px;
    }
    .page_main_header .inner .subhead_text span {
        font-size: 16px;
    }

    .page_cta .inner {
        flex-direction: column;
        gap: 20px;
        padding: 50px 20px 40px;
    }
}

/*▲▲ 下層ページ共通 END ▲▲*/

/*▼▼ デザイン・マーケティング ▼▼*/
.design_marketing_bg {
    background-image: url(./assets/images/design_marketing/page_main.png);
    background-position: center;
    background-size: cover;
}

.gray_bg_content {
    background-color: #F2F2F2;
}

.gray_bg_content .inner {
    max-width: 1010px;
    width: 100%;
    margin: 0 auto;
    padding: 30px 20px 46px;
    box-sizing: border-box;
}

.gray_bg_content .inner h2 {
    color: #2F5B74;
    text-align: center;
    font-size: 24px;
    font-weight: bold;
    line-height: calc(36 / 24);
    letter-spacing: .01em;
}

.gray_bg_content .inner p {
    margin-top: 20px;
    text-align: center;
    font-size: 14px;
    line-height: calc(20 / 14);
    letter-spacing: .01em;
}

.gray_bg_content .inner .check_content {
    margin-top: 30px;
}

.gray_bg_content .inner .check_content h3 {
    color: #2F5B74;
    text-align: center;
    font-size: 18px;
    font-weight: bold;
    line-height: calc(36 / 18);
    letter-spacing: .01em;
}

.gray_bg_content .inner .check_content .list_box {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 50px;
    margin-top: 20px;
}

.gray_bg_content .inner .check_content .list_box img {
    width: 224px;
}

.free_section {
    margin-top: 62px;
    padding: 0 20px;
}

.menu_section {
    margin-top: 90px;
    margin-bottom: 50px;
    padding: 0 20px;
}

.faq_section {
    margin: 90px 0 160px;
}

.faq_section .inner {
    padding: 0 20px;
    box-sizing: border-box;
}

.faq_section .inner .faq_box {
    padding: 20px;
    border: 1px solid #707070;
}

.faq_section .inner .faq_box:not(:first-of-type) {
    margin-top: 20px;
}

.faq_section .inner .faq_box dt {
    font-size: 18px;
    font-weight: bold;
    color: #2F5B74;
    cursor: pointer;
}

.faq_section .inner .faq_box dt::before {
    content: "Q. ";
}

.faq_section .inner .faq_box dd {
    display: none;
    margin-top: 10px;
    font-size: 14px;
}

.faq_section .inner .faq_box dd::before {
    content: "A. ";
}


@media screen and (max-width: 768px){
    .gray_bg_content .inner .check_content .list_box {
        flex-direction: column;
        gap: 20px;
    }

    .faq_section {
        margin: 60px 0 120px;
    }

}
/*▲▲ デザイン・マーケティング END ▲▲*/


/*▼▼ DX・AI SOLUTION ▼▼*/
.aidx_solution_bg {
    background-image: url(./assets/images/dx_ai_solution/page_main.png);
    background-position: center;
    background-size: cover;
}

/*▲▲ DX・AI SOLUTION END ▲▲*/



/*▼▼ OFFICE SOLUTION ▼▼*/
.office_solution_bg {
    background-image: url(./assets/images/office_solution/page_main.png);
    background-position: center;
    background-size: cover;
}
/*▲▲ OFFICE SOLUTION END ▲▲*/


/*▲▲▲ SUBPAGE END ▲▲▲*/


/*▼▼  ▼▼*/
/*▲▲  END ▲▲*/