/* ----- ----- root ----- ----- */
:root {
    --color-black: #1a1a1a;
    --sec-padding1: 8rem 0;
    --transition: 0.3s;
    --scroll-margin: 130px;
}

a {
    transition: 0.3s;
}

a:focus {
    outline: none;
}

/* ----- ----- global ----- ----- */
html {
    font-size: 14px;
    scroll-behavior: smooth;
}

body {
    color: #24324b;
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 14px;
    letter-spacing: 0.06rem;
    counter-reset: number 0;
}

.page {
    margin: 0;
}

.container {
    max-width: 1080px;
    margin: 0 auto;
    padding: 0 30px;
}

.home section, .company section, .custom section {
    padding: var(--sec-padding1);
}

.page-content, .entry-content, .entry-summary {
    margin: 0;
}

ul {
    margin: 0;
    padding: 0;
}

li {
    list-style: none;
}

a, a:hover {
    color: #23314c;
    text-decoration: none;
}

img {
    max-width: 100%;
}

.text-c {
    text-align: center;
}

.text-r {
    text-align: right;
}

.block {
    display: block;
}

.red {
    color: #ff0000;
    font-size: 1.5rem;
}


/* ----- ----- font ----- ----- */
h1, h2, h3, h4, h5, h6 {
    line-height: 1.5;
}

h2 {
    margin-bottom: 1rem;
}

p {
    line-height: 2.4rem;
}

.section-title {
    font-family: "Questrial", sans-serif;
    font-size: 3.571rem;
    letter-spacing: .2rem;
    margin-top: 0;
    margin-bottom: 3rem;
}

.lead {
    font-size: 1.714rem;
    font-weight: 600;
    line-height: 3.2rem;
}

.lead span {
    display: block;
}

.jp {
    font-size: 1.285rem;
    font-weight: 300;
    display: block;
    line-height: normal;
}


/* ----- ----- button ----- ----- */
/* ----- btn1 ----- */
.btn1 {
    border: 1px solid;
    padding: 10px 10px;
    border-radius: 2rem;
    color: #ffffff !important;
}


/* ----- btn2 ----- */
.btn2 {
    display: inline-block;
    padding: 10px 10px 10px 0;
}

.btn2::after {
    content: '\2192';
    display: inline;
    background: #1f7dcc;
    color: #ffffff;
    font-size: 1.5rem;
    margin-left: 15px;
    padding: 17px;
    border-radius: 2rem;
    transition: 0.3s;
}

.btn2:hover::after {
    background: #3ac8e1;
}


/* ----- btn3 ----- */
.btn3 {
    position: relative;
    margin: 1em;
    display: inline-block;
    padding: 30px 30px;
    transition: all 0.3s ease-in-out;
    min-width: 472px;
}

.btn3:before,
.btn3:after {
    content: '';
    display: block;
    position: absolute;
    border-color: #24324b;
    box-sizing: border-box;
    border-style: solid;
    width: 1em;
    height: 1em;
    transition: all 0.3s ease-in-out;
    z-index: 5;
    width: calc(100% + -30px);
    height: calc(100% + 0px);
}

.btn3:before {
    top: -2px;
    left: -2px;
    border-width: 2px 0 0 2px;
}

.btn3:after {
    bottom: -2px;
    right: -2px;
    border-width: 0 2px 2px 0;
}

.btn3:hover:before,
.btn3:hover:after {
    width: calc(100% + 4px);
    height: calc(100% + 4px);
    border-color: #1f7dcc;
}

.btn3:hover {
    color: #fff;
    background-color: #1f7dcc;
    border-color: #1f7dcc;
}


/* ----- pagination ----- */
.custom-pagination {
    display: flex;
    justify-content: center;
    gap: 10px;
    padding: 30px 0;
    list-style: none;
}

.custom-pagination .page-item a,
.custom-pagination .page-item span {
    display: inline-block;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    font-size: 16px;
    color: #1a1a1a;
    border: 1px solid #cccccc;
    border-radius: 3px;
    text-decoration: none;
    transition: background 0.3s;
}

.custom-pagination .page-item.active span {
    background-color: #1f7dcc;
    color: #fff;
    border: none;
}

.custom-pagination .page-item a:hover {
    background-color: #1f7dcc;
    color: #fff;
}


/* ----- ----- header ----- ----- */
body.admin-bar header.site-header {
    top: 32px;
}

.site-header {
    padding: 10px 0;
}

header.site-header {
    top: 0;
    left: 0;
    width: 100%;
    z-index: 100;
}

header .container {
    max-width: 1800px;
    padding: 0 25px;
}

.site-header.scrolled {
    background: #ffffff;
}

header.site-header {
    position: fixed;
}

.site-header {
    position: sticky;
    top: 0;
    left: 0;
    right: 0;
    color: #ffffff;
    align-items: center;
    justify-content: center;
    transition: background-color 0.5s ease;
    z-index: 1000;
}

.site-header.header-hidden {
    transform: translateY(-100%);
}

.site-branding {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    z-index: 999999;
}

.site-branding .custom-logo-link {
    max-width: 310px;
    transition: all 0.3s ease;
    z-index: 100;
}

.scrolled .site-branding .custom-logo-link {
    max-width: 280px;
    transition: all 0.3s ease;
    z-index: 100;
}

header .site-branding .st2 {
    transition: fill .5s ease;
}

header.scrolled .site-branding .st1, header.open .site-branding .st1 {
    fill: #54abd8 !important;
}

header.scrolled .site-branding .st2, header.open .site-branding .st2 {
    fill: #068cce !important;
}


/* ----- header-title ----- */
.page-header .container {
    display: flex;
    align-items: center;
    height: 100%;
}

.page-header {
    background-position: center;
    height: 400px;
}

.page-header h1, .single .page-header .page-title, .archive .page-header .page-title {
    color: #ffffff;
    font-size: 1.285rem;
    font-weight: normal;
    margin-top: 10rem;
}

.page-header h1::before, .single .page-header .page-title::before, .archive .page-header .page-title::before, .error404 .page-header .page-title::before {
    font-family: "Questrial", sans-serif;
    font-size: 3.571rem;
    display: block;
    line-height: 4rem;
    letter-spacing: .2rem;
    margin-bottom: .6rem;
}


/* company */
.page.company h1::before {
    content: 'COMPANY';
}

/* custom */
.page.custom h1::before {
    content: 'CUSTOM HOME';
}

/* contact */
.page.contact h1::before {
    content: 'CONTACT';
}

/* privacy-policy */
.page.privacy-policy h1::before {
    content: 'PRIVACY POLICY';
}

/* news */
body.blog h1::before, .single .page-header .page-title::before, .archive .page-header .page-title::before {
    content: 'NEWS';
}

/* 404 */
.error404 h1::before {
    content: '404';
}


/* ----- header-image ----- */
.page-header {
    background-size: cover;
    background-position: center;
    margin-bottom: 3rem;
}

.page.company .page-header {
    background-image: url(../images/sakujo_ok/dummy7.jpg);
}

.page.custom .page-header {
    background-image: url(../images/sakujo_ok/dummy7.jpg);
}

.page.contact .page-header {
    background-image: url(../images/sakujo_ok/dummy7.jpg);
}

.page.privacy-policy .page-header {
    background-image: url(../images/sakujo_ok/dummy7.jpg);
}

.archive .page-header, .blog .page-header, .single-post .page-header {
    background-image: url(../images/sakujo_ok/dummy7.jpg);
}

.error404 .page-header {
    background-image: url(../images/sakujo_ok/dummy7.jpg);
}

/* ----- ----- footer ----- ----- */
footer {
    background-color: #f6f5f1;
    padding: 20px 0;
    margin-top: 50px;
}

footer .container.top {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-top: 3rem;
    margin-bottom: 4rem;
}

footer .logo {
    display: inline-block;
    margin-bottom: 1.5rem;
}

footer .name {
    margin-bottom: .5rem;
}

footer .address {
    margin-bottom: .5rem;
}

footer .postcode {
    margin-right: 10px;
}

footer .tel2 {
    font-size: 1.357rem;
    margin-top: 3rem;
}

footer .tel2 a, header .tel2 a {
    font-size: 2rem;
}

footer .btn1, header.site-header .btn1 {
    background-color: #1f7dcc;
    border-color: #1f7dcc;
    display: flex;
    align-items: center;
    margin-top: 2rem;
    padding: 10px 20px;
    width: 258px;
}

footer .btn1:hover, header.site-header .btn1:hover {
    background-color: #3ac8e1;
    border-color: #3ac8e1;
}

footer .btn1::before,  header.site-header .btn1::before {
    content: '';
    background-image: url(../images/common/icon_mail.svg);
    background-size: cover;
    background-position: center;
    width: 23px;
    height: 18px;
    display: inline-block;
    margin-right: 10px;
}

footer .btn1::after, header.site-header .btn1::after {
    content: '\2192';
    color: #ffffff;
    margin-left: auto;
    transition: 0.3s;
}

footer .list ul {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 2rem;
}

footer .list a {
    font-size: 1.428rem;
    display: inline-block;
}

footer .list .jp {
    font-size: 0.928rem;
}

footer a .jp {
    display: block;
}

#colophon {
    text-align: right;
}


/* ----- ----- breadcrumb ----- ----- */
.breadcrumb ul {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5em;
    font-size: 0.9em;
    padding: 0;
    margin: 0 0 3em 0;
}
.breadcrumb li::after {
    content: ">";
    margin: 0 0.5em;
}
.breadcrumb li:last-child::after {
    content: "";
}
.breadcrumb a {
    text-decoration: none;
}


/* ----- ----- btn ----- ----- */
/* ----- btn1 -----*/


/* ----- ----- common ----- ----- */


/* ----- layout -----*/
.full {
    width: 100vw;
    margin: 0 calc(50% - 50vw);
}

/* ----- ----- top ----- ----- */
/* ----- common ----- */
.home #about .lead, .home #estate .lead, .home #building .lead, .home #company .lead {
    line-height: 3.2rem;
}

/* ----- hero -----*/
#hero {
    background-image: url(../images/top/wisecope_fv_cp.webp);
    background-size: cover;
    background-position: 25% center;
    display: flex;
    height: 100vh;
    align-items: center;
    padding: 1rem;
}

#hero .lead {
    color: #ffffff;
    font-size: 2.457rem;
    /* width: 33%; */
    right: 8%;
    position: absolute;
    font-weight: 300;
    letter-spacing: .4rem;
    line-height: 4.9rem;
}

#hero .lead span {
    display: block;
}


/* ----- about -----*/
#about {
    display: flex;
    justify-content: center;
    gap: 20px;
}

#about .title {
    width: 40%;
}

#about .text {
    width: 60%;
}


/* ----- search -----*/
#search {
    padding: 0;
}

#search .inner {
    display: flex;
    justify-content: center;
    gap: 20px;
    margin: 0 60px;
    padding: var(--sec-padding1);
    background-color: #f6f5f1;
}

.search-card {
    background: #ffffff;
    border-top: 8px solid;
    padding: 30px;
    text-align: center;
    flex: 1;
    max-width: 400px;
}

.search-card.housing {
    border-color: #3ac8e1;
    scroll-margin-top: var(--scroll-margin);
}

.search-card.property {
    border-color: #1f7dcc;
    scroll-margin-top: var(--scroll-margin);
}

.search-card.custom {
    border-color: #ff9454;
    scroll-margin-top: var(--scroll-margin);
}

.search-card .top {
    display: inline-flex;
}

.search-card .title {
    text-align: left;
}

.search-card h2 {
    font-size: 1.357rem;
    letter-spacing: 0.08rem;
    margin: 0;
}

.search-card .icon::before {
    content: '';
    background-size: cover;
    background-position: center;
    width: 60px;
    height: 60px;
    display: inline-block;
    margin-right: 15px;
}

.search-card.housing .icon::before  {
    background-image: url(../images/top/icon_housing.svg);
}

.search-card.property .icon::before  {
    background-image: url(../images/top/icon_property.svg);
}

.search-card.custom .icon::before  {
    background-image: url(../images/top/icon_custom.svg);
}

.search-card h2 strong {
    font-size: 1.928rem;
}

.search-card h2 span {
    font-size: 0.857rem;
    display: block;
}

.search-card .image {
    width: 100%;
    height: 200px;
    background-size: cover;
    background-position: center;
    border-radius: 1rem;
    margin-bottom: 2rem;
}

.search-card p {
    font-size: 1.142rem;
}

.search-card ul {
    display: flex;
    gap: 20px;
}

.search-card ul li {
    width: 50%;
}

.search-card .btn1 {
    display: block;
}

.search-card.housing .btn1, a.category-land {
    background-color: #3ac8e1;
    border-color: #3ac8e1;
}

.search-card.housing .btn1:hover, a.category-land:hover {
    background-color: #ffffff;
    color: #3ac8e1 !important;
}

.search-card.property .btn1, a.category-property {
    background-color: #1f7dcc;
    border-color: #1f7dcc;
}

.search-card.property .btn1:hover, a.category-property:hover {
    background-color: #ffffff;
    color: #1f7dcc !important;
}

.search-card.custom .btn1, a.category-news {
    background-color: #ff9454;
    border-color: #ff9454;
}

.search-card.custom .btn1:hover, a.category-news:hover {
    background-color: #ffffff;
    color: #ff9454 !important;
}


/* ----- service -----*/
#service {
    padding-top: 0;
    padding-bottom: 0;
    scroll-margin-top: var(--scroll-margin);
}

.service-row {
    display: flex;
    flex-direction: row-reverse;
    padding-top: 0;
    padding-bottom: 0;
}

.service-row .title {
    width: 50%;
    background: #f6f5f1;
    position: relative;
}

.service-row .title::before {
    content: '';
    width: 100px;
    height: 100%;
    background: #f6f5f1;
    display: inline-block;
    position: absolute;
    right: -100px;
}

.service-row .title-inner {
    padding: 7rem 2rem;
    padding-left: 20%;
}

.service-row .image {
    width: 50%;
    position: relative;
    top: -5rem;
    z-index: 1;
}

.service-row .section-title {
    display: inline-flex;
    margin-bottom: 2.5rem;
    line-height: 3.8rem;
}

.service-row .section-title .jp {
    margin-top: 6px;
}

#estate.service-row .section-title::after {
    content: '';
    background-image: url(../images/top/icon_real_estate.svg);
    background-size: cover;
    background-position: center;
    width: 192px;
    height: 53px;
    display: inline-block;
    margin-left: 30px;
    position: relative;
}

#building.service-row .section-title::after {
    content: '';
    background-image: url(../images/top/icon_building.svg);
    background-size: cover;
    background-position: center;
    width: 81px;
    height: 58px;
    display: inline-block;
    margin-left: 30px;
    position: relative;
}

.service-row .btn {
    margin-top: 3rem;
}

.service-row .btn li {
    margin-bottom: 2rem;
}

.service-row .btn li:last-child {
    margin-bottom: 0;
}


/* ----- news -----*/
#news {
    display: flex;
}

#news .title {
    width: 315px;
}

#news .list {
    width: calc(100% - 315px);
}

.new-posts-list li {
    border-bottom: 1px solid #d0d5dd;
    display: flex;
    align-items: center;
    padding: 1.5rem 2rem;
}

.new-posts-list .post-category {
    margin-right: 2rem;
}

.new-posts-list .post-category .btn1 {
    font-size: 0.714rem;
    padding: 4px 10px;
}

.new-posts-list .post-date {
    font-size: 0.857rem;
    margin-right: 1rem;
}

#news .title-wrapper {
    width: calc(100% - 200px);
}

#news .post-title {
    padding: 10px 20px;
}

#news .sp.btn2 {
    display: none;
}


/* ----- company -----*/
#company {
    padding-bottom: 2.5rem;
}

#company .top {
    display: flex;
    margin-bottom: 7rem;
}

#company .top .title, #company .top .image {
    width: 50%;
}

#company .title-inner {
    padding-right: 2rem;
}

#company iframe {
    width: 100%;
    margin-bottom: 7rem;
}

#recruit {
    text-align: center;
    margin-bottom: 7rem;
}

#recruit .title {
    display: block;
    font-size: 1.714rem;
    font-weight: 600;
    margin-bottom: 5px;
}

#recruit .title::after {
    content: '';
    display: inline-block;
    width: 12px;
    height: 12px;
    background-color: currentColor;
    -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 11.6 11.6"><polyline fill="none" stroke="black" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" points="3.9,1.3 0.5,1.3 0.5,11.1 10.3,11.1 10.3,7.3"/><line fill="none" stroke="black" stroke-miterlimit="10" x1="5.4" y1="6.2" x2="11.1" y2="0.5"/><polyline fill="none" stroke="black" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" points="11.1,4.8 11.1,0.5 6.8,0.5"/></svg>') no-repeat center;
    mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 11.6 11.6"><polyline fill="none" stroke="black" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" points="3.9,1.3 0.5,1.3 0.5,11.1 10.3,11.1 10.3,7.3"/><line fill="none" stroke="black" stroke-miterlimit="10" x1="5.4" y1="6.2" x2="11.1" y2="0.5"/><polyline fill="none" stroke="black" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" points="11.1,4.8 11.1,0.5 6.8,0.5"/></svg>') no-repeat center;
    margin-left: 10px;
}

/* ----- contact btn -----*/
#contact a {
    display: block;
    justify-content: center;
    align-items: center;
    margin: 0 60px;
    padding: 0 2rem;
    background-color: #1f7dcc;
    position: relative;
    border-radius: 20px;
}

#contact .inner {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 60px;
    padding: 6.5rem 0;
    position: relative;
    border-radius: 20px;
    margin: 0 auto;
    max-width: 1050px;
}

#contact .title {
    text-align: center;
}

#contact a {
    color: #ffffff;
    margin-top: 6rem !important;
}

#contact .arrow {
    position: absolute;
    right: 0;
}

#contact .arrow::after {
    content: '\2192';
    display: inline;
    background: #ffffff;
    color: #1f7dcc;
    font-size: 1.5rem;
    margin-left: 15px;
    padding: 17px;
    border-radius: 2rem;
    transition: 0.3s;
}

#contact a:hover {
    background: #3ac8e1;
}

#contact h2 {
    font-family: "Questrial", sans-serif;
    font-size: 2.857rem;
    line-height: normal;
    letter-spacing: .25rem;
    margin-top: 0;
}

#contact h2::before {
    content: '';
    background-image: url(../images/common/icon_mail.svg);
    background-size: cover;
    background-position: center;
    width: 34px;
    height: 26px;
    display: inline-block;
    margin-right: 10px;
}


/* ----- ----- page ----- ----- */
/* ----- company ----- */
.company #make h2, .company #features h2, .company #access h2 {
    font-size: 1.714rem;
}

#make {
    display: flex;
    justify-content: center;
    flex-direction: row-reverse;
    gap: 40px;
    padding-top: 0;
}

#make .image {
    width: 40%;
    display: flex;
    justify-content: center;
    align-items: center;
}

#make .text {
    width: 60%;
}

#features {
    background: #f6f5f1;
}

#features h2 {
    margin-bottom: 4rem;
    text-align: center;
}

#features li {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 40px;
}

#features li:last-child {
    margin-bottom: 0;
}

#features li::before {
    content: '';
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    height: 75px;
    display: inline-block;
    margin-right: 10px;
}

#features li:nth-child(1)::before {
    background-image: url(../images/page/num_1.svg);
    width: 99px;
}

#features li:nth-child(2)::before {
    background-image: url(../images/page/num_2.svg);
    width: 115px;
}

#features li:nth-child(3)::before {
    background-image: url(../images/page/num_3.svg);
    width: 115px;
}

#features li .inner {
    width: calc(100% - 160px);
    margin-left: 30px;
    padding-left: 30px;
    border-left: 1px solid #000;
}

#features h3 {
    font-size: 1.428rem;
    margin-top: 0;
    margin-bottom: 0;
}

#features p {
    line-height: 1.6rem;
    margin-bottom: 0;
}

#overview table {
    border-collapse: collapse;
}

#overview th, #overview td {
    border-bottom: 1px solid #cfd4dc;
    padding: 40px 10px 40px 0;
}

#overview th {
    font-size: 1.285rem;
    text-align: left;
    width: 160px;
}

#overview th {
    font-size: 1.142rem;
}

.company #access {
    padding-top: 0;
}

.company #access h2 {
    margin-bottom: 4rem;
    text-align: center;
}

#access iframe {
    width: 100%;
}


/* ----- custom ----- */
#our {
    padding-top: 0;
}

#our .top {
    display: flex;
    margin-bottom: 5rem;
}

#our .top .title {
    width: 50%;
}

#our .top .text {
    width: 50%;
}

#our .title-inner {
    padding-right: 2rem;
}

#our .image {
    max-width: 800px;
    margin: 0 auto;
}

#our .image img {
    border-radius: 10px;
}

#pride {
    background-image: url(../images/page/custom_pride.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    color: #ffffff;
}

#pride .inner {
    max-width: 860px;
    margin: 0 auto;
    padding-left: 20px;
    padding-right: 20px;
    text-align: center;
}

#pride h2 {
    font-size: 1.714rem;
    margin-bottom: 4rem;
}

#pride h3 {
    margin-bottom: .6rem;
}

#pride p {
    margin-top: 0;
}

#pride ul {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 2rem;
    justify-items: center;
}

#pride ul li {
    width: 30vw;
    height: 30vw;
    max-width: 235px;
    max-height: 235px;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    border: 1px solid #ffffff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 1rem;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    transition: transform 0.3s;
}

#pride h3 span {
    display: block;
}

#pride h3::before {
    display: inline-block;
    margin-bottom: 1rem;
}

#pride .one h3::before {
    content: url(../images/page/numw_1.svg);
}

#pride .two h3::before {
    content: url(../images/page/numw_2.svg);
}

#pride .three h3::before {
    content: url(../images/page/numw_3.svg);
}

#pride p span {
    display: block;
}

#pride-list {
    background: #f4f3ef;
}

#pride-list li {
    display: flex;
    flex-direction: row-reverse;
    border-bottom: 1px solid #cfd4dc;
    padding: 4rem 0;
}

#pride-list li:first-child {
    border-top: 1px solid #cfd4dc;
}

#pride-list h3 {
    font-size: 1.714rem;
}

#pride-list h3::before {
    display: block;
    margin-bottom: 1rem;
}

#pride-list .one h3::before {
    content: url(../images/page/nums_1.svg);
}

#pride-list .two h3::before {
    content: url(../images/page/nums_2.svg);
}

#pride-list .three h3::before {
    content: url(../images/page/nums_3.svg);
}

#pride-list li .text, #pride-list li .image {
    width: 50%;
}

#pride-list li .text {
    padding-left: 3rem;
}

#slide {
    padding-top: 0;
    padding-bottom: 0;
}

.slider-wrapper {
    overflow: hidden;
    width: 100%;
}

.slider-track {
    display: flex;
    width: max-content;
    animation: scrollLinear 40s linear infinite;
}

.slider-track img {
    width: 400px;
    height: auto;
}

@keyframes scrollLinear {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-50%);
    }
}

#qa li {
    margin-bottom: 3rem;
}

#qa li:last-child {
    margin-bottom: 0;
}

#qa li > div {
    padding: 15px 0;
}

#qa .q {
    border-bottom: 1px solid #cfd4dc;
    color: #1f7dcb;
    display: block;
    font-size: 1.142rem;
    font-weight: 600;
}

#qa .a {
    display: block;
}

#qa .inner {
    display: flex;
    align-items: flex-start;
}

#qa .q .inner::before {
    content: 'Q.';
}

#qa .a .inner::before {
    content: 'A.';
}


/* ----- contact ----- */
.contact form {
    max-width: 800px;
    margin: 0 auto;
}

.wpcf7-radio .wpcf7-list-item {
    display: block;
}

.wpcf7-form-control-wrap input, .wpcf7-form-control-wrap textarea {
    padding: 10px;
    margin-top: 5px;
}

.contact textarea {
    border: 1px solid #ccc;
}

.wpcf7 .wpcf7-submit {
    border: 1px solid var(--color-dark-green);
    background: #1f7dcc;
    color: #ffffff;
    font-size: 1.714rem;
    padding: 2rem;
    margin-bottom: 1rem;
    width: 100%;
    transition: 0.3s all ease;
}

.wpcf7 .wpcf7-submit:hover {
    background: #3ac8e1;
}


/* ----- privacy-policy ----- */
.privacy-policy .entry-content section {
    margin: 0 auto;
    margin-bottom: 6rem;
}

.privacy-policy .entry-content li {
    list-style: none;
    margin-bottom: 1rem;
}

.privacy-policy .entry-content section > ul > li {
    border-bottom: 1px solid #cfd4dc;
    margin-bottom: 3rem;
}

.privacy-policy section#list > ul > li {
    padding: 40px 10px 40px 0;
    margin-bottom: 0;
}

.privacy-policy .entry-content h2::before {
    font-size: 1.5rem;
    counter-increment: number 1;
    content: counter(number) '.';
}

.privacy-policy .entry-content li h2 {
    margin-top: 0;
}


/* ----- 404 ----- */
.error404 main .container {
    min-height: 150px;
}


/* ----- ----- custom post ----- ----- */


/* ----- ----- post ----- ----- */
.post-container {
    display: flex;
}

.post-content {
    width: calc(100% - 250px);
    padding-right: 30px;
}

aside {
    width: 250px;
}

.widget {
    margin-bottom: 3rem;
}

.widget li {
    border-bottom: 1px solid #cfd4dc;
}

.widget li a {
    display: inline-block;
    padding: 10px 10px;
}

.widget-area h2 {
    background: #1f7dcc;
    color: #ffffff;
    font-size: 1.142rem;
    font-weight: normal;
    padding: 10px 10px;
}

.single .entry-meta .post-categories a {
    font-size: 0.714rem;
    padding: 5px 10px;
    margin-right: 10px;
}

.single .entry-header h1 {
    border-bottom: 1px solid #cfd4dc;
    font-weight: normal;
    padding: 10px 0;
}

/* ----- nav previous next ----- */
.post-navigation .nav-previous, .post-navigation .nav-next {
    flex: 0 1 auto;
}

.nav-links {
    margin-top: 7rem;
}

.nav-next {
    border-left: 1px solid #1f7dcc;
    padding-left: 50px;
}

.nav-previous {
    margin-right: 50px;
}

/* ----- btn ----- */
.nav-subtitle {
    display: inline-block;
    padding: 10px 10px 10px 0;
}

.nav-previous .nav-subtitle::before {
    content: '\2190';
    display: inline;
    background: #1f7dcc;
    color: #ffffff;
    font-size: 1.5rem;
    margin-right: 15px;
    padding: 17px;
    border-radius: 2rem;
    transition: 0.3s;
}

.nav-next .nav-subtitle::after {
    content: '\2192';
    display: inline;
    background: #1f7dcc;
    color: #ffffff;
    font-size: 1.5rem;
    margin-left: 15px;
    padding: 17px;
    border-radius: 2rem;
    transition: 0.3s;
}

.nav-previous a, .nav-next a {
    display: block;
}

.nav-previous a {
    padding-right: 20px;
}

.nav-next a {
    padding-left: 20px;
}

.nav-previous .nav-subtitle {
    margin-right: 20px;
}

.nav-next .nav-subtitle {
    margin-left: 20px;
}

.nav-previous a:hover .nav-subtitle::before, .nav-next a:hover .nav-subtitle::after {
    background: #3ac8e1;
}


/* ----- ----- post archive ----- ----- */



@media screen and (max-width: 1500px) {
    /* ----- ----- top ----- ----- */
    /* ----- service -----*/
    .service-row .title-inner {
        padding-left: 10%;
    }

    .service-row .section-title {
        flex-direction: column-reverse;
    }

    #estate.service-row .section-title::after, #building.service-row .section-title::after {
        margin-left: 0;
        margin-bottom: 1.6rem;
    }

}
        

@media screen and (max-width: 1400px) {
    /* ----- ----- header ----- ----- */
    header.site-header .logo {
        max-width: 200px;
    }

    .main-navigation ul#primary-menu {
        gap: 1rem;
        padding: 10px 30px;
    }


    /* ----- ----- top ----- ----- */
    /* ----- hero -----*/
    #hero {
        background-position: 37% center;
    }

    #hero .lead {
        top: 18%;
    }

    /* ----- search -----*/
    #search .inner {
        margin: 0;
        padding-left: 20px;
        padding-right: 20px;
    }

    .search-card ul {
        display: block;
    }

    .search-card ul li {
        width: 100%;
    }

    .search-card ul li:first-child {
        margin-bottom: 1rem;
    }


    /* ----- contact btn -----*/
    #contact a {
        margin: 0 30px;
    }


}


@media screen and (max-width: 1200px) {
    /* ----- ----- title ----- ----- */
    /* ----- sub-title -----*/


    /* ----- ----- footer ----- ----- */
    footer .info {
        width: 30%;
    }

    footer .list {
        width: 65%;
    }


    /* ----- ----- top ----- ----- */
    /* ----- hero -----*/
    #hero .lead {
        /* width: 45%; */
    }


}


@media screen and (max-width: 991px) {
    /* ----- ----- footer ----- ----- */
    footer .container.top {
        display: block;
    }

    footer .info, footer .list {
        width: 100%;
    }

    footer .info {
        margin-bottom: 4rem;
    }

    footer .list ul {
        grid-template-columns: 1fr 1fr;
    }


    /* ----- ----- top ----- ----- */
    /* ----- hero -----*/
    #hero .lead {
        /* width: 50%; */
    }


    /* ----- about -----*/
    #about {
        display: block;
    }

    #about .title, #about .text {
        width: 100%;
    }

    
    /* ----- search -----*/
    #search .inner {
        display: block;
    }

    .search-card {
        margin: 0 auto 60px;
    }


    /* ----- news -----*/
    #news {
        display: block;
    }

    #news .title, #news .list {
        width: 100%;
    }

    #news .btn2.pc {
        display: none;
    }

    #news .sp.btn2 {
        display: inline-block;
        margin-top: 30px;
        margin-bottom: 60px;
    }


    /* ----- ----- post ----- ----- */
    /* ----- nav previous next ----- */
   

    /* ----- btn ----- */
    .nav-previous .nav-subtitle {
        margin-right: 0;
    }

    .nav-previous {
        margin-right: 0;
        padding-right: 20px;
    }

    .nav-next {
        padding-left: 20px;
    }
    
    /* ----- ----- custom post ----- ----- */


}



@media screen and (max-width: 781px) {
    /* ----- ----- footer ----- ----- */
    footer .list ul {
        grid-template-columns: 1fr 1fr;
    }


    /* ----- ----- button ----- ----- */
    /* ----- btn3 ----- */
    .btn3 {
        margin: auto;
        min-width: 100%;
    }


    /* ----- ----- top ----- ----- */
    /* ----- hero -----*/
    #hero {
        background-image: url(../images/top/wisecope_fv_sp.webp);
    }

    #hero .lead {
        top: 15%;
        right: 0;
        padding: 2rem;
    }


    /* ----- service -----*/
    .service-row {
        display: block;
        background: #f6f5f1;
        padding-bottom: 0 !important;
    }

    .service-row .title, .service-row .image {
        width: 100%;
        top: 0;
    }

    .service-row .title::before {
        content: none;
    }

    .service-row .title-inner {
        padding-top: 4rem;
        padding-left: 2.5rem;
    }

    #estate.service-row, #building.service-row {
        padding-top: 0;
    }
    

    /* ----- company -----*/
    #company .top {
        display: block;
    }

    #company .top .title, #company .top .image {
        width: 100%;
    }

    #company .image {
        margin-top: 3rem;
    }

    #recruit {
        margin-bottom: 0;
    }


    /* ----- custom ----- */
    #pride ul {
        grid-template-columns: 1fr;
    }

    #pride ul li {
        width: 60vw;
        height: 60vw;
    }

    #pride-list li {
        display: block;
    }

    #pride-list li .text, #pride-list li .image {
        width: 100%;
    }

    #pride-list li .text {
        padding-left: 0;
        margin-bottom: 4rem;
    }

    .slider-track img {
        width: 250px;
    }

    /* ----- contact btn -----*/
    #contact .inner {
        display: block;
        text-align: center;
    }

    #contact .arrow {
        display: block;
        margin-top: 3rem;
        position: static;
    }


    /* ----- ----- page ----- ----- */
    /* ----- company ----- */
    #make {
        display: block;
    }

    #make .image, #make .text {
        width: 100%;
    }

    #make .image {
        padding-top: 2rem;
    }


    /* ----- custom -----*/
    #our .top {
        display: block;
    }

    #our .top .title, #our .top .text {
        width: 100%;
    }

    #our .image {
        margin-top: 3rem;
    }


    /* ----- ----- post ----- ----- */
    .post-container {
        display: block;
    }

    .post-content {
        width: 100%;
        padding-right: 0;
    }
    
    aside {
        width: 100%;
        margin-top: 10rem;
        margin-bottom: 8rem;
    }

}


@media screen and (max-width: 480px) {
    /* ----- ----- root ----- ----- */
    :root {
        --sec-padding1: 6rem 0;
    }


    /* ----- ----- font ----- ----- */
    .page .lead span:not(.home .lead span) {
        display: inline;
    }


    /* ----- ----- global ----- ----- */
    .container {
        padding: 0 17px;
    }


    /* ----- ----- header ----- ----- */
    header .container {
        padding: 0 17px;
    }

    .page-header {
        height: 260px;
    }


    /* ----- header-title ----- */
    .page-header h1, .single .page-header .page-title, .archive .page-header .page-title {
        margin-top: 4rem;
    }
    

    /* ----- ----- top ----- ----- */
    /* ----- common ----- */
    .home #about .lead, .home #estate .lead, .home #building .lead, .home #company .lead {
        font-size: 1.514rem;
        line-height: 3rem;
    }


    /* ----- hero -----*/
    #hero {
        height: 70vh;
    }

    #hero .lead {
        font-size: 1.2rem;
        letter-spacing: 0.2rem;
        line-height: 2.4rem;
        padding-left: 17px;
        padding-right: 17px;
    }

    /* ----- news -----*/
    #news .list li, .new-posts-list li {
        display: block;
        padding: 1.5rem 0rem .5rem;
    }

    #news .title-wrapper, .new-posts-list .title-wrapper {
        width: 100%;
        margin-top: 4px;
    }

    #news .post-title, .new-posts-list .post-title {
        display: block;
        padding: 10px 0px;
    }

    .new-posts-list .post-category {
        margin-right: 1rem;
    }


    /* ----- contact btn -----*/
    #contact a {
        margin: 0 17px;
    }


    /* ----- service -----*/
     .service-row .title-inner {
        padding-left: 17px;
        padding-right: 17px;
    }


    /* ----- contact btn -----*/
    #contact .inner {
        padding: 4.5rem 0;
    }

    #contact h2::before {
        display: block;
        margin: 0 auto;
        margin-bottom: 2rem;
    }


    /* ----- ----- page ----- ----- */
    /* ----- common ----- */
    .page.custom h1::before {
        font-size: 2.8rem;
    }

    .page.privacy-policy h1::before {
        font-size: 2.3rem;
    }

    .page .section-title:not(.home .section-title) {
        line-height: normal;
    }

    .page .section-title .jp:not(.home .section-title .jp) {
        margin-top: 7px;
    }


    /* ----- company ----- */
    #features li {
        display: block;
        text-align: center;
    }

    #features li::before {
        height: 34px;
        margin-bottom: 1rem;
    }

    #features li:nth-child(1)::before {
        width: 45px;
    }

    #features li:nth-child(2)::before {
        width: 52px;
    }

    #features li:nth-child(3)::before {
        width: 52px;
    }

    #features li .inner {
        width: 100%;
        border-top: 1px solid #000;
        border-left: none;
        margin-left: 0;
        padding: 1rem 0;
    }

    #features li p {
        text-align: left;
    }

    #overview th {
        width: 120px;
    }
    

    /* ----- contact ----- */
    .wpcf7-form-control-wrap input:not(.wpcf7-radio input), .wpcf7-form-control-wrap textarea {
        width: 100%;
    }


    /* ----- ----- post ----- ----- */
    /* ----- nav previous next ----- */
   .post-navigation .nav-links {
        justify-content: space-between;
   }

    /* ----- btn ----- */
    .nav-subtitle {
        padding: 10px 0px 10px 0;
    }
    
    .nav-previous .nav-subtitle::before {
        font-size: 1.2rem;
        margin-right: 12px;
        padding: 10px;
    }

    .nav-next .nav-subtitle::after {
        font-size: 1.2rem;
        margin-left: 12px;
        padding: 10px;
    }

    .nav-previous .nav-subtitle {
        margin-right: 0;
    }

    .nav-next .nav-subtitle {
        margin-left: 0;
    }

    .nav-next {
        border-left: none;
    }

    .nav-next a {
        padding-left: 0;
    }

    
}