/*------------------------------------------------------------------------------
  PC or ALL 
------------------------------------------------------------------------------*/

.pc .header-logo{
    width: 307px;
}
.header-nav > ul > li{
    margin: 0 13px;
}
.header-nav > ul > li > a span.title.ja{
    color: #1155aa;
    font-family: "Lato", sans-serif;
    font-weight: bold;
    font-style: normal;
    letter-spacing: 0.08em;
    font-size: 1.4rem;
}
.header-nav > ul > li > a span.title.en{
    font-family: "Noto Sans JP", sans-serif;
    font-optical-sizing: auto;
    font-weight: 700;
    letter-spacing: 0.08em;
    font-size: 1.6rem;
}

.mainvisual-catch{
    .copy.ja{
        display: inline-block;
        background: rgba(255,255,2555,.8);
        padding: 5px 10px;
        color: #1155aa;
    }
    .sub-text.en p{
        color: #0d0d0d;
        padding: 2px 10px;
    }
    .sub-text.en p span{
        background: rgba(255,255,2555,.8) !important;
        padding: 2px 10px;
    }
}
.mainvisual{
    margin: 0;
}
.title-type05{
    text-align: center;
    font-size: 4.2rem;
    .marker-blue{
        background: linear-gradient(transparent 75%, #00a0e9 0%);
        padding: 0 20px;
    }
    strong{
        font-size: 5.2rem;
    }
}

.box-wrap.bg.main-slide{
    color: #fff;
    padding: var(--box-margin) 0 0;
    .title-type05 .marker-blue{
        font-size: 5.2rem;
    }
}
.main-slide.box-wrap.bg:before{
    height: 80%;
    background: #1155aa;
}

.main-list.box-wrap.bg:before{
    background: #e2f3ff;
}
.main-list.box-wrap.bg:after{
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translate(-50%, 100%);
    width: calc(var(--vw) * 100);
    height: 30%;
    max-height: 130px;
    background: url(/mwp/wp-content/themes/mwp-theme/assets/images/main-list-after.png) repeat center center / cover;
}
.main-list.box-wrap.bg{
    padding: 0;
    margin: 0 auto 200px auto;
    .box-h2{
        padding-top: 80px;
    }
    .box-h2 strong{
        font-size: 5.2rem;
    }
    .box.image-text-type01.right{
        margin: 0 auto 40px auto;
    }
    .list-check-type01 > ul > li span{
        font-size: 1.8rem !important;
    }
    .list-check-type01{
        justify-content: flex-start;
    }
    .box-ul{
        max-width: 511px;
    }
    .box-h3.ja{
        font-size: 4.2rem;
    }
    .list-check-type01 > ul > li:before{
        font-size: 2.2rem;
        top: -3px;
    }
    .list-check-type01 > ul > li{
        margin: 30px 0;
    }
    .list-check-type01 > ul > li:first-child{
        margin: 0 0 30px;
    }
    .box-h3.ja strong{
        font-size: 5.2rem;
    }
}

.box-wrap.sm{
    padding: 0;
    max-width: 1200px;
}
.title-type05 .en{
    display: block;
    font-size: 2.4rem;
    color: #ee781e;
    margin-bottom: 10px;
}

.box-wrap.sm.main-key{
    .box.image-text-type03 .box-h3{
        color: #1155aa;
    }
}

.box-wrap.sm.main-approach{
    .list-number-type02:after{
        background: #e2f3ff;
    }
    .list-number-type02 ol li:before{
        background: #ee781e;
        border: none;
        color: #fff;
        text-align: center;
        font-family: "Lato", sans-serif;
        font-weight: 900;
        font-style: normal;
        letter-spacing: 0.08em;
        font-size: 4.8rem;
        top: -5px;
    }
    .box-h3.ja{
        text-align: center;
        font-size: 2.9rem;
    }
}
.box-wrap.sm.main-approach{
    .list-number-type02 ol li:before{
        width: 70px;
        height: 70px;
        line-height: 70px;
    }
}

.box-wrap.sm.main-gallery{
    .image img{
        max-width: 355px;
        max-height: 220px;
        object-fit: cover;
    }
    .box-h2 strong{
        font-size: 5.2rem;
    }
    .blog-type04 .swiper-pagination{
        display: none;
    }
}
.pc .box-wrap.bg.main-reason{
    .list-number-type01 ol{
        display: grid;
        grid-template-columns: repeat(3, 1fr);
    }
}
.box-wrap.bg.main-reason{
    margin: 0 auto 0 auto;
    .list-number-type01 ol li{
        background: #0053a6;
        color: #fff;
    }
    .box-h3{
        text-align: center;
    }
    .list-number-type01 ol li:before{
        color: #ee781e;
    }
}
.main-reason .box-wrap.bg:before{
    background: #f0f0f0;
}

.box-wrap.xl.main-con1,
.box-wrap.xl.main-con2{
    .box-h2.ja{
        font-size: 4.4rem;
        margin-bottom: 40px;
    }
    .box-h3.ja{
        font-size: 2.7rem;
    }
    .box-h3.ja > span{
        font-size: 3.3rem !important;
    }
    .box-h3.ja strong span{
        font-size: 5.1rem !important;
    }
    .box .copy{
        font-weight: normal;
    }
    .btn a::before{
        content: "\e158";
        margin: 0 5px 0 0;
        font-family: "Material Symbols Outlined";
        font-variation-settings: "FILL" 1, "wght" 500, "GRAD" 0, "opsz" 20;              
    }
    .btn:nth-child(1) a::before{
        content: "\e0b0";
        margin: 0 5px 0 0;
        font-family: "Material Symbols Outlined";
        font-variation-settings: "FILL" 1, "wght" 500, "GRAD" 0, "opsz" 20;              
    }
    .image-bg-type02 .text{
        max-width: 1200px;
    }
}
.pc .box-wrap.xl.main-con1{
    margin: 0 calc(50% - var(--vw) * 50) 150px;
    .btn-wrap{
        display: flex;
        justify-content: center;
        gap: 40px;
    }
}
.pc .box-wrap.xl.main-con2{
    .btn-wrap{
        display: flex;
        justify-content: center;
        gap: 40px;
    }
}
.pc .box-wrap.xl.main-map iframe{
    height: 400px;
}

.box-wrap.sm.main-staff{
    .box-h3.ja{
        color: #1155aa;
    }
}

.box-wrap.bg.main-menu{
    .box-ul{
        margin-bottom: 40px;
    }
    .banner-type01 ul li .image{
        position: relative;
    }
    .text{
        position: absolute;
        top: 50%;
        left: 0;
        transform: translate(0, -50%);
        width: 100%;
        height: 100%;
    }
    .text a{
        width: 100%;
        height: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
    p{
        font-size: 1.8rem;
    }
}
.main-menu.box-wrap.bg:before{
    background: #f0f0f0;
}

.home .page-content p:not([class]){
    margin: 5px 0;
}

.box-wrap.sm.main-voice{
    .box h3.box-h3{
        font-size: 2.4rem;
    }
    .copy{
        font-size: 1.8rem;
    }
}

.main-news.box-wrap.bg:before{
    background: #e2f3ff;
}

.main-map{
    margin-top: 60px;
}

.footer{
    margin-top: -8px;
    background: #e2f3ff;
}
.pc .footer-main .logo{
    width: 307px;
}
.footer-main:after{
    background: #b9b8b9;
}



/* ======================================
2024/8/20 added by tsuji
======================================== */

/* --------------- Q&Aテーブル --------------- */

.table_qa{
    margin: 0 0 0.8em 0;
    padding: 0;
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
}
/* --- スマホサイトはwidthを15%に設定 --- */
.table_qa  tr:nth-child(2n-1) th{
    padding: 10px;
    width: 6%;
    border-bottom:1px #B9AC9C solid;
    vertical-align:top;
}
.table_qa th{
    padding: 10px;
    width: 6%;
    vertical-align:top;
}
.table_qa td{
    padding: 10px;
	vertical-align:middle;
}
.table_qa tr:nth-child(2n-1) td{
	font-size:18px;
	font-weight:700;
	vertical-align:middle;
	border-bottom:1px #B9AC9C solid;
}

.box001 {
    padding: 20px 30px;
    margin: 15px 20px;
    background: #f3f3f3;
}

.box002 {
    padding: 10px 30px;
    margin: 15px 20px;
    background: #f3f3f3;
}

.box003 {
    padding: 10px 30px;
    margin: 15px 20px;
    background: #f3f3f3;
}

/*------------------------------------------------------------------------------
  TABLET and SHONE
------------------------------------------------------------------------------*/
@media screen and (max-width: 1024px) {
}

/*------------------------------------------------------------------------------
  TABLET ONLY
------------------------------------------------------------------------------*/
@media screen and (min-width: 600px) and (max-width: 1024px) {
}

/*------------------------------------------------------------------------------
  SPHONE ONLY
------------------------------------------------------------------------------*/
@media screen and (max-width: 599px) {
    .mainvisual-catch div.copy{
        font-size: 2.8rem;
    }
    .box-wrap.xl.main-con1{
        .box-h2.ja{
            font-size: 2.8rem;
        }
    }
    .box-wrap.bg.main-menu {
        .text a{
            display: flex;
            flex-direction: column;
            justify-content: center;
        }
    }
    .box-wrap.bg.main-slide {
        .title-type05 .marker-blue{
            font-size: 3.2rem;
        }
    }
    .main-list.box-wrap.bg:before{
        top: -20px;
        height: calc(100% + 20px);
    }


	
/* ======================================
2024/8/20 added by tsuji
======================================== */

/* --------------- Q&Aテーブル --------------- */

.table_qa{
    margin: 0 0 0.8em 0;
    padding: 0;
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
}
/* --- スマホサイトはwidthを15%に設定 --- */
.table_qa  tr:nth-child(2n-1) th{
    padding: 10px;
    width: 15%;
    border-bottom:1px #B9AC9C solid;
    vertical-align:top;
}
.table_qa th{
    padding: 10px;
    width: 15%;
    vertical-align:top;
}
.table_qa td{
    padding: 10px;
	vertical-align:middle;
}
.table_qa tr:nth-child(2n-1) td{
	font-size:18px;
	font-weight:700;
	vertical-align:middle;
	border-bottom:1px #B9AC9C solid;
}

.box001 {
    padding: 20px 10px;
    margin: 15px 0px;
    background: #f3f3f3;
}

.box002 {
    padding: 10px 30px;
    margin: 15px 0px;
    background: #f3f3f3;
}

.box003 {
    padding: 10px 30px;
    margin: 15px 0px;
    background: #f3f3f3;
}
	
}
