/* =========================
    base
========================= */
*,
*::before,
*::after { box-sizing: border-box; }

body{
    margin:0;
    font-family:"Hiragino Sans","Yu Gothic",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    color:#11384F;
    background:#fff;
}

img{ max-width:100%; height:auto; display:block; }

/* =========================
    header
========================= */
.site-header{
    border-bottom:1px solid #e5e5e5;
}
.header-inner{
    max-width:1200px;
    margin:0 auto;
    padding:10px 0px;
    display:flex;
    justify-content:end;
    align-items:center;
}
.header-inner img{
    max-width:250px;
    height:60px;
}

/* =========================
    MV
========================= */
.hero{
    position:relative;
    overflow:hidden;
}
.hero-photo img{
    width:100%;
}
.hero-overlay{
    position:absolute;
    inset:0;
    background:linear-gradient(to bottom,rgba(0,0,0,0.25) 0,rgba(0,0,0,0) 45%,rgba(0,0,0,0.2) 100%);
}
.hero-copy{
    position:absolute;
    top:45%;
    left:50%;
    transform:translate(-50%,-50%);
    width:100%;
    max-width:1100px;
    text-align:center;
}
.hero-copy p{
    font-size: 3.5rem;
    line-height: 60px;
    padding-bottom: 30px;
    letter-spacing: 30px;
    font-weight: 600;
}
@media screen and (max-width:1100px) {
    .hero-copy p{
        font-size: 4.5vw;
    }
}
.hero-copy span{
    font-size: 1.3rem;
    line-height: 40px;
}

/* =========================
    section base
========================= */
.section{
    margin:0 auto;
}
.section-inner{
    max-width:1200px;
    margin:0 auto;
    padding:60px 0px 100px;
}

.section-blue{
    background:linear-gradient(#dff9ff 0,#AFEAFF 100%);
    border-radius:80px 80px 0 0;
    position:relative;
    margin-top:-100px;
    padding-bottom:100px;
}
.section-blue .section-inner{
    position: relative;
}
.section-blue .section-inner .point{
    position: fixed;
    right: 5vw;
    bottom: 50px;
    z-index: 99;
}

.section-green{
    background:linear-gradient(#F3FBE9 0,#C9EA9C 100%);
    border-radius:80px 80px 0 0;
    position:relative;
    margin-top:-100px;
}

/* =========================
    title block
========================= */
.title-header img {
    max-width: 180px;
    width: 100%;
    margin: 50px auto 30px;
}
.title-header p{
    font-size: 1.5rem;
    text-align: center;
    line-height: 50px;
    font-weight: 600;
}
.title-header span{
    font-size: 1.1rem;
    text-align: center;
    line-height: 35px;
    display: block;
    margin: 30px auto;
}
.title-block{
    text-align: center;
    display: flex;
    gap: 30px;
    max-width: 1100px;
    margin: 80px auto;
    align-items: center;
}
.title-main{
    max-width: 800px;
    margin: 0 auto 50px;
}
.title-main img{
    width: 100%;
}
.title-info{
    margin-top: 24px;
    font-size: 1rem;
    line-height: 1.8;
    letter-spacing: 0.05em;
    text-align: left;
    max-width: 800px;
    margin: auto;
}
.title-info-head{
    margin: 0 0 12px;
    font-weight: 600;
    margin-left: -10px;
}
.title-info-list{
    display: grid;
    grid-template-columns: 8em 1fr;
    row-gap: 5px;
    column-gap: 12px;
    margin: 0;
}
.title-info-list dt{
    font-weight: 500;
    color: #333;
    white-space: nowrap;
}
.title-info-list dd{
    margin: 0;
    color: #333;
}

.title-info-list a{
    text-decoration: underline;
}

/* ============================================================
    カルーセル
============================================================ */

.gc-slider-wrap {
    max-width:1200px;
    margin:60px auto 0;
    text-align:center;
}

.gc-subtitle {
    font-size:22px;
    color:#1a1a1a;
    margin-bottom:28px;
    font-weight:600;
}

.gc-slider-frame {
    background:#ffffff;
    border-radius:30px;
    padding:70px 40px 90px;
    box-shadow:0 10px 26px rgba(0,0,0,0.06);
    position:relative;
}

.gc-slider img {
    width:auto;
    max-width:760px;
    margin: 30px auto 30px;
}

.gc-caption {
    margin-top: 0px;
    margin-bottom: 30px;
    font-size: 1rem;
    color: #11384F;
}

/* ============= 矢印（内側・丸・水色） ============= */
.swiper-button-prev,
.swiper-button-next {
    width:44px !important;
    height:44px !important;
    background:#05acff99 !important;
    border-radius:50%;
    top:50% !important;
    transform:translateY(-50%);
}

.swiper-button-prev { left:5px !important; }
.swiper-button-next { right:5px !important; }

.swiper-button-prev::after,
.swiper-button-next::after {
    color:#fff !important;
    font-size:18px;
}
.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled{
    opacity: .5;
}
.swiper-slide{
    margin: auto;
}
.gc-progress {
    width:100%;
    max-width: 820px;
    height:5px;
    margin:38px auto 0;
    position:relative;
}

.gc-progress::before {
    content:"";
    position:absolute;
    inset:0;
    background:#d8dce1;
    border-radius:99px;
}

.gc-progress-thumb {
    position:absolute;
    left:0;
    top:0;
    width:50px;
    height:5px;
    background:#05AAFF;
    border-radius:99px;
    transition:transform .22s ease-out;
}

/* =========================
    CTA
========================= */
.primary-cta-wrap{
    text-align:center;
    margin-top:60px;
}
.btn-primary{
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 15px 60px 15px 60px;
    margin-top: 16px;
    border-radius: 999px;
    background: #05AAFF;
    color: #fff;
    font-size: 1rem;
    text-decoration: none;
    line-height: 1;
}
.btn-primary:after{
    content: "";
    position: absolute;
    right: 18px;
    width: 8px;
    height: 8px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    transform: rotate(45deg);
    top: 0;
    bottom: 0;
    margin: auto;
}

.section-blue-note{
    margin-top:32px;
    text-align:center;
    font-size:13px;
    color:#0095e9;
}

/* =========================
    solution section
========================= */
.solution-header{
    text-align:center;
    margin-bottom: 80px;
    font-size:1.5rem;
    line-height: 50px;
    font-weight: 600;
}
.solution-header img{
    max-width: 180px;
    width: 100%;
    margin:50px auto 30px;
}
.solution-row{
    display:flex;
    align-items:center;
    gap:40px;
    margin-bottom:80px;
}
.solution-row.reverse{
    flex-direction:row-reverse;
}
.solution-thumb{
    flex:0 0 670px;
}
.solution-thumb img{
    border-radius:18px;
}
.solution-text{
    flex:1;
    font-size:13px;
    line-height:1.9;
}
.solution-text p{
    font-size: 1.1rem;
}
.solution-title{
    font-size: 2rem;
    margin: 0 0 10px;
    font-weight: 600;
}
.btn-more{
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 15px 60px 15px 60px;
    margin-top: 30px;
    border-radius: 999px;
    background: #11384F;
    color: #fff;
    font-size: 1rem;
    text-decoration: none;
    line-height: 1;
}

.btn-more::after{
    content: "";
    position: absolute;
    right: 18px;
    width: 8px;
    height: 8px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    transform: rotate(45deg);
    top: 0;
    bottom: 0;
    margin: auto;
}

/* =========================
    footer
========================= */
.site-footer{
    margin-top:0;
    font-size:12px;
    color:#333;
}
.footer-inner{
    max-width:1200px;
    margin:0 auto;
    padding:26px 20px 16px;
}
.footer-note{
    margin:0 0 12px;
}
.footer-line{
    border-top:1px solid #284660;
    margin-bottom:10px;
}
.footer-links-row{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px;
}
.footer-links{
    font-size:11px;
    line-height:1.8;
}
.footer-links a{
    color:#333;
    text-decoration:none;
}
.footer-links a:hover{
    text-decoration:underline;
}
.footer-copy{
    font-size:11px;
    white-space:nowrap;
}
.footer-bottom-bar{
    margin-top:18px;
    height:26px;
    background:#173549;
}


.inquiry {
    width: 100%;
    max-width: 1200px;
    margin: auto;
    background: #fff;
    padding-top: 8px;
    padding-bottom: 5px;
    white-space: nowrap;
}
.inquiry a{color:#0C2538;}
.inquiry a:hover {
    color: #005393;
}

.h_menu {
    font-size: 13px;
    color: #666;
}

.h_menu {
    display: flex;
    justify-content: right;
    gap: 20px;
}

.h_menu li {
    /* padding: 0 5px; */
    line-height: 1.1em;
    font-size: 13px;
    list-style: none;
}

.swiper {
    max-width: 820px;
    background: #F2FBFF;
    border-radius: 30px;
}
.inline-pc{
    display: inline;
}

@media screen and (max-width:767px) {
    
    .header-inner{
        justify-content: end;
        width: 90%;
    }
    .inquiry{
        display: none;
    }
    .hero-copy p {
        font-size: 1.8rem;
        letter-spacing: 10px;
    }
    .section-blue {
        border-radius: 40px 40px 0 0;
        margin-top: -30px;
        padding-bottom: 100px;
    }
    .section-blue .section-inner .point{
        right: 0;
        bottom: 20%;
        width: 100px;
    }
    .title-block{
        flex-wrap: wrap;
    }
    .title-header{
        width: 90%;
        margin: auto;
    }
    .title-header p{
        font-size: 1.2rem;
    }
    .title-header span {
        font-size: 0.9rem;
    }

    .title-info {
        font-size: 0.85rem;
    }
    .title-info-list {
        grid-template-columns: 5em 1fr;
    }
    .title-block{
        width: 90%;
    }
    .swiper {
        border-radius: 20px;
        padding: 20px;
        width: 100%;
    }
    .section-inner{ padding:40px 0px 0px; }

    .gc-slider-frame{
        padding:80px 20px 200px;
        border-radius:38px;
    }

    .swiper-button-prev{ left:8px !important; }
    .swiper-button-next{ right:8px !important; }

    .gc-progress{ width:140px; }
    .gc-progress-thumb{ width:36px; }
    .gc-slider-wrap{
        width: 100%;
    }
    .gc-subtitle{
        font-size: 1.2rem;
        line-height: 35px;
    }
    .gc-caption{
        width: 90%;
        margin: 30px auto;
        line-height: 30px;
    }
    .gc-slider img {
        width: auto;
        max-width: 300px;
        margin: 30px auto 30px;
    }
    .section-green{
        border-radius: 40px 40px 0 0;
        margin-top: -250px;
        padding-bottom: 50px;
    }
    .solution-header{
        font-size: 1.2rem;
    }
    .solution-title {
        font-size: 1.3rem;
    }
    .solution-row{
        flex-wrap: wrap;
    }
    .solution-thumb{
        flex: unset;
    }
    .section-green .section-inner{
        width: 90%;
    }
    .solution-text p{
        font-size: 0.9rem;
    }
    .btn-more{
        display: table;
        margin: 50px auto 0;
    }
    

    .footer-links-row{
        flex-wrap: wrap;
        justify-content: center;
    }
    .footer-links {
        width: 100%;
    }
    .inline-pc{
        display: none;
    }
    .footer-links a {
        display: block;
    }

}

body {
  font-family:
    "Meiryo",
    "メイリオ",
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    "Yu Gothic",
    "游ゴシック",
    sans-serif;
  font-weight: 500;
}