@charset "UTF-8";
/*
	Theme Name: ベストパートナー（イノセントを改変）
	Author: KIHARA
	Description: 
	Version: 6.4.2
	*/

body {
    font-family: "Marcellus", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
    margin: 0px;
}

main,
html {
    margin: 0px;
    padding: 0px;
}

/* utility */
@media screen and (min-width: 600px) {
    .sp-display {
        display: none !important;
    }
}

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

/* ヘッダー */

.site_header {
    height: 120px;
    width: 100%;
    position: fixed;
    top: 0;
    z-index: 200;
}

@media screen and (min-width: 1010px) {
    .site_header {
        background-color: rgba(255, 255, 255, 0.7);
    }
}

@media screen and (max-width: 1009px) {
    .site_header {
        width: 250px;
    }
}

div.wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 120px;
}

.w-container {
    width: min(92%, 1166px);
    margin: auto;
}

div.logo img {
    width: 240px;
    height: auto;
    margin-left: 30px;
}

div.logo img.footer_logo {
    width: 240px;
    height: auto;
    margin-left: 0px;
}

ul li a span img {
    width: 28px;
    height: auto;
    margin-right: 5px;
}

ul li a span img.tag {
    width: 20px;
}

@media screen and (min-width: 1010px) {
    nav#g_navi {
        display: flex !important;
        flex-direction: row;
        justify-content: flex-end;
    }

    ul.nav {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap;
        width: 700px;
        height: 120px;
    }

    ul.nav li {
        width: 100px;
        text-align: center;
    }

    ul.nav li:last-child {
        width: 100px;
        text-align: center;
    }

    ul.nav li:nth-of-type(n + 1):nth-of-type(-n + 5) {
        margin-top: 5px;
    }

    ul.nav li:nth-of-type(2) {
        width: 180px;
    }

    ul.nav li:nth-of-type(n + 6):nth-of-type(-n + 8) {
        width: 180px;
        margin-top: -27px;
    }

    ul.nav li a {
        font-size: 15px;
        color: #2e2485;
    }

    ul.nav li a.nav_contact {
        display: block;
        background: linear-gradient(120deg, #2e2485, #080d41);
        color: #ffffff;
        height: 120px;
        box-sizing: border-box;
        text-align: center;
        line-height: 120px;
        margin-top: -4px;
        width: 105px;
        font-size: 15px;
    }

    ul li a span img.tag {
        margin-top: -6px;
    }

    .nav_contact_btn {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    div.nav_contact_btn > a > span {
        display: block;
        width: 60px;
        margin: 20px auto 0px;
    }

    div.nav_contact_btn > a > span img {
        display: block;
        width: 60px;
        height: auto;
    }
}

@media screen and (min-width: 1165px) {
    ul.nav {
        width: 780px;
    }

    ul.nav li:last-child {
        width: 160px;
        font-size: 24px;
    }

    ul.nav li a.nav_contact {
        width: 160px;
        font-size: 24px;
    }

    ul.nav li a {
        font-size: 24px;
    }
}

@media screen and (max-width: 1009px) {
    div.wrapper {
        width: 50%;
    }
}

/* Top_メインイメージ */

.main_imgBOX {
    position: relative;
    width: 100%;
    height: 450px;
    overflow: hidden;
    margin-top: 120px;
}

@media screen and (min-width: 450px) {
    .main_imgBOX {
        width: 80%;
        margin-left: 20%;
        height: 665px;
    }
}

.main_img {
    opacity: 0;
    width: 100%;
    height: 450px;
    background-image: url(img/MV1.jpg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 10;
    -webkit-animation: anime 18s 0s infinite;
    animation: anime 18s 0s infinite;
}

@media screen and (min-width: 450px) {
    .main_img {
        height: 665px;
    }
}

.main_img:nth-of-type(2) {
    -webkit-animation-delay: 6s;
    animation-delay: 6s;
    background-image: url(img/MV2.jpg);
}

.main_img:nth-of-type(3) {
    -webkit-animation-delay: 12s;
    animation-delay: 12s;
    background-image: url(img/MV3.jpg);
}

@keyframes anime {
    0% {
        opacity: 0.5;
    }
    2% {
        opacity: 1;
    }
    85% {
        opacity: 1;
    }
    95% {
        opacity: 0;
        transform: scale(1.2);
        z-index: 9;
    }
    100% {
        opacity: 0;
    }
}

.kv2 {
    position: absolute;
    top: 750px;
    left: 0px;
    width: 100%;
    background-image: url(img/ex_blue.png);
    background-position: center;
    background-size: cover;
    z-index: 1;
}

@media screen and (min-width: 581px) and (max-width: 1150px) {
    .kv2 {
        top: 650px;
        width: 90%;
    }
}

@media screen and (min-width: 1151px) {
    .kv2 {
        top: 468px;
        width: 90%;
    }
}

@media screen and (max-width: 450px) {
    .kv2 {
        top: 500px;
    }
}

div.letter h2,
div.main_imgBOX p {
    color: #ffffff;
}

div.letter > h2 {
    margin-top: 150px;
    margin-left: 20%;
    font-family: "Noto Serif JP", serif;
    font-size: clamp(22px, 5vw, 56px);
    line-height: 60px;
    position: absolute;
    top: 200px;
    z-index: 150;
}

@media screen and (max-width: 450px) {
    div.letter > h2 {
        margin-left: 0px;
        margin-top: 100px;
    }
}

@media screen and (min-width: 450px) and (max-width: 1120px) {
    .brpc-display {
        display: none;
    }
}

@media screen and (min-width: 821px) and (max-width: 1198px) {
    div.letter > h2 {
        margin-top: 150px;
        margin-left: 20%;
        line-height: 85px;
    }
}

@media screen and (min-width: 1199px) {
    div.letter > h2 {
        margin-top: 260px;
        margin-left: 150px;
        line-height: 85px;
    }
}

@media screen and (max-width: 551px) {
    div.letter > h2 {
        line-height: 40px;
    }
}

div.letter p {
    font-family: "Noto Serif JP", serif;
    word-wrap: break-word;
    position: absolute;
    top: 570px;
    line-height: 1.7rem;
    margin-left: 0px;
    z-index: 150;
    color: #ffffff;
    font-size: 14px;
}

@media screen and (min-width: 583px) {
    div.letter p {
        margin-left: 20%;
        top: 780px;
    }
}

@media screen and (min-width: 1199px) {
    div.letter p {
        top: 800px;
        margin-left: 155px;
    }
}

/* Top_Product取扱商品 */

section.product {
    margin: 200px auto 0px auto;
}

@media screen and (min-width: 450px) {
    section.product {
        margin: 350px auto 0px auto;
    }
}

.w-container {
    width: (92%, 1140px);
    margin: auto;
}

h3.heading {
    font-family: "Marcellus", serif;
    color: #2e2485;
    font-size: 55px;
    line-height: 0.8em;
    word-wrap: break-word;
}

h3.heading span {
    font-family: serif;
    color: #000000;
    font-size: 25px;
}

.product_article {
    margin-top: 60px;
}

/*
.product_a {
    pointer-events: none;
}
*/

.no_pointer {
    pointer-events: none;
}

.product_article h4 {
    text-align: center;
    color: #000000;
    margin-top: 15px;
    font-size: 17px;
}

.product_article a:hover {
    opacity: 80%;
}

.product_article figure {
    width: 275px;
    margin: 0px auto;
}

@media screen and (min-width: 696px) {
    .product_article figure {
        width: 300px;
    }
}

.product-container {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 25px;
}

.product_article figure img {
    width: 90%;
    height: 179px;
    display: block;
    margin: 0px auto;
}

@media screen and (min-width: 601px) and (max-width: 1009px) {
    .product-container {
        grid-template-columns: repeat(2, 1fr);
        gap: 32px 25px;
    }
}

@media screen and (min-width: 1010px) {
    .product-container {
        grid-template-columns: repeat(3, 1fr);
    }

    .product_article figure img {
        width: 300px;
        height: 200px;
    }
}

a.button {
    line-height: 4.7rem;
    display: block;
    width: min(100%, 350px);
    height: 80px;
    margin: 62px auto;
    background: linear-gradient(120deg, #2e2485, #080d41);
    text-align: center;
    color: #fff;
    font-size: 17px;
    font-family: "Noto Sans JP", sans-serif;
    overflow: hidden;
    position: relative;
    z-index: 1;
}

@media screen and (max-width: 450px) {
    a.button {
        margin: 50px auto;
    }
}

a.button::after {
    background: linear-gradient(120deg, #665fa2, #60575a);
    position: absolute;
    top: 0;
    left: 0;
    content: "";
    width: 100%;
    height: 100%;
    transform: scale(0, 1);
    transform-origin: left top;
    transition: 0.2s cubic-bezier(0.45, 0, 0.55, 1);
    z-index: -1;
}

a.button:hover::after {
    transform: scale(1, 1);
}

/* Top_AboutUs私たちについて */

section.aboutus {
    margin: 350px auto 0px auto;
}

@media screen and (max-width: 700px) {
    section.aboutus {
        margin: 200px auto 0px auto;
    }
}

@media screen and (max-width: 450px) {
    section.aboutus {
        margin: 100px auto 0px auto;
    }
}

.aboutus_box {
    width: 100%;
    height: 477px;
    margin-top: 167px;
    background-image: url(img/AboutUs_bg.png);
    background-position: center center;
    /* 画像をタイル状に繰り返し表示しない */
    background-repeat: no-repeat;
    /* 表示するコンテナの大きさに基づいて、背景画像を調整 */
    background-size: cover;
}

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

section.aboutus h3 {
    font-family: "Marcellus", serif;
    color: #fff;
    font-size: 55px;
    line-height: 0.8em;
    text-align: right;
    padding-top: 240px;
    text-shadow: #000 2px 2px 3px;
}

@media screen and (min-width: 700px) {
    section.aboutus h3 {
        text-shadow: none;
    }
}

section.aboutus span {
    font-family: serif;
    color: #fff;
    font-size: 25px;
}

p.aboutus_p {
    font-family: serif;
    font-size: 20px;
    font-weight: bold;
    line-height: 1.8;
    margin-top: 93px;
}

@media screen and (min-width: 700px) {
    p.aboutus_p {
        font-size: 30px;
        line-height: 80px;
    }
}

@media screen and (max-width: 450px) {
    p.aboutus_p {
        margin-top: 60px;
    }
}

div.aboutus_summarybox {
    font-family: "Noto Sans JP", sans-serif;
    color: #2e2485;
    font-size: 20px;
    display: flex;
    flex-direction: column;
    margin: 80px auto 120px auto;
}

@media screen and (min-width: 700px) and (max-width: 1050px) {
    div.aboutus_summarybox {
        font-size: 17px;
    }
}

@media screen and (min-width: 700px) {
    div.aboutus_summarybox {
        flex-direction: row;
        justify-content: space-between;
    }
}

@media screen and (max-width: 699px) {
    div.aboutus_summarybox {
        width: 308px;
    }
}

@media screen and (max-width: 450px) {
    div.aboutus_summarybox {
        margin: 80px auto 60px auto;
    }
}

img.aboutus_check {
    width: 36px;
    height: auto;
    text-align: left;
    display: block;
    padding-left: 20px;
    padding-top: 20px;
}

div.aboutus_summary_div {
    width: 308px;
    height: 266px;
    line-height: 3.2rem;
    box-shadow: 3px 3px 3px rgb(0, 0, 0, 0.4);
    margin-bottom: 30px;
}

@media screen and (min-width: 700px) and (max-width: 1050px) {
    div.aboutus_summary_div {
        width: 28vw;
    }
}

div.aboutus_summary_div p.aboutus_summary {
    text-align: center;
    font-weight: bold;
    margin-top: 28px;
}

div.aboutus_summary_div p.aboutus_summary span.string_span {
    font-family: "Noto Sans JP", sans-serif;
    color: #2e2485;
    font-size: 30px;
    font-weight: bold;
}

@media screen and (min-width: 700px) and (max-width: 1050px) {
    div.aboutus_summary_div p.aboutus_summary span.string_span {
        font-size: 23px;
    }
}

div.aboutus_green {
    background-color: #c3e3dd;
}

div.aboutus_blue {
    background-color: #c7d3df;
}

div.aboutus_yellow {
    background-color: #dddbc6;
}

/* Top_NEWS新着情報 */
section.news h3 {
    font-family: "Marcellus", serif;
    color: #2e2485;
    font-size: 55px;
    line-height: 0.8em;
    margin-top: 230px;
    margin-bottom: 30px;
}

section.news span {
    font-family: serif;
    color: #000000;
    font-size: 25px;
}

.news_ul {
    margin-top: 60px;
    margin-bottom: 100px;
}

.news_box {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    border-bottom: solid 1px #707070;
    padding: 37px 0px;
}

ul.news_box:first-of-type {
    border-top: solid 1px #707070;
}

.news_span {
    display: block;
    width: 30%;
    font-family: "Marcellus", serif !important;
    color: #a2a2a2 !important;
    font-size: 17px !important;
    margin-right: 20px;
}

@media screen and (min-width: 1011px) {
    .news_span {
        font-size: 24px !important;
        margin-right: 40px;
    }
}

.news_li {
    font-family: "Noto Sans JP", sans-serif;
    font-size: 17px;
    line-height: 30px;
}

@media screen and (min-width: 1011px) {
    .news_li {
        font-size: 30px;
        line-height: 50px;
    }
}

.news_a {
    display: block;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 17px;
    color: #000000;
    width: 75%;
}

@media screen and (min-width: 1011px) {
    .news_a {
        font-size: 30px;
    }
}

a.recruit_banner:hover {
    opacity: 0.8;
}

/* Top_CONTACTお問い合わせ */
.contact {
    width: 100%;
    height: 760px;
    background-image: url(img/contact_bg.png);
    background-position: top;
    background-repeat: no-repeat;
    background-size: cover;
    margin-top: 130px;
}

@media screen and (max-width: 450px) {
    .contact {
        margin-top: 60px;
        height: 600px;
    }
}

section.contact h3 {
    font-family: "Marcellus", serif;
    color: #fff;
    font-size: 55px;
    line-height: 0.8em;
    padding-top: 100px;
    margin-bottom: 30px;
    text-align: center;
}

section.contact span {
    font-family: serif;
    color: #fff;
    font-size: 25px;
}

div.contact_box {
    background-color: #fff;
    width: (92%, 1016px);
    height: 330px;
    padding-top: 63px;
    box-sizing: border-box;
}

.contact_p {
    text-align: center;
    font-size: 18px;
    font-family: serif;
    padding: 63px, 0px;
}

@media screen and (min-width: 450px) {
    .contact_p {
        font-size: 24px;
    }
}

.contact_flxbox {
    display: flex;
    flex-direction: column;
    margin: 0px auto;
    gap: 15px;
}

@media screen and (min-width: 906px) {
    .contact_flxbox {
        flex-direction: row;
        justify-content: space-around;
        padding-top: 60px;
    }
}

.contact_addressbox {
    display: flex;
    align-items: center;
    gap: 22px;
    margin: 20px auto;
}

.contact_address_div {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.contact_addressbox img {
    width: 78px;
    height: auto;
}

@media screen and (max-width: 500px) {
    .contact_addressbox img {
        width: 50px;
        height: auto;
    }
}

.contact_address_p {
    color: #2e2485;
    font-family: "Marcellus", serif;
    font-size: 30px;
}

@media screen and (max-width: 500px) {
    .contact_address_p {
        font-size: 17px;
    }
}

section.contact .contact_time_span {
    color: #2e2485;
    font-family: "Marcellus", serif;
    font-size: 15px;
}

@media screen and (max-width: 500px) {
    section.contact .contact_time_span {
        font-size: 13px;
    }
}

.contact_button {
    color: #2e2485;
    background-color: #fff;
    font-family: "Marcellus", serif;
    font-size: 30px;
    width: min(92%, 366px);
    height: 88px;
    border: solid 2px #2e2485;
    text-align: center;
    line-height: 88px;
    margin: 0px auto;
    overflow: hidden;
    position: relative;
    z-index: 1;
}

.contact_button::after {
    background: #2e2485;
    position: absolute;
    top: 0;
    left: 0;
    content: "";
    width: 100%;
    height: 100%;
    transform: scale(0, 1);
    transform-origin: left top;
    transition: 0.2s cubic-bezier(0.45, 0, 0.55, 1);
    z-index: -1;
}

.contact_button:hover {
    color: #fff;
}

.contact_button:hover::after {
    transform: scale(1, 1);
}

/* フッター */
footer.abc_footer {
    width: 100%;
    height: auto;
    background-image: url(img/Blue_bg_4.jpg);
    background-size: cover;
    padding-top: 50px;
}

.footer_box {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

@media screen and (min-width: 643px) {
    .footer_box {
        flex-direction: row;
    }
}

.footer_inner_leftbox {
    width: 100%;
}

@media screen and (min-width: 643px) {
    .footer_inner_leftbox {
        width: 70%;
        padding-bottom: 50px; /* 5月10日に営業所を非表示にしたため下の余白を調整 */
    }
}

.address_d {
    margin-top: 40px;
}

.address_p {
    color: #fff;
    font-size: 15px;
    margin-top: 5px;
    line-height: 1.5rem;
}

@media screen and (min-width: 450px) {
    .address_p {
        font-size: 17px;
        margin-top: 20px;
        line-height: 1.5rem;
    }
}

.footer_inner_rightbox {
    width: 100%;
    display: flex;
    justify-content: space-around;
    gap: 30px;
    padding-bottom: 50px; /* 5月10日に営業所を非表示にする関係で下余白調整 */
}

@media screen and (min-width: 643px) {
    .footer_inner_rightbox {
        margin-right: 10px;
    }
}

ul.footer_leftul,
ul.footer_rightul {
    font-size: 17px;
    margin-top: 50px;
    cursor: pointer;
}

li.footer_leftli {
    line-height: 2.2rem;
}

li.footer_rightli {
    line-height: 2.2rem;
}

li.footer_leftli a {
    color: #fff;
}

li.footer_rightli a {
    color: #fff;
}

div.footer_right {
    display: flex;
    flex-direction: column;
}

div.right_bottom_box {
    margin-top: 40px;
    /* display: none;  5月30日に営業所を表示。*/
}

p.footer_rbp {
    font-size: 14px;
    color: #fff;
    line-height: 1.5rem;
    border-bottom: solid 1px #fff;
    width: 100%;
    margin: 10px auto;
    word-break: keep-all;
}

@media screen and (min-width: 643px) {
    p.footer_rbp {
        width: 73%;
    }
}

@media screen and (min-width: 450px) {
    p.footer_rbp {
        font-size: 15px;
    }
}

p.footer_rbp:first-child {
    padding-bottom: 10px;
}

p.footer_rbp:last-child {
    border: none;
    margin-bottom: 100px;
}

/* PRODUCT取扱商品_固定ページ */
.fix_page_imgcontainer {
    height: 595px;
    width: 100%;
}

.fix_page_imgBOX {
    position: relative;
    width: 90%;
    height: 499px;
    overflow: hidden;
    margin-top: 120px;
    margin-right: 10%;
}

.fix_page_img {
    width: 100%;
    height: 499px;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 10;
}

.product_mv {
    background-image: url(img/product_MV.jpg);
}

.company_mv {
    background-image: url(img/company_MV.jpg);
}

.company_profile_mv {
    background-image: url(img/company_profile.png);
    height: 100%;
}

.news_mv {
    background-image: url(img/news_MV.jpg);
}

.recruit_mv {
    background-image: url(img/recruit_mv.jpg);
}

.contact_mv {
    background-image: url(img/contact_MV.jpg);
}

.fix_page_img h3 {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    color: #fff;
    font-size: 50px;
    font-family: "Marcellus", serif;
}

@media screen and (min-width: 891px) {
    .fix_page_img h3 {
        font-size: 80px;
    }
}

.fix_page_img h3.company_profile_h3 {
    position: absolute;
    top: 35%;
    left: 50px;
    text-align: left;
    color: #fff;
    font-size: 80px;
    font-family: "Marcellus", serif;
}

@media screen and (max-width: 890px) {
    .fix_page_img h3.company_profile_h3 {
        font-size: 50px;
    }
}

.fix_page_img h3 span {
    font-size: 30px;
}

.fix_page_img h3.recruit_h3 {
    color: #2e2485;
}

.kv3 {
    position: absolute;
    top: 217px;
    left: 0px;
    width: 90%;
    background-position: center;
    background-size: cover;
    z-index: 1;
    margin-left: 10%;
    height: 499px;
}

section.product_fixed {
    margin: 50px auto 0px auto;
}

.navy_letter {
    margin-top: -10px;
    margin-bottom: 50px;
    font-size: 80px;
}

.navy_letter {
    color: rgb(46, 36, 133, 0.07);
    margin-bottom: 50px;
    margin-top: -7px;
    font-size: 50px;
    text-align: right;
}

@media screen and (min-width: 431px) and (max-width: 804px) {
    .navy_letter {
        margin-top: -10px;
        margin-bottom: 50px;
        font-size: 80px;
    }
}

@media screen and (min-width: 805px) {
    .navy_letter {
        font-size: 153px;
        margin-top: -20px;
    }
}

.fix_text {
    font-family: serif;
    font-size: 20px;
    line-height: 2;
    width: min(92%, 1020px);
    margin: -50px auto 0px auto;
}

@media screen and (min-width: 800px) {
    .fix_text {
        line-height: 68px;
        font-size: 30px;
    }
}

@media screen and (max-width: 450px) {
    .fix_text {
        margin: 40px auto 0px auto;
    }
}

/* COMPANY会社概要_固定ページ */

.company_text {
    text-align: center;
    color: #2e2485;
}

@media screen and (max-width: 765px) {
    .compc-display {
        display: none;
    }
}

section.greetings {
    margin: 50px auto 0px auto;
}

.greetings_box {
    display: flex;
    justify-content: center;
    gap: 50px;
    margin-top: 150px;
    margin-bottom: 180px;
}

@media screen and (max-width: 450px) {
    .greetings_box {
        margin-top: 80px;
        margin-bottom: 80px;
    }
}

.greetings_leftbox {
    width: 30%;
    height: 424px;
    background-image: url(img/Blue_bg_4.jpg);
    background-position: 90%;
}

@media screen and (max-width: 450px) {
    .greetings_leftbox {
        display: none;
    }
}

.greetings_rightbox {
    width: 70%;
    height: auto;
    margin-right: 3%;
}

@media screen and (max-width: 450px) {
    .greetings_rightbox {
        width: 90%;
        margin-right: 0px;
    }
}

div.namebox {
    display: flex;
    flex-direction: column;
    justify-content: right;
    margin-top: 50px;
}

@media screen and (min-width: 541px) {
    div.namebox {
        flex-direction: row;
        align-items: center;
    }
}

.greetings_rightbox h4.ceo_h4 {
    font-family: "Cormorant Garamond", serif;
    font-weight: 400;
    font-style: normal;
    /*font-size: 48px;*/
    font-size: 25px;
    line-height: 2.4rem;
    text-align: right;
}

@media screen and (min-width: 541px) {
    .greetings_rightbox h4.ceo_h4 {
        margin-right: 40px;
    }
}

.greetings_rightbox p.ceo_name {
    font-family: "WindSong", cursive;
    font-weight: 400;
    font-style: normal;
    font-size: 22px;
    line-height: 3.5rem;
    text-align: right;
}

@media screen and (min-width: 450px) {
    .greetings_rightbox p.ceo_name {
        font-size: 22px;
    }
}

.greetings_rightbox p.greetings_p {
    font-family: "Noto Sans JP", sans-serif;
    font-size: 15px;
    line-height: 40px;
}

@media screen and (min-width: 450px) {
    .greetings_rightbox p.greetings_p {
        font-size: 17px;
        line-height: 60px;
    }
}

section.business {
    margin: 50px auto 0px auto;
}

.business_box {
    width: 100%;
    height: 464px;
    background-image: url(img/Business_bg.png);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    margin-top: 100px;
}

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

.company_profile_box {
    width: 100%;
    height: 514px;
    background-image: url(img/company_profile.png);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    margin-top: 140px;
}

@media screen and (max-width: 450px) {
    .company_profile_box {
        margin-top: 80px;
    }
}

.access_box {
    background-image: url(img/Blue_bg_3.jpg);
}

.business_box h3 {
    font-size: 55px;
    color: #fff;
    text-align: right;
    padding-top: 180px;
}

.company_profile_box h3 {
    font-size: 55px;
    color: #fff;
    text-align: left;
    padding-top: 180px;
}

.business_box h3.access_h3 {
    color: #fff;
}

.business_box span {
    font-size: 25px;
    font-family: "Noto Sans JP", sans-serif;
}

.company_profile_box span {
    font-size: 25px;
    font-family: "Noto Sans JP", sans-serif;
}

p.business_p {
    font-family: "Noto Sans JP", sans-serif;
    font-size: 15px;
    margin-top: 30px;
    line-height: 40px;
    margin-bottom: 40px;
}

@media screen and (min-width: 450px) {
    p.business_p {
        font-size: 17px;
        line-height: 50px;
    }
}

.service_h4 {
    font-family: "Noto Sans JP", sans-serif;
    color: #2e2485;
    font-size: 25px;
    line-height: 50px;
    padding: 5px;
    border-bottom: solid 5px #2e2485;
    border-right: solid 5px #2e2485;
}

.business_summary {
    display: flex;
    flex-direction: column;
    gap: 48px;
}

@media screen and (max-width: 450px) {
    .business_summary {
        margin-top: 40px;
    }
}

.business_BOX_01 {
    width: min(92%, 392px);
    height: auto;
    margin: 0px auto;
    display: flex;
    flex-direction: column;
    text-align: center;
}

.business_box1 {
    width: min(100%, 392px);
    background-color: #c7d3df;
    height: 352px;
    margin: 0px auto;
}

p.service_concept_p1 {
    margin-top: 120px;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 25px;
    color: #2e2485;
    font-weight: bold;
    line-height: 60px;
}

.business_box2 p.service_concept_p,
.business_box3 p.service_concept_p {
    margin-top: 120px;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 25px;
    color: #2e2485;
    font-weight: bold;
    line-height: 60px;
}

@media screen and (max-width: 475px) {
    .business_box1 p,
    .business_box2 p.service_concept_p,
    .business_box3 p.service_concept_p {
        font-size: 20px;
    }
}

.business_BOX_02 {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 48px;
    margin: 0px auto;
}

@media screen and (min-width: 801px) {
    .business_BOX_02 {
        flex-direction: row;
        gap: 48px;
        justify-content: center;
    }
}

.business_inner_box2,
.business_inner_box3 {
    display: flex;
    flex-direction: column;
    width: min(100%, 392px);
}

@media screen and (max-width: 800px) {
    .business_inner_box2,
    .business_inner_box3 {
        margin: 0px auto;
    }
}

.business_box2 {
    width: min(100%, 392px);
    background-color: #c3e3dd;
    height: 352px;
    text-align: center;
    margin: 0px auto;
}

.business_box3 {
    width: min(100%, 392px);
    background-color: #dddbc6;
    height: 352px;
    text-align: center;
    margin: 0px auto;
}

.business_inner_p {
    text-align: left;
    font-size: 15px;
    line-height: 2rem;
    margin-top: 10px;
    font-family: "Noto Sans JP", sans-serif;
}

@media screen and (min-width: 450px) {
    .business_inner_p {
        font-size: 17px;
    }
}

.company_table {
    width: min(92%, 760px);
    margin: -50px auto 28px auto;
    border-collapse: separate;
    border-spacing: 0px 50px;
    box-sizing: border-box;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 14px;
}

@media screen and (min-width: 766px) {
    .company_table {
        font-size: 17px;
    }
}

.company_table tr {
    line-height: 2rem;
}

@media screen and (min-width: 766px) {
    .company_table tr {
        line-height: 60px;
    }
}

.company_table th {
    width: 180px;
    background-color: #dcdcdc;
    border-bottom: solid 3px #2e2485;
}

@media screen and (max-width: 765px) {
    .company_table th {
        width: 30%;
        padding-top: 10px;
    }
}

.company_table td {
    padding-left: 50px;
    border-bottom: solid 3px #dcdcdc;
}

@media screen and (max-width: 765px) {
    .company_table td {
        width: 70%;
        padding-left: 30px;
        padding-bottom: 10px;
    }
}

ul.company_table_ul1 {
    line-height: 1.8rem;
    margin-bottom: 20px;
}

ul.company_table_ul1 li {
    line-height: 2rem;
    margin-bottom: 10px;
}

ul.company_table_ul1 li:first-child {
    color: #fff;
    background-color: #2e2485;
    width: 85px;
    text-align: center;
}

ul.company_table_ul2 {
    line-height: 1.8rem;
    margin-bottom: 20px;
    word-break: keep-all;
    /* display: none; 5月30日に表示 */
}

ul.company_table_ul2 li {
    line-height: 2rem;
    margin-bottom: 10px;
}

ul.company_table_ul2 li:first-child {
    color: #fff;
    background-color: #2e2485;
    width: 85px;
    text-align: center;
}

ul.tbul {
    list-style-type: disc;
}

ul.tbul li {
    margin-bottom: 10px;
}

.googlemap {
    width: min(92%, 1150px);
    height: 476px;
    margin: 62px auto 32px auto;
    background-color: #dcdcdc;
}

iframe.gm_access {
    aspect-ratio: 16 / 9;
    max-width: 1150px;
    width: 100%;
    height: auto;
}

.access_p {
    width: min(92%, 1150px);
    margin: 0px auto;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 14px;
    line-height: 1.8rem;
}

@media screen and (min-width: 450px) {
    .access_p {
        font-size: 17px;
    }
}

.access_table {
    width: min(92%, 1150px);
    margin: 0px auto;
    border-collapse: separate;
    border-spacing: 0px 50px;
    box-sizing: border-box;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 14px;
    word-break: keep-all;
    /* display: none; 5月30日に営業所を表示 */
}

@media screen and (min-width: 450px) {
    .access_table {
        font-size: 15px;
    }
}

.access_table tr {
    line-height: 60px;
}

.access_table th {
    background-color: #dcdcdc;
    border-bottom: solid 3px #2e2485;
    width: 30%;
}

@media screen and (min-width: 766px) {
    .access_table th {
        width: 180px;
    }
}

.access_table td {
    padding-left: 20px;
    padding-bottom: 15px;
    border-bottom: solid 3px #dcdcdc;
    line-height: 2rem;
}

@media screen and (max-width: 765px) {
    .access_table td {
        width: 70%;
    }
}

/* RECRUIT採用情報_固定ページ */
h3.recruit_heading {
    font-family: "Marcellus", serif;
    color: #2e2485;
    font-size: 55px;
    line-height: 4.7rem;
    word-wrap: break-word;
}

@media screen and (max-width: 700px) {
    h3.recruit_heading {
        font-size: 45px;
    }
}

h3.recruit_heading span {
    font-family: serif;
    color: #000000;
    font-size: 25px;
    display: block;
    margin-top: -15px;
}

.recruit_text {
    text-align: left;
    color: #000;
    font-size: 23px;
    font-weight: bold;
    line-height: 3rem;
    display: block;
    height: auto;
    margin-bottom: 80px;
}

@media screen and (min-width: 801px) {
    .recruit_text {
        font-size: 40px;
        line-height: 4.7rem;
    }
}

.recruit_text_small {
    text-align: left;
    color: #000;
    font-size: 16px;
    font-family: "Noto Sans JP", sans-serif;
    line-height: 2rem;
}

@media screen and (min-width: 801px) {
    .recruit_text_small {
        font-size: 25px;
    }
}

img.recruit_banner {
    display: block;
    width: min(100%, 954px);
    margin: 70px auto;
}

a.recruit_banner_a:hover {
    opacity: 0.8;
}

.require_h3 {
    margin-top: 140px;
}

.recruit_table {
    width: min(92%, 1052px);
    margin: 50px auto;
    border-collapse: collapse;
    box-sizing: border-box;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 17px;
}

@media screen and (max-width: 765px) {
    .recruit_table {
        font-size: 14px;
    }
}

.recruit_table tr {
    line-height: 50px;
}

.recruit_table th {
    background-color: #dcdcdc;
    border-bottom: solid 3px #2e2485;
    vertical-align: middle;
    padding: 20px;
    width: 100px;
}

@media screen and (max-width: 765px) {
    .recruit_table th {
        width: 35%;
        padding: 0px;
        font-size: 12px;
    }
}

.recruit_table td {
    padding: 20px;
    border-bottom: solid 3px #dcdcdc;
    vertical-align: middle;
    line-height: 2rem;
}

@media screen and (min-width: 766px) {
    .recruit_table td {
        line-height: 50px;
    }
}

.recruit_table .td_gray {
    background-color: #eceaea;
    text-align: center;
}

@media screen and (max-width: 765px) {
    .recruit_table .td_gray {
        width: 20%;
    }
}

ul.recruit_tbul li {
    line-height: 2.3rem;
}

@media screen and (max-width: 765px) {
    ul.recruit_tbul li {
        line-height: 2rem;
    }
}

/* お問い合わせCONTACT_固定ページ */
section.contact_sec {
    margin-top: 60px;
    margin-bottom: 108px;
}

#cf7-area {
    width: 100%;
    margin: 0 auto;
    font-family: "Marcellus", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
}

.cf7-item {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding-top: 47px;
    margin-bottom: 47px;
    border-top: solid 1px #707070;
}

.cf7-q {
    width: 30%;
    margin: 0 0 0 10px;
}

.cf7-a {
    width: 60%;
}

.form-heading {
    width: 100%;
    font-size: 20px;
    margin: 50px 0px;
}

@media screen and (min-width: 450px) {
    .form-heading {
        font-size: 27px;
    }
}

.form-heading span {
    font-size: 13px;
    color: #919191;
}

@media screen and (min-width: 450px) {
    .form-heading span {
        font-size: 15px;
    }
}

.form-heading p {
    margin: 0;
}

#cf7-area label {
    font-weight: bold;
    line-height: 1.8rem;
    display: flex;
    align-items: center;
    font-size: 16px;
}

#cf7-area .wpcf7-tel,
#cf7-area .wpcf7-text,
#cf7-area .wpcf7-email,
#cf7-area textarea {
    border: none;
    background: #eae5e5;
    width: min(95%, 500px);
    margin-left: 10px;
}

#cf7-area .wpcf7-tel:focus,
#cf7-area .wpcf7-text:focus,
#cf7-area .wpcf7-email:focus,
#cf7-area textarea:focus {
    background: #fff;
    border: 1px solid #000000;
    outline: 0;
}

#cf7-area .wpcf7-tel,
#cf7-area .wpcf7-text,
#cf7-area .wpcf7-email {
    height: 40px;
}

#cf7-area textarea {
    height: 200px;
    padding: 0.625em 0.4375em;
}

.wpcf7-submit {
    width: min(90%, 366px);
    height: 67px;
    padding: 10px;
    box-sizing: border-box;
    margin: 0 auto;
    text-align: center;
    background-color: #2e2485;
    color: #fff;
    display: block;
    border: none;
    font-size: 17px;
}

.wpcf7-submit:hover {
    background-color: #ffffff;
    border: 2px solid #2e2485;
    color: #2e2485;
}

.cf7-req {
    font-size: 0.8em;
    padding: 4px 6px;
    background: #891125;
    color: #ffffff;
    margin-left: auto;
    display: inline-block;
}

@media screen and (max-width: 471px) {
    .cf7-item {
        flex-direction: column;
        gap: 10px;
    }

    .cf7-q {
        width: 100%;
    }

    .cf7-a {
        width: 100%;
    }

    #cf7-area label {
        font-size: 13px;
        width: 100%;
    }
}

/* Newsお知らせ個別ページ(single-news.php) */
section.news_article {
    margin: 100px auto;
}

.news_single_span {
    display: block;
    width: 30%;
    font-family: "Marcellus", serif !important;
    color: #a2a2a2 !important;
    font-size: 17px;
    margin-bottom: 5px;
}

@media screen and (min-width: 768px) {
    .news_single_span {
        font-size: 24px;
    }
}

h3.single_heading {
    font-family: "Marcellus", serif;
    color: #2e2485;
    font-size: 40px;
    line-height: 4.5rem;
    margin-bottom: 50px;
}

@media screen and (min-width: 768px) {
    h3.single_heading {
        font-size: 55px;
        line-height: 5.5rem;
    }
}

p.single_p {
    font-family: "Noto Sans JP", sans-serif;
    font-size: 15px;
    line-height: 40px;
}

@media screen and (min-width: 768px) {
    p.single_p {
        font-size: 20px;
        line-height: 50px;
    }
}

div.navigation {
    /* ナビゲーション */
    width: 100%;
    margin: 100px auto 0px;
    display: flex;
    justify-content: space-between;
    gap: 30px;
    align-items: center;
}

@media screen and (min-width: 1010px) {
    div.navigation {
        width: 900px;
    }
}

.next-page {
    display: flex;
    align-items: center;
}

.prev-page {
    display: flex;
    align-items: center;
}

.next-page::before {
    font-family: "dashicons";
    content: "\f141";
}

.prev-page::after {
    font-family: "dashicons";
    content: "\f139";
}

.next-page a {
    display: block;
    color: #2e2485;
    font-size: 13px;
    text-align: left;
    line-height: 1.3rem;
}

.prev-page a {
    display: block;
    color: #2e2485;
    font-size: 13px;
    text-align: right;
    line-height: 1.3rem;
}

.next-page::before,
.prev-page::after {
    font-family: "dashicons";
    color: #2e2485;
    font-size: 18px;
    line-height: 1;
    display: block;
}

/* Security取扱い商品(子ページ) */
.product_sec1 {
    margin-bottom: 100px;
}

.product_sec2 {
    margin-bottom: 100px;
}

.product_img {
    width: 100%;
    height: 350px;
    position: relative;
    overflow: hidden;
    margin-top: 120px;
    background-image: url(img/SecurityProduct_MV_sp.jpg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}

@media screen and (min-width: 768px) {
    .product_img {
        height: 595px;
    }
}

.business_phone_img {
    background-image: url(img/pixta_44269119_M.jpg) !important;
}

.server_img {
    background-image: url(img/pixta_47569200_M.jpg) !important;
}

.copier_img {
    background-image: url(img/pixta_63535336_M.jpg) !important;
    background-position: center right !important;
}

.ac_img {
    background-image: url(img/air-conditioner.jpg) !important;
    background-position: top center;
}

.solar_img {
    background-image: url(img/solar-panel.jpg) !important;
    background-position: top center;
}

.led_img {
    background-image: url(img/pixta_30929522.jpg) !important;
}

@media screen and (min-width: 470px) and (max-width: 829px) {
    .product_img {
        background-image: url(img/SecurityProduct_MV_middle.jpg);
    }
}

@media screen and (min-width: 830px) {
    .product_img {
        background-image: url(img/Security_MV.jpg);
    }
}

.product_img_inner {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.product_img_h3 {
    text-align: center;
    color: #fff;
    font-size: 50px;
    font-family: "Marcellus", serif;
    display: none;
}

@media screen and (min-width: 768px) {
    .product_img_h3 {
        font-size: 80px;
    }
}

.product_img_h3 span {
    font-size: 30px;
}

.single_sec1 {
    margin-top: 50px;
}

.security_ul {
    margin-top: 20px;
    margin-bottom: 40px;
    line-height: 1.8rem;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 15px;
}

@media screen and (min-width: 768px) {
    .security_ul {
        line-height: 2.5rem;
        font-size: 20px;
    }
}

.security_li {
    text-indent: -1em;
    padding-left: 1em;
}

.security_h4 {
    margin: 80px 0px 20px;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 18px;
    line-height: 1.8rem;
    font-weight: bold;
    padding: 10px;
    border-left: 5px solid #2e2485;
}

@media screen and (min-width: 768px) {
    .security_h4 {
        font-size: 20px;
    }
}

.security_flexbox {
    flex-direction: column;
}

.security_img {
    width: 100%;
    height: auto;
    object-fit: cover;
    display: block;
    margin: 0px auto;
}

@media screen and (min-width: 900px) {
    .security_flexbox {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        gap: 30px;
    }

    .security_img {
        width: 496px;
        height: 239px;
        object-fit: cover;
        margin: 20px 0px 0px;
        flex-shrink: 0;
    }

    .security_img2 {
        width: 314px;
        height: 284px;
        object-fit: cover;
        margin-top: 20px;
    }
}

.product_grid {
    display: grid;
    gap: 30px;
    justify-items: center;
    margin: 50px auto;
}

@media screen and (min-width: 768px) {
    .product_grid {
        grid-template-columns: repeat(2, 1fr);
        height: 710px;
    }
}

p.square_p {
    background-color: #929191;
    color: #fff;
    height: 47px;
    line-height: 47px;
    text-align: center;
    font-size: 20px;
    border-radius: 10px 10px 0px 0px;
}

.product_square {
    width: min(100%, 447px);
    height: 340px;
    border-radius: 20px;
    border: solid 4px #929191;
}

.headline1_h3 {
    font-weight: bold;
    background-color: #000;
    height: auto;
    color: #fff;
    padding: 2em 1em;
    box-shadow: 22px 22px #2e2485;
    margin: 40px 0 70px 10%;
    line-height: 2rem;
    font-size: 18px;
}

@media screen and (min-width: 768px) {
    .headline1_h3 {
        font-size: 30px;
        height: 105px;
        line-height: 105px;
        padding: 0.5em 1em;
    }
}

.product_p {
    font-family: "Noto Sans JP", sans-serif;
    font-size: 15px;
    line-height: 30px;
}

@media screen and (min-width: 768px) {
    .product_p {
        font-size: 20px;
        line-height: 50px;
    }
}

.mp {
    margin-top: 50px;
}

.headline2_h3 {
    height: auto;
    font-size: 18px;
    font-weight: bold;
    background-color: #2e2485;
    color: #fff;
    padding: 2em 1em;
    box-shadow: 22px 22px #000;
    margin: 40px 10% 70px 0;
    line-height: 2rem;
    font-size: 18px;
}

@media screen and (min-width: 768px) {
    .headline2_h3 {
        font-size: 30px;
        height: 105px;
        line-height: 105px;
        padding: 0.5em 1em;
    }
}

.headline3_h3 {
    font-weight: bold;
    background-color: #2e2485;
    line-height: 3.5rem;
    color: #fff;
    font-size: 20px;
    font-family: "Noto Sans JP", sans-serif;
    text-align: center;
    padding: 10px 20px;
}

@media screen and (min-width: 768px) {
    .headline3_h3 {
        line-height: 91px;
        font-size: 25px;
    }
}

.blue_box {
    background-color: #eef5fe;
    height: auto;
    padding-top: 100px;
    padding-bottom: 100px;
}

.white_box {
    position: relative;
    background-color: #fff;
    padding: 0px 50px 50px;
    height: auto;
}

@media screen and (max-width: 480px) {
    .white_box {
        padding: 0px 20px 20px;
    }
}

.headline3 {
    position: absolute;
    left: 0px;
    top: -50px;
}

.security_ms {
    font-size: 20px;
    color: #2e2485;
    font-family: "Noto Sans JP", sans-serif;
    line-height: 2.5rem;
    margin-top: 50px;
    padding-top: 70px;
}

@media screen and (min-width: 1030px) {
    .security_ms {
        font-size: 30px;
        line-height: 4rem;
        padding-top: 70px;
    }
}

.bottom_m {
    margin-bottom: 100px;
}

.no-topmg {
    margin-top: 0px;
}

.nobtm_mg {
    margin-bottom: 0px;
}

.last_p {
    margin-bottom: 100px;
}

@media screen and (max-width: 899px) {
    .security_img2 {
        width: 300px;
        display: block;
        margin: 30px auto 0px;
    }
}

@media screen and (max-width: 430px) {
    .security_img2 {
        width: 90%;
        display: block;
        margin: 15px auto 0px;
    }
}

@media screen and (min-width: 400px) {
    .sp-display2 {
        display: none;
    }
}

@media screen and (min-width: 890px) {
    .security_inner_box {
        width: 50%;
    }
}

.security_h5 {
    background-color: #2e2485;
    color: #fff;
    font-weight: bold;
    padding: 7px;
    width: 208px;
    text-align: center;
    font-size: 15px;
    margin-top: 25px;
    margin-bottom: 10px;
}

@media screen and (min-width: 768px) {
    .security_h5 {
        font-size: 20px;
    }

    .long_h5 {
        width: 300px;
    }
}

.top_mg_p {
    margin-top: 40px;
}

.top_mg20_p {
    margin-top: 20px;
}

@media screen and (max-width: 400px) {
    .s_font_p {
        font-size: 14px;
    }
}

.mg_btm_p {
    margin-bottom: 20px;
}

.right_img {
    margin: 30px 0 0 auto;
}

.lightblue_back {
    background-color: #eaf3ff;
    padding: 5px 5px 5px 8px;
    color: #2e2485;
}