@charset "utf-8";
/*
Theme Name: （株）消防ユニフォーム ApolloCap受注専用サイト
Theme URI: apollo-cap.com
Description: 消防ユニフォームが運営するアポロキャップのWEBサイト用テーマです。
Author: 消防ユニフォーム
Author URI: shoubou.info
Version: 0.1
*/

:root {
  color-scheme: light;
}

#wpadminbar {display: none;}
@media(1000px < width) {
    #wpadminbar {display: block;}
    .logged-in #header_wrapper {top: 32px;}
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}:where([hidden]:not([hidden='until-found'])){display:none!important}:where(html){-webkit-text-size-adjust:none;color-scheme:dark light}@supports not (min-block-size:100dvb){:where(html){block-size:100%}}@media (prefers-reduced-motion:no-preference){:where(html:focus-within){scroll-behavior:smooth}}:where(body){block-size:100%;block-size:100dvb;line-height:1.5;font-family:system-ui,sans-serif;-webkit-font-smoothing:antialiased}:where(input,button,textarea,select){font:inherit;color:inherit}:where(textarea){resize:vertical;resize:block}:where(button,label,select,summary,[role='button'],[role='option']){cursor:pointer}:where(:disabled){cursor:not-allowed}:where(label:has(>input:disabled),label:has(+input:disabled)){cursor:not-allowed}:where(button){border-style:solid}:where(a){text-underline-offset:.2ex}:where(ul,ol){list-style:none}:where(img,svg,video,canvas,audio,iframe,embed,object){display:block}:where(img,picture,svg){max-inline-size:100%;block-size:auto}:where(p,h1,h2,h3,h4,h5,h6){overflow-wrap:break-word}:where(h1,h2,h3){line-height:calc(1em + 0.5rem)}:where(hr){border:none;border-block-start:1px solid;color:inherit;block-size:0;overflow:visible}:where(:focus-visible){outline:2px solid var(--focus-color,Highlight);outline-offset:2px}:where(.visually-hidden:not(:focus,:active,:focus-within,.not-visually-hidden)){clip-path:inset(50%)!important;height:1px!important;width:1px!important;overflow:hidden!important;position:absolute!important;white-space:nowrap!important;border:0!important}

sup {display: none;}/*メールアドレススパム除けで使用*/
body {background-color: #fff; color: #333; font-family: "Century Gothic", Arial, 'メイリオ', Meiryo,'Noto Sans JP', sans-serif; min-height: 101vh; font-size: 14px;}
#wrapper {width: 100%; position: relative;}
#container {padding-top: 80px;}
#container_inner {margin: 0 10px;}
#pankuzu {background: #0077B3; color: #fff;}
.inner {width: 100%; padding: 0 40px;}
#pankuzu ul {max-width: 1100px; margin: 0 auto 30px; padding: 10px 0; display: flex;}
#pankuzu ul li {position: relative; padding-right: 30px;}
#pankuzu ul li::after {content: '>'; position: absolute; right: 10px;}
#pankuzu ul li:last-child::after {display: none;}
#pankuzu a {color: #fff;}

@media(1000px < width) {
    .inner {width: 1000px; margin: 0 auto;}
    #container {padding-top: 155px;}
    #container_inner {display: flex; justify-content: space-between; flex-wrap: wrap; max-width: 1100px; margin: 0 auto;}
    #sidebar {width: 300px; order: 1;}
    #contents {width: 760px; order: 2;}

}

#header_wrapper {background-color: #fff; position: fixed; top: 0; width: 100%; height: 80px; z-index: 1000; border-top: solid 4px #0077B3;}
#header {width: 100%; margin: 0 auto; }
#header .logo {height: 50px; text-align: center; margin-top: 15px; z-index: 901; position: relative; display: inline-block;}
#header .logo img { height: 100%; width: auto; opacity: 0.9; margin: 0 auto 0 15px;}

#header #header_nav nav.hide {opacity: 0; pointer-events: none; display: flex;}
#header #header_nav nav {position: fixed; top: 0; left: 0; display: flex; flex-wrap: wrap; width: 100%; height: 100vh; opacity : 1; transition: opacity 0.3s; backdrop-filter: blur(8px); text-align: center; z-index: 900; padding-top: 60px; background: rgba(255,255,255,0.8);}
#header nav li {margin-bottom: 10px;}
#header nav a {color: #333; text-decoration: none;}
#header nav a:hover {opacity: 1;}

#header_contact {order:99; width: 100%; letter-spacing: 0; display: none;}
#header_contact a {display: block; max-width: 300px;}

#hamburger {position: fixed; top: 20px; right: 30px; width: 40px; height: 40px; z-index: 1000; cursor: pointer;}
#hamburger span {position: fixed; display: block; width: 40px; height: 3px; background-color: #243156;}
#hamburger span:nth-of-type(2) {margin-top: 14px;}
#hamburger span:nth-of-type(3) {margin-top: 28px;}
#hamburger #hamtext {font-size: 8px; text-align: center; margin-top: 36px; letter-spacing: 1px;}
@media(width <= 1000px) {
    #header nav > div{
        height: calc(100vh - 80px);
        position: relative;
        width: 100%;
    }
    #header nav > div > ul {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 80%;
        box-shadow: 0 5px 5px rgba(0,0,0,0.1);
    }
    #header nav li {
        border-bottom: solid 1px #ccc;
        margin-bottom: 0;
    }
    #header nav li:last-child {
        border: none;
    }
    #header nav a {
        display: block;
        text-align: left;
        padding: 10px 15px;
        margin-bottom: 0;
        background: #fff;
    }
    #header nav ul ul {
        border-top: solid 1px #ccc;
    }
    #header nav li li a {
        padding-left: 30px;
    }
    #header nav li li a:before {
        content: '- ';
    }
}
@media(430px < width <= 1000px) {
}
@media(1000px < width) {
    #header_wrapper {height: auto; }
    #header .logo {position: relative; float: left; z-index: 1000; height: 60px; margin: 20px 0;}
    #header_inner > div:first-child {max-width: 1100px; margin: 0 auto;}
    #header #header_nav {
        clear: both;
        width: 100%; 
        background-image: linear-gradient(0deg, rgba(220, 220, 220, 1), rgba(255, 255, 255, 1));
        display: block;
        border-top: solid 1px #ccc;
        border-bottom: solid 1px #ccc;
    }
    #header #header_nav nav {
        opacity: 1!important; 
        pointer-events:all!important; 
        position: relative; 
        height: auto; 
        width: 100%; 
        max-width: 1100px;
        display: block; 
        margin: 0 auto;
        padding: 0;
        border-right: solid 1px #ccc;
        backdrop-filter: unset;
        background: none;
    }
    #header_contact {order: 2; float: right; width: auto; margin: 20px 0; display: block;}
    #header_contact a {padding: 20px;}
    #header nav {order: 3; padding-top: 0; width: 100%; margin: 0; font-size: 13px;}
    #header nav ul {display: flex; justify-content: space-between;}
    #header nav li {margin-bottom: 0; border-left: solid 1px #ccc; width: 100%; position: relative;}
    #header nav a {display:block; text-align: center; text-decoration: none; padding: 15px 0; border-left: solid 1px #fff;}
    #header nav a:hover { background-image: linear-gradient(0deg, rgba(180, 180, 180, 1), rgba(230, 230, 230, 1));}
    #header nav li ul {position: absolute; top: 51px; left: -1px; right: -1px; flex-wrap: wrap; border: none; display: none; box-shadow: 0 3px 3px rgba(0,0,0,0.1);}
    #header nav li ul li {width: 100%; border-left: none; border-bottom: solid 1px #ccc; }
    #header nav li ul li a {background: #fff;}
    #header nav li ul li a:hover {background: #69c; opacity: 1;}
    #header nav .current_page_item a {background: #0077B3; color: #fff;}

    #header nav .menu > li:last-child,
    #header nav .menu > li:nth-last-child(2) {position: absolute; top: -80px; width: 200px; border: none;}
    #header nav .menu > li:last-child { right: 0;}
    #header nav .menu > li:nth-last-child(2) { right: 220px;}
    #header nav .menu > li:last-child a,
    #header nav .menu > li:nth-last-child(2) a {border: none; color: #fff; background: #f07615; border-radius: 10px; font-weight: bold; font-size: 16px; box-shadow: 0 5px 5px rgba(0,0,0,0.2);}
    #header nav .menu > li:last-child a:hover,
    #header nav .menu > li:nth-last-child(2) a:hover {opacity: 0.6;}

    #hamburger {display: none;}
}

h1.title {
    margin: 0 0 30px;
    border: solid 1px #ccc;
    border-top: solid 6px #0077B3;
    padding: 9px 10px 11px;
    font-size: 20px;
    font-style: normal;
    background-image: linear-gradient(0deg, rgba(240, 240, 240, 1), rgba(255, 255, 255, 1));
}
.headline1 {
    display: block;
    border: solid 1px #ccc;
    border-left: solid 6px #0077B3;
    padding: 9px 14px 11px;
    font-size: 14px;
    font-style: normal;
    margin-bottom: 20px;
    background-image: linear-gradient(0deg, rgba(240, 240, 240, 1), rgba(255, 255, 255, 1));
}


h2 {margin: 40px 0; padding: 0 10px; font-size: 40px;}
h1 + h2 {margin-top: 30px;}
h3 {margin: 30px 0; font-size: 22px; font-style: italic;}
h4 {margin-top: 20px;}
p {line-height: 2; margin-bottom: 2em;}
.indent {text-indent: -1.2em; margin: 0 0 10px 1.2em;}
strong {border-bottom: solid 2px #2a9259;}
.textswipeinfo {text-align: center; margin: 20px 0 10px;}
.textS {font-size: 80%;}
a { transition: all 0.2s;}
a:hover {text-decoration: none; opacity: 0.6;}

table {width: 100%; border-collapse: collapse; border-color: #ccc;}
.wp-block-table thead,
.wp-block-table th,
.wp-block-table td {border-color: #ccc;}
.wp-block-table thead {background-image: linear-gradient(0deg, rgba(240, 240, 240, 1), rgba(255, 255, 255, 1)); border-width: 1px;}
.table-base table {border-bottom:solid 1px #243156; box-sizing: border-box; border-collapse: collapse; width: 100%; max-width: 800px; margin: 0 auto;}
.table-base th,
.table-base td {border-top:solid 1px #243156; padding: 10px; background-color: #fff;}
.table-base th {text-align: left;}
.table-base thead th {background-color: #243156; color: #fff;}
.table-base p {margin-bottom: 0;}

.dl-base {border-bottom:solid 1px #ccc; box-sizing: border-box; border-collapse: collapse; width: 100%; display: flex; flex-wrap: wrap;}
.dl-base dt {width: 100%; border-top:solid 1px #ccc; padding-top: 5px;}
.dl-base dd {width: 100%; padding-bottom: 15px;}
.dl-base p {margin-bottom: 0;}
.align-r {text-align: right !important;}

input[type="text"].num {width: 60px;}
input[type="text"],
input[type="tel"],
input[type="email"],
textarea {max-width: 100%; width: 100%; padding: 0 5px; border: solid 1px #333;}
textarea {height: 200px;}
select {padding: 5px 10px; max-width: 100%;}
input[type="text"].readonly {border: none;}

.require {background: #2a9259; color: #fff; font-size: 12px; padding: 2px 8px 4px; line-height: 1; margin-left: 5px;}
.btn a,
.wpcf7-submit {display: block; width: 100%; max-width: 300px; text-align: center; margin: 40px auto; background-color: #f07615; color: #fff; padding: 20px 30px 20px 5px; box-shadow: 0 5px 5px rgba(0,0,0,0.2); border-radius: 10px; position: relative; font-weight: bold; text-decoration: none; letter-spacing: 0; transition: all 0.1s;}
.btn a:hover,
.wpcf7-submit:hover {opacity: 0.6;}
.wpcf7-submit {border: none; padding-right: 0;}
.wpcf7-not-valid {border-color: #d00; border-style: solid;}
.wpcf7-not-valid-tip {color: #d00;}
.btn a::after {content: ""; background-color: #fff; height: 1rem; width: 1rem; -webkit-mask: url("images/arrow.svg"); mask: url("images/arrow.svg"); -webkit-mask-size: cover; mask-size: cover; position: absolute; right: 10px; top: 50%; transform: translate(0, -50%);}
.hide {display: none;}
.agreement {max-width: 400px; margin: 40px auto; text-align: center; border: solid 1px #ccc; padding: 20px 0;}
.agreement p {margin-bottom: 0; line-height: 1.8;}
@media(430px < width <= 1000px) {
}
@media(1000px < width) {
    h1.title {font-size: 18px; padding: 15px 20px;}
    h2 {margin: 80px 0 40px; font-size: 36px;}
    .textswipeinfo {display: none;}
    .xscroll table {max-width: 920px;}
    .table-base th, .table-base td {padding: 10px 20px;}
    .table-base{margin: 0;}
    .table-base table {max-width: 800px;}
    .dl-base {max-width: 100%;}
    .dl-base dt {width: 35%; padding-top: 12px;}
    .dl-base dd {width: 65%; padding-top: 10px; border-top:solid 1px #ccc;}
    .dl-narrow {max-width: 600px; margin: 0 auto;}
    .require { float: right; margin-top: 3px; margin-right: 5px; padding: 8px 8px 10px;}
}


.eyecatach-wrapper {margin-top: 20px; margin-bottom: 20px;}
.home #contents h2 {margin-top: 0;}
.home .title{display: none;}
.home-point {align-items: flex-start; flex-wrap: wrap !important;}
.home-point .wp-block-group {width: 100%;}

.home-slider {background-color: #243156; padding: 40px 0;}
.home-slider img {text-align: center; margin: 0 auto;}
.home-slider .slick-dots {bottom: -40px;}
.home-slider .slick-dots li button::before {color: #fff;}
.home-slider .slick-dots li.slick-active button::before {color: #fff;}
.home-about {background-color: #243156; padding: 100px 0 40px;}
.home-about h2 {color: #fff; margin: 0 0 40px; font-size: 28px;}
.home-about p {color: #fff;}
.home-about figure {margin-bottom: 40px;}
.home-about figure img {margin: 0 auto;}
.home-mainvisual {background-color: #243156; color: #fff;}
.home-mainvisual > div {max-width: 1200px; margin: 0 auto; position: relative;}
.home-mainvisual h2 {text-align: left; padding: 0; margin: 0 0 40px;}
.home-mainvisual .home-mvimg figure {position: absolute; right: 0; top: 0;animation: anime 5s 0s infinite;opacity: 0;}
.home-mainvisual .home-mvimg figure:nth-child(2) {animation-delay: 2.5s;}

.home-bannerlist {max-width: 1200px; margin: 0 auto 60px;}
.home-bannerlist > figure {padding: 20px;} 

.list-feature {padding-bottom: 1px;}
.list-feature h3 {margin-top: 0;}
.list-feature h3 br {display: none;}
.list-feature .feature-img {margin: 0;}
.list-feature .list-feature-block:nth-of-type(2n) .feature-img {margin: 0;}
.list-feature .list-feature-block:nth-of-type(2n) .feature-img img {margin-left: auto;}

.list-topics {border-top: dotted 1px #666;}
.list-topics li {border-bottom: dotted 1px #666; padding: 10px 0;}
.list-topics h3 {font-size: 14px;}

.home-readymade {background-color: #ebf6f0; padding: 40px 20px;}
.home-readymade h2 {margin-top: 0; padding-top: 40px; font-size: 20px; color: #39a268;}
.home-readymade h2 br {display: none;}
.home-readymade .btn a {max-width: 400px;}
.home-readymade img {margin: 0 auto; min-width: 300px;}
.recommended {background-color: #fff; position: relative; padding: 30px 30px 20px; margin-top: 80px; margin-bottom: 40px; border-radius: 10px;}
.recommended h3 {position: absolute; top: -14px; margin: 0; padding: 0 15px 3px 15px; text-align: center; font-size: 16px; background-color: #243156; color: #fff; border-radius: 14px; left: 50%; transform: translate(-50%, 0); min-width: 200px;}
.recommended li {list-style-type: disc; margin: 0 0 10px 10px;}

@keyframes anime {
    0% {
        opacity: 0;
    }
    10% {
        opacity: 1;
        z-index: 10;
    }
    50% {
        opacity: 1;
    }
    60% {
        opacity: 0;
    }
    100% {
        opacity: 0;
    }
}

@media(430px < width <= 1000px) {
}
@media(width <= 1000px) {
    .list-topics {}
}
@media(1000px < width) {
    .home-slider {padding-top: 100px;}

    .home-point {justify-content: space-between;}
    .home-point .wp-block-group {width: calc((100% - 40px) / 3); }

    .list-topics h3 {
        font-size: 13px;
        font-weight: normal;
    }
}

/*price*/
.xscroll.table-capnum table {width: 700px;}
.xscroll {width: 100%; overflow-x: scroll; margin: 0 auto;}
.xscroll table {width: 800px;}
.payment {border: solid 1px #243156; padding: 20px; margin-bottom: 40px;}
.payment h3 {margin-top: 20px;}
.announcesimulator > div {background-color: #243156; display: flex; flex-wrap: wrap; margin: 100px 0; padding: 40px; color: #fff;}
.announcesimulator > div > h3 {color: #fff; width: 100%; text-align: center; margin-top: 0;}
.announcesimulator figure {margin: 0 auto 20px;}
.announcesimulator a {color: #e9c534;}
.announcesimulator .btn a {color: #fff;}
@media(1000px < width) {
    .xscroll {overflow: hidden;}
    .xscroll table,
    .xscroll.table-capnum table {width: 800px;}

    .price-base > div {display: flex; flex-wrap: wrap; justify-content: space-between;}
    .price-base h2 {width: 100%;}
    .price-base > div > div {width: calc(50% - 20px);}
    .price-base figure {width: calc(50% - 20px); margin-right: 0;}
    .price-daibiki > div {display: flex; justify-content: space-between;}
    .price-daibiki > div > div {width: calc(50% - 20px);}
    .price-daibiki figure {width: calc(50% - 20px);}

    .announcesimulator > div > * {width: 50%;}
    .announcesimulator figure {padding-right: 40px;}
}

/*design*/
.list-pattern > div > div  {
    margin-bottom: 20px;
    padding: 0 20px 10px !important;
    border: solid 1px #ccc;
    text-align: center;
    position: relative;
}
.ico-reccomend {
    position: absolute;
    left: 50%;
    top: -15px;
    transform: translateX(-50%);
    background: #0eb34d;
    color: #fff;
    border-radius: 20px;
    font-size: 12px;
    padding: 0 10px;
}
.list-pattern h3 {
    display: block;
    border-bottom: solid 1px #ccc;
    padding: 9px 10px 11px;
    font-size: 14px;
    font-style: normal;
    margin: 0 -20px 10px;
    background-image: linear-gradient(0deg, rgba(240, 240, 240, 1), rgba(255, 255, 255, 1));
}
.list-pattern img {
    margin: 0 auto;
}
.list-pattern p a {
    display: block;
    border: solid 1px #ccc;
    border-radius: 8px;
    background-image: linear-gradient(0deg, rgba(240, 240, 240, 1), rgba(255, 255, 255, 1));
    text-decoration: none;
    padding: 5px 5px;
    color: #000;
    margin-top: 5px;
}
.list-pattern p a:hover {
    background-image: linear-gradient(0deg, rgba(180, 180, 180, 1), rgba(230, 230, 230, 1));
}
.list-pattern p {
    margin-bottom: 0;
}
.list-color {display: flex; margin-top: 10px;}
.list-sozai > div > div,
.list-pattern > div > div,
.list-fronttext > div > div {background-color: #fff; padding: 20px; margin-bottom: 20px;}
.list-color li {width: 60px; height: 60px; text-indent: -9999px; border: solid 4px #ccc; border-radius: 30px; margin-right: 10px;}
.list-color .color-blue {background-color: #293a56;}
.list-color .color-navy {background-color: #10172d;}
.list-design {aspect-ratio: 5 / 2; overflow: hidden; position: relative;}
.list-design img {position: absolute; top: -70%; left: 50%; transform: translate(-50%,0); max-width: 120%; width: 120%;}
.list-brim img {top: -130%; max-width: 100%;}
.txt-sozai {border-top: solid 1px #293a56; border-bottom: solid 1px #293a56;}
.txt-sozai > div > * {font-size: 14px; line-height: 1.6em;}
.txt-sozai p {margin-bottom: 20px;}
.column {margin-top: 80px; position: relative; z-index: 1;}
.column > div {background-color: #ebf6f0; padding: 20px; z-index: -2; position: relative;}
.column h2 {margin: 0; text-align: left; font-size: 14px; display: inline-block; padding: 5px 10px; background-color: #39a268; color: #fff;}
.column h3 {margin-top: 0; color: #39a268;}
.column p {color: #444; line-height: 1.8em; font-size: 14px;}
.column .inner {padding: 0; width: 100%;}
.flex-column > div figure {margin-bottom: 40px;}
.flex-column > div figure img {margin: 0 auto;}
.list-sozai p {line-height: 1.8em;}
.list-sozai .zoomimg {min-height: 290px; padding-bottom: 10px;}
.list-sozai .zoomimg img {margin: 0 auto;}

.list-sozai .thumb {margin-top: 20px; min-height: 140px;}
.list-sozai .thumb > div {display: flex; flex-wrap: wrap;}
.list-sozai .thumb figure {width: 60px; height: 60px; margin: 0 10px 10px 0; border-radius: 30px;}
.list-sozai .thumb figure img {border-radius: 30px;}
.list-sozai .thumb .current {border: solid 2px #39a268; border-radius: 30px;}
.sozai-neodry {position: relative;}
.recommend {position: absolute; top: 0; left: 50%; transform: translate(-50%, -20px); font-weight: bold; color: #39a268; font-size: 20px; text-align: center; width: 100%;}
@media(1000px < width) {
    .list-sozai > div,
    .list-fronttext > div,
    .list-pattern > div {display: flex; flex-wrap: wrap;}
    .list-pattern > div > div {margin-right: 20px; }
    .list-sozai > div > div,
    
    .list-type > div > div {width: calc((100% - 40px) / 3);}
    .list-type > div > div:nth-of-type(3n)  {margin-right: 0;}
    .list-brim > div > div {width: calc((100% - 20px) / 2);}
    .list-brim > div > div:nth-of-type(2n)  {margin-right: 0;}
    .list-fronttext > div > div {width: calc((100% - 40px) / 2); margin-right: 40px; background-color: #fff; padding: 0 20px;}
    .list-sozai figure,
    .list-fronttext figure,
    .list-pattern figure {margin: 0 -20px 0 -20px;}
    .list-sozai > div > div:last-child,
    .list-fronttext > div > div:nth-of-type(2),
    .list-pattern > div > div:last-child {margin-right: 0;}
    .list-fronttext img {width: 100%;}
    .list-sozai .thumb {background-color: #eee; margin: 0 -20px;}
    .list-sozai .zoomimg {background-color: #eee;}
    
    .column > div {padding: 40px;}
    .flex-column > div {display: flex; flex-wrap: wrap;}
    .flex-column > div figure {max-width: 260px; order: 2; margin-top: -30px; margin-bottom: 0;}
    .flex-column > div > div {max-width: calc(100% - 300px); margin-right: 40px;}
    .recommend {top: -20px;}
}

/*faq*/
.dl-faq {margin: 0; background-color: #fff; margin-bottom: 60px; border-bottom: solid 1px #ccc;}
.dl-faq dt {position: relative; border-top: solid 1px #ccc; padding: 20px 40px 20px 40px; cursor: pointer; transition : all 0.2s ease 0s;}
.dl-faq dt:hover, .dl-faq dt.active {background-color: #0077B3; color: #fff;}
.dl-faq dt::before {position: absolute; left: 10px; top: 10px; content: 'Ｑ'; font-size: 22px; font-weight: bold;}
.dl-faq dt::after {position: absolute; top: 50%; right: 10px; transform: translate(0, -50%); content: '+'; font-size: 22px; font-weight: bold;}
.dl-faq dt.active::after {content: '-';}
.dl-faq dd {position: relative; font-size: 14px; padding: 0 20px; opacity: 0; height: 0; transition: opacity 0.1s; background: #f6f6f6;}
.dl-faq dd.active { padding: 20px 20px 20px 40px; opacity: 1; height: auto;}
.dl-faq dd.active::before {position: absolute; left: 10px; top: 10px; content: 'Ａ'; font-size: 22px; font-weight: bold;}
@media(1000px < width) {
    .dl-faq dt::after {right: 30px;}
    .dl-faq dt, .dl-faq dd.active {padding: 30px 40px 30px 60px;}
    .dl-faq dt::before, .dl-faq dd.active::before {left: 30px; top: 20px;}
}

.list-flow {list-style: decimal;}
.list-flow li {margin-bottom: 30px;
    border: solid 1px #ccc;
    list-style-position: inside;
    text-indent: -2em;
    padding: 20px 20px 20px 50px;
}
.list-flow li strong {
    font-size: 18px;
}
.list-flow li::marker {
    font-weight: bold;
    font-size: 24px;
}
/*estimate*/
.form-frontdesign .wpcf7-form-control,
.form-brimdesign .wpcf7-form-control {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}
.form-frontdesign .wpcf7-form-control > * {
    width: 30%;
    margin-left: 0;
    margin-right: 5%;
}
.form-brimdesign .wpcf7-form-control > * {
    width: 22%;
    margin-left: 0;
    margin-right: 4%;
}
.form-frontdesign .wpcf7-form-control > *:nth-child(3n) {
    margin-right: 0;
}
.form-brimdesign .wpcf7-form-control > *:nth-child(4n) {
    margin-right: 0;
}
.form-frontdesign .wpcf7-list-item,
.form-brimdesign .wpcf7-list-item {
    position: relative;
}
.form-frontdesign .wpcf7-list-item label,
.form-brimdesign .wpcf7-list-item label {
    position: relative;
    z-index: 2;
}
.form-frontdesign .wpcf7-list-item:before,
.form-brimdesign .wpcf7-list-item:before {/*スペースを作る*/
    content: '';
    top: 0;
    left: 0;
    width: 100%;/*指定したい幅*/
    padding-top: 100%;/*画像の幅に対する高さ比率*/
    display: block;
    overflow: hidden;
}
.form-frontdesign .wpcf7-list-item:after,
.form-brimdesign .wpcf7-list-item:after {
    position: absolute;
    display: block;
    width: 100%;
    height: 800px;
    content: '';
    top: 0;
    left:0;
    background-size: contain;
    background-repeat: no-repeat;
}
.form-frontdesign .wpcf7-list-item:nth-of-type(1):after {
    background-image: url(https://shoubou.xsrv.jp/apollo2/wp-content/uploads/2024/08/front-type1-100.jpg);
}
.form-frontdesign .wpcf7-list-item:nth-of-type(2):after {
    background-image: url(https://shoubou.xsrv.jp/apollo2/wp-content/uploads/2024/08/front-type2-100.jpg);
}
.form-frontdesign .wpcf7-list-item:nth-of-type(3):after {
    background-image: url(https://shoubou.xsrv.jp/apollo2/wp-content/uploads/2024/08/front-type3-100.jpg);
}
.form-frontdesign .wpcf7-list-item:nth-of-type(4):after {
    background-image: url(https://shoubou.xsrv.jp/apollo2/wp-content/uploads/2024/08/front-type4-100.jpg);
}
.form-frontdesign .wpcf7-list-item:nth-of-type(5):after {
    background-image: url(https://shoubou.xsrv.jp/apollo2/wp-content/uploads/2024/08/front-type5-100.jpg);
}
.form-frontdesign .wpcf7-list-item:nth-of-type(6):after {
    background-image: url(https://shoubou.xsrv.jp/apollo2/wp-content/uploads/2024/08/front-type6-100.jpg);
}
.form-frontdesign .wpcf7-list-item:nth-of-type(7):after {
    background-image: url(https://shoubou.xsrv.jp/apollo2/wp-content/uploads/2024/08/front-type7-100.jpg);
}
.form-frontdesign .wpcf7-list-item:nth-of-type(8):after {
    background-image: url(https://shoubou.xsrv.jp/apollo2/wp-content/uploads/2024/08/front-type8-100.jpg);
}
.form-frontdesign .wpcf7-list-item:nth-of-type(9):after {
    background-image: url(https://shoubou.xsrv.jp/apollo2/wp-content/uploads/2024/08/front-type9-100.jpg);
}
.form-brimdesign .wpcf7-list-item:nth-of-type(1):after {
    background-image: url(https://shoubou.xsrv.jp/apollo2/wp-content/uploads/2024/07/1ga.gif);
}
.form-brimdesign .wpcf7-list-item:nth-of-type(2):after {
    background-image: url(https://shoubou.xsrv.jp/apollo2/wp-content/uploads/2024/07/2sa.gif);
}
.form-brimdesign .wpcf7-list-item:nth-of-type(3):after {
    background-image: url(https://shoubou.xsrv.jp/apollo2/wp-content/uploads/2024/07/3gb.gif);
}
.form-brimdesign .wpcf7-list-item:nth-of-type(4):after {
    background-image: url(https://shoubou.xsrv.jp/apollo2/wp-content/uploads/2024/07/4sb.gif);
}
.form-brimdesign .wpcf7-list-item:nth-of-type(5):after {
    background-image: url(https://shoubou.xsrv.jp/apollo2/wp-content/uploads/2024/07/7gc.gif);
}
.form-brimdesign .wpcf7-list-item:nth-of-type(6):after {
    background-image: url(https://shoubou.xsrv.jp/apollo2/wp-content/uploads/2024/07/8sc.gif);
}
.form-brimdesign .wpcf7-list-item:nth-of-type(7):after {
    background-image: url(https://shoubou.xsrv.jp/apollo2/wp-content/uploads/2024/07/5gsb.gif);
}
.form-brimdesign .wpcf7-list-item:nth-of-type(8):after {
    background-image: url(https://shoubou.xsrv.jp/apollo2/wp-content/uploads/2024/07/6sgb.gif);
}
#simu_result, #gaisan {position: relative;}
#simu_result::after,
#gaisan::after {content: ""; background-color: #333; height: 3rem; width: 3rem; -webkit-mask: url("images/arrow.svg"); mask: url("images/arrow.svg"); -webkit-mask-size: cover; mask-size: cover; position: absolute; bottom:-70px; left: 50%; transform: translate(-50%, 0) rotate(90deg);}
#img_simu {width: 300px; height: 300px; position: relative; margin: 0 auto; text-align: center;}
#img_simu .img-parts {width: 100%; height: auto; position: absolute; top: 0; left: 0;}
#img_simu p {margin-bottom: 0;}
#textTcheck {text-align: center; width: 300px; height: 60px; color: #fff; z-index: 10; position: absolute; margin-top: -35px; font-size: 16px; font-weight: 900; letter-spacing: 0;background-clip: text; -webkit-background-clip: text;color: transparent;}
#textBcheck {text-align: center; width: 300px; color: #fff; z-index: 10; position: absolute; margin-top: 60px; font-size: 14px; font-weight: 900; letter-spacing: 0;background-clip: text; -webkit-background-clip: text;color: transparent;}
#flex_capnum {display: flex; background-color: #fff; padding: 20px 0; max-width: 800px; margin: 0 auto;}
#flex_capnum > span {margin-left: 20px;}
#flex_capnum > span:first-child {font-weight: bold;}
#flex_capnum input {margin-right: 5px; border: solid 2px #39a268; background-color: #ebf6f0; text-align: center;}
#selectnumbtn {display: inline-block; border: solid 1px #999; background-color: #e9c534; padding: 2px 10px; border-radius: 4px; cursor: pointer;}
.caption-estimate {margin-top: 20px; max-width: 880px; margin: 20px auto 0;}
.caption-estimate p {margin-bottom: 0; font-size: 14px; line-height: 30px; text-indent: -1em; margin-left: 1em;}
.text-s {font-size: 14px; line-height: 1.5em;}
.color-gold {background: linear-gradient(45deg, #B67B03 0%, #DAAF08 45%, #FEE9A0 70%, #DAAF08 85%, #B67B03 90% 100%);}
.color-silver {background: linear-gradient(45deg, #757575 0%, #9E9E9E 45%, #E8E8E8 70%, #9E9E9E 85%, #757575 90% 100%);}
.color-blue {background-color: #293a56; color: #fff;}
.color-white {background-color: #fff; color: #666;}
.color-navy {background-color: #10172d; color: #fff;}
.color-orange {background-color: #ea7121;}
.color-orange {background: linear-gradient(45deg, #ea7121 0%, #ffac2a 75%, #ea7121 100%);}
.color-red {background-color: #970e0e;}
.color-red {background: linear-gradient(45deg, #970e0e 0%, #bd1c1c 75%, #970e0e 100%);}
.color-black {background-color: #222; color: #fff;}
.font-gothic {font-family: /*'BIZ UDGothic',*/ 'Almarai', 'Noto Sans JP', sans-serif; font-weight: 900;}
.font-kaisho {font-family: 'Old Standard TT', serif; font-weight: 700;}
input[type="text"]#captanka, input[type="text"]#capprice, input[type="text"]#katatanka, input[type="text"]#kataprice, input[type="text"]#postage, input[type="text"]#pricenum {width: auto; text-align: right; background: #fff; min-width: 80px !important;}
input[type="text"]#pricenum {min-width: 200px !important;}

.dd-date {position: relative;}
.dd-date .wrap-ymd {position: absolute;top: 36px; margin-left: 20px;}
.dd-date > *:first-child {top: 0;}
.dd-date > *:first-child .wpcf7-list-item.first {margin-bottom: 56px;}
.wrap-ymd p,
.wrap-ymd p label {display: flex;}
.wrap-ymd input {max-width: 100px !important;}
.dd-numlist > div {margin-bottom: 5px;}
.numlabel {display: inline-block; width: 60px;}
@media (prefers-color-scheme: dark) {
    input[type="text"]#captanka, input[type="text"]#capprice, input[type="text"]#katatanka, input[type="text"]#kataprice, input[type="text"]#postage, input[type="text"] {
      background-color: #fff;
      color: #000;
    }
  }
@media(1000px < width) {
}

/*schedule*/
.schedule-attention {padding-bottom: 20px;}
.schedule-attention > div {background-color: #fff; padding: 0 20px 1px;}
.flow-schedule h3 {margin: 0 0 20px;}
.flow-schedule > div {display: flex; flex-wrap: wrap;counter-reset: number 0;}
.flow-schedule > div .wp-block-group {background-color: #fff; width: 100%; margin-bottom: 40px; padding: 20px 20px 0; position: relative;}
.flow-schedule > div .wp-block-group::before {position: absolute; bottom: -50px; right: -10px; counter-increment: number 1; content: counter(number); font-size: 100px; font-style: italic; font-weight: bold; opacity: 0.2;}
.flow-schedule > div .wp-block-group::after {position: absolute; top: calc(100% - 20px); right: 50%; transform: translate(50%, 0) rotate(45deg); content: ''; height: 40px; width: 40px; background-color: #fff; z-index: -1;}
.flow-schedule > div .wp-block-group:last-child::after {display: none;}
.flow-schedule figure {max-width: 340px; margin: 0 auto;}
.attention-flex {padding-top: 40px;}
.attention-flex > div {display: flex; flex-wrap: wrap;}
.guideline {margin-bottom:20px;}
.guideline img {margin-top: -20px;}
.schedule-example > div .wp-block-group {background-color: #243156; padding: 20px; margin-bottom: 20px; text-align: center;}
.schedule-example h3 {margin: 0 0 20px; color: #fff;}
.schedule-example > div .wp-block-group p {background-color: #fff; padding: 10px; margin: 0;}
.schedule-example .text-s {font-size: 14px;}
.schedule-example strong {color: #2a9259; margin-bottom: -20px; display: block; font-size: 20px;}
@media(1000px < width) {
    .flow-schedule > div .wp-block-group {width: 22%; margin-right: 3%;}
    .flow-schedule p {font-size: 14px; line-height: 170%; margin-top: 10px;}
    .guideline {margin: 0; max-width: 240px;}
    .attention-flex p {width:calc(100% - 280px); margin-left: 40px;}
    .schedule-example > div {display: flex; flex-wrap: wrap; width: 100%; padding: 0 40px 40px;}
    .schedule-example > div > div {width: calc(50% - 20px);}
    .schedule-example > div > div:first-child {margin-right: 40px;}
    .schedule-example > div > p {width: 100%; padding: 0;}
    .flow-schedule > div .wp-block-group::after { top: 50%; right: 0; transform: rotate(45deg) translate(0, -50%);}
}

/*RFP*/
.list-pdf > div {display: flex; flex-wrap: wrap;}
.list-pdf > div > div {background-color: #fff; margin: 0 auto 40px; padding: 20px 20px 0;}
.list-pdf > div > div h2 {font-size: 18px; margin: 0 0 20px;}
.list-pdf > div > div figure {max-width: 300px;}
.list-pdf > div > div img {margin: 0 auto;}
.list-pdf .btn a {padding: 10px 10px 10px 0; margin: 20px auto; max-width: 200px;}
@media(1000px < width) {
    .list-pdf > div {width: 920px; margin: 0 auto;}
    .list-pdf > div > div {width: calc((100% - 80px) / 3); margin-right: 40px; background-color: #fff; margin-bottom: 40px; padding: 20px 20px 0;}
    .list-pdf > div > div:nth-of-type(3n) {margin-right: 0;}
}

/*company*/
@media(1000px < width) {
    .dl-company {max-width: 600px; margin: 0 auto;}
}

/*sidebar*/
#sidebar {margin-bottom: 40px;}
#sidebar h3,
.wp-block-search__label {
    display: block;
    border: solid 1px #ccc;
    border-left: solid 6px #0077B3;
    padding: 9px 10px 11px;
    font-size: 14px;
    font-style: normal;
    margin-bottom: 20px;
    background-image: linear-gradient(0deg, rgba(240, 240, 240, 1), rgba(255, 255, 255, 1));
    font-weight: bold;
}
#sidebar ul {
    border-top: dotted 1px #333;
}
#sidebar li a {
    display: block;
    font-size: 12px;
    padding: 10px 16px;
    border-bottom: dotted 1px #333;
}
#sidebar img {
    width: 100%;
}
.wp-block-search__inside-wrapper {
    margin-top: 20px;
}
.wp-block-search__input {
    border-color: #ccc;
}
/*footer*/
#footer_wrapper {background-color: #EBEBEB; margin-top: 100px;}
.home #footer_wrapper {margin-top: 0;}
#footer h2 {font-size: 24px; margin-top: 0; margin-bottom: 40px;}
#footer h2 br {display: none;}

#footer_contact_inner {display: flex; flex-wrap: wrap;}
#footer_contact_inner > div {background-color: #fff; margin-bottom: 20px; padding: 20px; width: 100%;}
#footer_contact {max-width: 1000px; padding: 40px 40px; text-align: center; margin: 0 auto;}
#footer_contact .head-label {display: block; position: relative; margin-bottom: 20px;}
#footer_contact .head-label::after {content: ''; position: absolute; bottom: -10px; width: 50px; height: 4px; left: 50%; transform: translate(-50%, 0); background-color: #243156;}
#footer_contact .btn a {margin-bottom: 0;}
#footer_contact .telnum a {color: #243156;}
.telnum i,
.ordersheet i {margin-right: 5px;}
.ordersheet a {font-size: 13px;}

#footer_inner {max-width: 1100px; margin: 0 auto; padding: 10px;}
#footer_inner img { display: none;}
#footer li {margin-bottom: 10px; font-size: 12px;}
#footer .foot-list-corp li:last-child a,
#footer .foot-list-corp li:nth-last-child(2) a,
#footer .foot-list-corp li:nth-last-child(3) a { display: block; width: 40px; height: 40px; object-fit: cover; text-indent: -9999px; float: left; margin-right: 10px;}
#footer .foot-list-corp li:last-child a { background: url(https://shoubou.xsrv.jp/apollo2/wp-content/themes/apollocapNow/logo-fb.png) left top no-repeat round; width: 34px; height: 34px; margin-top: 3px;}
#footer .foot-list-corp li:nth-last-child(2) a { background: url(https://shoubou.xsrv.jp/apollo2/wp-content/themes/apollocapNow/logo-insta.png) left top no-repeat round;}
#footer .foot-list-corp li:nth-last-child(3) a { background: url(https://shoubou.xsrv.jp/apollo2/wp-content/themes/apollocapNow/logo-x.png) left top no-repeat round;}

#footer ul.menu li ul {margin: 10px 0 0 10px;}
#footer ul.menu li ul li::before {content: '- ';}

copy {
    clear: both;
    margin-top: 40px;
    display: block;
    text-align: center;
    font-size: 12px;
    padding: 15px;
    border-top: solid 1px #ccc;
    background-image: linear-gradient(0deg, rgba(240, 240, 240, 1), rgba(255, 255, 255, 1));}

#pagetop a {position: fixed; right: 20px; bottom: 20px; overflow: hidden; width: 60px; height: 60px; border-radius: 30px; background-color: #fff; cursor: pointer; box-shadow: 3px 3px 5px rgba(0,0,0,0.1); opacity: 0.4; transition: opacity 0.3s;  z-index: 1000;}
#pagetop a::after{content: ""; background-color: #ccc; height: 1rem; width: 1rem; -webkit-mask: url("arrow.svg"); mask: url("arrow.svg"); -webkit-mask-size: cover; mask-size: cover; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%) rotate(-90deg);}
#pagetop a:hover {opacity: 1; background-color: #0077B3;}
@media(1000px < width) {
    .home #footer_wrapper {margin-top: 100px;}
    #footer h2 {font-size: 36px;}
    #footer h2 br {display: block;}

    #footer_inner {display: flex; padding: 40px 0 0;}
    #footer_inner > * {border-left: solid 1px #fff; border-right: solid 1px #ccc; padding: 0 40px; width: 100%;}
    #footer_inner > *:first-child {padding-left: 0; border-left: none;}

    #footer_contact_inner > div {width: calc((100% - 80px) / 3); margin-right: 40px; padding: 20px 10px;}
    #footer_contact_inner > div:nth-of-type(3) {margin-right: 0;}
    #footer_contact_inner .btn {margin: 0 10px;}

    #footer_nav nav { padding: 60px 0;}
    #footer_nav nav ul {display: flex; flex-wrap: wrap;}
    #footer_nav nav li {width: 25%;}

    #footer_inner img { display: block; width: 100%; margin-bottom: 20px;}
}


.wpcf7-response-output {margin-left: 40px; margin-right: 40px; }
.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output, .wpcf7 form.payment-required .wpcf7-response-output {color: #d00; border-color: #d00;}
.wpcf7-spinner {display: block; margin: 0 auto; margin-top: -10px;}
.cf7-cf-turnstile {text-align: center;}
@media(1000px < width) {
    .wpcf7-response-output {
        max-width: 960px;
        margin: 40px auto 0 !important;
    }
}