@charset "utf-8";

/*
Theme Name: kumamoto_souzok_lp
Theme URI:
Description: The 2021 default theme(responsive) for Mediacross.
Author: Mediacross
Author URI: https://medi-cro.jp/
Version: 2021.10
*/

:root {
    /* color */
    --color-default: #001239;
    --color-border: #ccc;
    --color-red: #c30d23;
    --color-link: #fff444;
    --color-bg1: #fadc32;
    --color-bg2: #eef7ff;

    /* width */
    --contentWidth: 960px;
    --contentWidth2: 770px;
    --contentWidth3: 1120px;
    --contentWidth-px: calc(var(--contentWidth) * 1px);
    --contentWidth2-px: calc(var(--contentWidth2) * 1px);

    /* space */
    --addLR: 5vw;
    --radius: 10px;

    /* more */
    --duration: .3s;

    /* --sub-font: 'Noto Sans JP',sans-serif; */
}
@media screen and (min-width: 769px) {
    :root {
        --addLR: 40px;
    }
}


/**
* Reset
============================== */
/*! destyle.css v3.0.0 | MIT License | https://github.com/nicolas-cusan/destyle.css */
*,:after,:before{box-sizing:border-box;border-style:solid;border-width:0}html{line-height:1.15;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:rgba(0,0,0,0)}body{margin:0}main{display:block}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit;margin:0}address,blockquote,dl,figure,form,iframe,ol,p,pre,table,ul{margin:0}ol,ul{padding:0;list-style:none}dt{font-weight:700}dd{margin-left:0}hr{box-sizing:content-box;height:0;overflow:visible;border-top-width:1px;margin:0;clear:both;color:inherit}pre{font-family:monospace;font-size:inherit}address{font-style:inherit}a{background-color:transparent;text-decoration:none;color:inherit}abbr[title]{text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace;font-size:inherit}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}embed,iframe,img,object,svg{vertical-align:bottom}button,input,optgroup,select,textarea{vertical-align:middle;color:inherit;font:inherit;background:transparent;padding:0;margin:0;border-radius:0;text-align:inherit;text-transform:inherit}[type=button],[type=reset],[type=submit],button{cursor:pointer}[type="button"]:disabled,[type="reset"]:disabled,[type="submit"]:disabled,button:disabled{cursor:default}:-moz-focusring{outline:auto}select:disabled{opacity:inherit}fieldset,option{padding:0}fieldset{margin:0;min-width:0}legend{padding:0}progress{vertical-align:baseline}textarea{overflow:auto}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type=search]{outline-offset:-2px}label[for]{cursor:pointer}details{display:block}summary{display:list-item}[contenteditable]:focus{outline:auto}table{border-color:inherit}caption{text-align:left}td,th{vertical-align:top;padding:0}
table{border-collapse: collapse;width:100%;}img{max-width:100%;height:auto;vertical-align:middle;}


/**
* Utility
============================== */
h1, h2, h3, h4, h5, h6 {line-height: 1.4;}
label {display: inline-block;cursor: pointer;}

.clearfix {min-height: 1px;}
.clearfix:after {content: "."; display: block;clear: both;height: 0;visibility: hidden;}
.both{clear:both;}

::selection{background:rgba(128, 128, 128, 0.2);}


/**
* HTML,Body,Anchor
============================== */
html {
    font-size: 62.5%; /* 10px */
    font-family: '游ゴシック','YuGothic','Hiragino Kaku Gothic ProN','Hiragino Kaku Gothic Pro','ＭＳ ゴシック',sans-serif;
    text-size-adjust: 100%;
}
body {
    background: #fff;
    font-size: 1.8em;
    font-weight: 500;
    line-height: 1.4;
    color: var(--color-default);
    min-width: 375px;
    overflow-x: hidden;
}
body * {
    font-feature-settings : "palt";
}


/**
* link
============================== */
a {
    text-decoration: none;
    /* color: var(--color-link); */
    cursor: pointer;
}
a.under {
    text-decoration: underline;
}
a:not([class]),
a.under {
    transition: color var(--duration);
}
a:not([class]):hover,
a.under:hover {
    color: var(--color-hover);
}

/**
* font
============================== */
@font-face {
    font-family: "Yu Gothic";
    src: local("Yu Gothic Medium");
    font-weight: 100;
}
@font-face {
    font-family: "Yu Gothic";
    src: local("Yu Gothic Medium");
    font-weight: 200;
}
@font-face {
    font-family: "Yu Gothic";
    src: local("Yu Gothic Medium");
    font-weight: 300;
}
@font-face {
    font-family: "Yu Gothic";
    src: local("Yu Gothic Medium");
    font-weight: 400;
}
.sub-font {
    font-family: var(--sub-font);
}

/**
* layout
============================== */
.content {
    line-height: 1.714;
}

/* block */
.addLR {
    padding-left: var(--addLR);
    padding-right: var(--addLR);
}
.width-1120 {
    margin-right: auto;
    margin-left: auto;
    max-width: calc(var(--contentWidth3) + (var(--addLR) * 2));
}
.width-960 {
    margin-right: auto;
    margin-left: auto;
    max-width: calc(var(--contentWidth) + (var(--addLR) * 2));
}
.width-770 {
    margin-right: auto;
    margin-left: auto;
    max-width: calc(var(--contentWidth2) + (var(--addLR) * 2));
}
@media screen and (min-width: 769px) {
    .addLR {
        padding-left: var(--addLR);
        padding-right: var(--addLR);
    }
}

/* section */
.sections {
    padding-top: 40px;
    position: relative;
}
/* .sections__inner + .sections__inner {
    margin-top: 60px;
} */
@media screen and (min-width: 769px) {
    .sections {
        padding-block: 60px;
    }
}

/**
* common
============================== */
.coming {
    background: var(--color-bg);
    text-align: center;
    padding: 3em 0;
}

/* svg */
.svg-area {
    display: none;
    height: 0;
    visibility: hidden;
}
.icon-check-1 {
    fill: #0068b7;
    width: 24px;
    height: 21px;
}
.icon-tel-1 {
    fill: #fff;
    width: 18px;
    height: 19px;
}
.icon-mail-1 {
    fill: #fff;
    width: 20px;
    height: 14px;
}


/* float */
.float--left,
.float--right {
    display: block;
    margin: 0 auto 15px;
}
@media screen and (min-width: 769px) {
    .float--left {
        float: left;
        margin-right: 2em;
    }
    .float--right {
        float: right;
        margin-left: 2em;
    }
}

/* list */
.disc,
.circle,
.decimal {
    padding-left: 2em;
}
.disc > li {
    list-style-type: disc;
}
.circle > li {
    list-style-type: circle;
}
.decimal > li {
    list-style-type: decimal;
}
.kome > li,
.hyphen > li {
    margin-left: 1em;
    position: relative;
}
.kome li::before {
    content: "※";
    position: absolute;
    left: -1em;
}
.hyphen li::before {
    content: "-";
    position: absolute;
    left: -1em;
}
.li-mg > li + li {
    margin-top: .5em;
}
li.style-type-none {
    list-style-type: none;
}

/* text */
p + p,
.mt-p {
    margin-top: 1.714em;
}

.beginning {
    margin-bottom: 3em;
}
.beginning--s {
    margin-bottom: 1.714em;
}
@media screen and (min-width: 641px) {
    .beginning {
        text-align: center;
    }
}

.txtC {text-align:center;}.txtL {text-align:left;}.txtR {text-align:right;}
.fs--9 {font-size: 0.9rem;line-height: 1.4;}.fs--10 {font-size: 1rem;line-height: 1.4;}.fs--11 {font-size: 1.1rem;line-height: 1.4;}.fs--12 {font-size: 1.2rem;}.fs--13 {font-size: 1.3rem;}.fs--14 {font-size: 1.4rem;}.fs--15 {font-size: 1.5rem;}
.fs--small {font-size: 80%;}

/* line break */
.rbr-sp {display: none;}
.rbr-pc {display: inline;}
@media screen and (min-width: 641px) {
    .rtxtC {text-align:center;}
    .rbr-sp {display: inline;}
    .rbr-pc {display: none;}
}

/* decoration */
.marker {
    background: linear-gradient(transparent 70%, rgb(255 244 68 / 80%) 0);
}
.text--red {color: var(--color-red);}
.text--bold {font-weight: 700;}

/* bg */
.bg-dot {
    background-image: radial-gradient(#f7f2ad 20%, transparent 20%), radial-gradient(#f7f2ad 20%, transparent 20%);
    background-size: 4px 4px;
    background-position: 0 0, 2px 2px;
}

/* title */
.title-1 {
    font-size: 2.4rem;
    font-weight: 700;
    text-align: center;
    margin-bottom: 1.333em;
    position: relative;
}
@media screen and (min-width: 641px) {
    .title-1 {
        font-size: 3rem;
    }
}

/**
* header
============================== */
#header {
    z-index: 1000;
    position: relative;
}
.header__wrap {
    background: #fff;
    width: 100%;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 10;
    box-shadow: 0 0 0.5em rgb(0 0 0 / 10%);
}
.header-logo-wrap {
    display: inline-block;
    margin-right: auto;
}
.header-desc {
    font-size: 1.3rem;
}
.header-desc--em {
    font-weight: 700;
    margin-bottom: 5px;
}
.header-tel,
.header-contact {
    width: initial;
    height: initial;
    filter: brightness(1);
    opacity: 1;
    transition: filter var(--duration), opacity var(--duration);
}
.header-tel {
    background: #f2f7fc;
    display: flex;
    align-items: center;
    min-height: 60px;
    margin-left: clamp(10px, calc(10 / 1024 * 100vw), 20px);
}
.header-tel:hover {
    opacity: .8;
}
.header-contact {
    background: #0068b7;
    border-radius: 3px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: clamp(1.4rem, 2vw, 1.8rem);
    min-width: 210px;
    padding: 1.25em 1.875em;
    margin-left: calc(10 / 1120 * 100%);
}
.header-contact:hover {
    filter: brightness(1.2);
}
.header__mail {
    width: 1.25em;
    height: .875em;
}
.header-contact__text {
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    margin-left: 5px;
}
.header-tel__image,
.header-contact__image {
    display: block;
}
.header__icon {
    display: none;
}




@media screen and (max-width: 1024px) {
    #header {min-height: 60px;}
    .header__container {
        height: 60px;
        min-width: 375px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin: auto;
        padding: 0 5vw 0 5vw;
        box-shadow: 0 0 .5em rgb(0,0,0,.1);
    }
    .header-logo {
        display: block;
    }
    .logo {
        height: auto;
        width: 200px;
    }
    .header-desc {
        display: none;
    }
    .header-tel img {
        width: auto;
        max-height: 55px;
    }
    .header-contact {
        border-radius: 0;
        min-width: 150px;
        height: 60px;
        padding: 1.375em 1em;
    }
}
@media screen and (min-width: 1025px) {
    #header {
        min-height: 110px;
    }
    .header__container {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin: auto;
        padding: 0 40px;
        height: 110px;
        max-width: 1200px;
        transition: height var(--duration);
    }
    .header-logo-wrap {
        width: calc(100% - 680px);
    }
    .header-logo {
        display: inline-block;
    }
    .logo {
        display: inline-block;
    }
    .site-top {
        display: block;
        font-size: 1rem;
        line-height: 30px;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        margin: 0 var(--addLR);
    }
}
@media screen and (max-width: 768px) {
    .header-logo-wrap {
        width: initial;
        min-width: 117px;
    }
}
@media screen and (max-width: 640px) {
    .header__container {
        padding: 0 0 0 5vw;
    }
    .header-tel,
    .header-contact {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 50px;
        min-width: initial;
        height: 60px;
        margin-left: 0;
    }
    .header-tel {
        background: #f2f7fc;
        margin-left: 5vw;
    }
    .header-contact {}
    .header-tel__image,
    .header-contact__image {
        display: none;
    }
    .header__icon {
        display: block;
        fill: var(--color-default);
    }
    .header-contact__text {
        display: none;
    }
}

/* header-btn */
.header-btn {
    background: var(--color-link);
    font-size: .9rem;
    color: #fff;
    transition: background var(--duration);
}
.header-btn:hover {
    background: var(--color-hover);
}
.header-btn__inner {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    position: relative;
    z-index: 2;
}
.header-btn__inner::after {
    content: attr(data-label);
    margin-left: .3em;
}
@media screen and (max-width: 640px) {
    .header-btn {
        border-radius: 5em;
        font-size: 1.4rem;
        padding: 1em 0;
        width: 100%;
        max-width: 95vw;
        position: fixed;
        left: 50%;
        bottom: 5px;
        transform: translateX(-50%);
        z-index: 200;
        transition: padding .2s;
    }
    .header-btn:active {
        padding: 1.2em 0;
    }
}
@media screen and (min-width: 641px) and (max-width: 1420px) {
    .header-btn {
        height: 70px;
        margin: 0 0 0 auto;
    }
}
@media screen and (min-width: 641px) {
    .header-btn {
        font-size: 1.3rem;
        font-weight: 700;
        padding: 1em 1.429em;
        order: 1;
    }
}
@media screen and (min-width: 1421px) {
    .header-btn {
        border-radius: 100px;
        max-width: 230px;
    }
}

/* overlay */
#overlay {
    backdrop-filter: blur(1px);
    opacity: 0;
    pointer-events: none;
    height: 100%;
    width: 100%;
    position: fixed;
    right: 0;
    top: 0;
    transition: all var(--duration);
    z-index: -1;
}
#overlay.on {
    background: var(--color-link);
    opacity: .8;
    pointer-events: visible;
    z-index: 5;
}

/**
* footer
============================== */
.footer {
    background: var(--color-default);
    padding: 20px 0 115px;
}
.copyright {
    color: #fff;
    display: block;
    font-size: 1.4rem;
    font-weight: 400;
    padding: 0 1em;
    text-align: center;
}

@media screen and (min-width: 769px) {
    .footer {
        text-align: center;
    }
}
@media screen and (min-width: 641px) {
    .footer {
        padding: 20px 0;
    }
}


/* foot-navi */
.foot-navi {
    background: #001239;
    display: block;
    width: 100%;
    min-width: 375px;
    height: 80px;
    padding: 7px 15px;
    position: fixed;
    left: 0;
    bottom: 0;
    z-index: 1000;
    box-shadow: 0 0 5px rgb(0 0 0 / 30%);
}
.foot-navi__inner {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 10px;
    width: 375px;
    padding-bottom: 5px;
    margin: 0 auto;
    position: relative;
}
.foot-navi__inner::before {
    border-bottom: 1px solid #fff;
    content: "";
    min-width: 305px;
    position: absolute;
    top: 100%;
    left: 0;
}
.foot-navi__inner::after {
    background: url(images/contact_area_01.png) no-repeat 0 0 / contain;
    content: "";
    min-width: 106px;
    height: 80px;
    position: absolute;
    top: -10px;
    right: -32px;
    z-index: 1;
}
.foot-navi__image {
    width: 37.335%;
    position: relative;
    z-index: 2;
    filter: brightness(1);
    transition: filter var(--duration);
}
.foot-navi__image:hover {
    filter: brightness(1.2);
}

.foot-navi__image--tel {
    width: 40%;
}

.foot-navi__text {
    color: #fff;
    font-size: .9rem;
    font-weight: 700;
    text-align: center;
    margin-top: 2px;
}

@media screen and (min-width: 641px) {
    .foot-navi {
        display: none;
    }
}


/* pagetop */
#pagetop {
    display: none;
}
@media screen and (min-width: 769px) {
    #pagetop {
        background: #2f455d;
        border-radius: 3px;
        color: #fff;
        display: flex;
        align-items: center;
        flex-direction: column;
        justify-content: center;
        font-size: 1rem;
        width: 100px;
        height: 50px;
        opacity: 0;
        visibility: hidden;
        position: fixed;
        bottom: 20px;
        right: 20px;
        z-index: 100;
        transition: var(--duration);
    }
    #pagetop::before {
        border-style: solid;
        border-width: 0 5px 9px 5px;
        border-color: transparent transparent #fff transparent;
        margin-bottom: .5em;
        width: 0;
        height: 0;
        content: '';
        transition: border var(--duration);
    }
    #pagetop:hover {
        text-decoration: none;
        background: #0068b7;
    }
    #pagetop:hover::before {
        border-bottom-color: inherit;
    }
    #pagetop.on {
        opacity: 1;
        visibility: visible;
    }
}


/**
* jquery plugin css
============================== */
/*! Lity - v2.4.1 - 2020-04-26
 * http://sorgalla.com/lity/
 * Copyright (c) 2015-2020 Jan Sorgalla; Licensed MIT */
.lity{z-index:9990;position:fixed;top:0;right:0;bottom:0;left:0;white-space:nowrap;background:#0b0b0b;background:rgba(0,0,0,0.9);outline:none !important;opacity:0;-webkit-transition:opacity .3s ease;-o-transition:opacity .3s ease;transition:opacity .3s ease}.lity.lity-opened{opacity:1}.lity.lity-closed{opacity:0}.lity *{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.lity-wrap{z-index:9990;position:fixed;top:0;right:0;bottom:0;left:0;text-align:center;outline:none !important}.lity-wrap:before{content:'';display:inline-block;height:100%;vertical-align:middle;margin-right:-0.25em}.lity-loader{z-index:9991;color:#fff;position:absolute;top:50%;margin-top:-0.8em;width:100%;text-align:center;font-size:14px;font-family:Arial,Helvetica,sans-serif;opacity:0;-webkit-transition:opacity .3s ease;-o-transition:opacity .3s ease;transition:opacity .3s ease}.lity-loading .lity-loader{opacity:1}.lity-container{z-index:9992;position:relative;text-align:left;vertical-align:middle;display:inline-block;white-space:normal;max-width:100%;max-height:100%;outline:none !important}.lity-content{z-index:9993;width:100%;-webkit-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1);-webkit-transition:-webkit-transform .3s ease;transition:-webkit-transform .3s ease;-o-transition:-o-transform .3s ease;transition:transform .3s ease;transition:transform .3s ease, -webkit-transform .3s ease, -o-transform .3s ease}.lity-loading .lity-content,.lity-closed .lity-content{-webkit-transform:scale(.8);-ms-transform:scale(.8);-o-transform:scale(.8);transform:scale(.8)}.lity-content:after{content:'';position:absolute;left:0;top:0;bottom:0;display:block;right:0;width:auto;height:auto;z-index:-1;-webkit-box-shadow:0 0 8px rgba(0,0,0,0.6);box-shadow:0 0 8px rgba(0,0,0,0.6)}.lity-close{z-index:9994;width:35px;height:35px;position:fixed;right:0;top:0;-webkit-appearance:none;cursor:pointer;text-decoration:none;text-align:center;padding:0;color:#fff;font-style:normal;font-size:35px;font-family:Arial,Baskerville,monospace;line-height:35px;text-shadow:0 1px 2px rgba(0,0,0,0.6);border:0;background:none;outline:none;-webkit-box-shadow:none;box-shadow:none}.lity-close::-moz-focus-inner{border:0;padding:0}.lity-close:hover,.lity-close:focus,.lity-close:active,.lity-close:visited{text-decoration:none;text-align:center;padding:0;color:#fff;font-style:normal;font-size:35px;font-family:Arial,Baskerville,monospace;line-height:35px;text-shadow:0 1px 2px rgba(0,0,0,0.6);border:0;background:none;outline:none;-webkit-box-shadow:none;box-shadow:none}.lity-close:active{top:1px}.lity-image img{max-width:100%;display:block;line-height:0;border:0}.lity-iframe .lity-container,.lity-youtube .lity-container,.lity-vimeo .lity-container,.lity-facebookvideo .lity-container,.lity-googlemaps .lity-container{width:100%;max-width:964px}.lity-iframe-container{width:100%;height:0;padding-top:56.25%;overflow:auto;pointer-events:auto;-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-overflow-scrolling:touch}.lity-iframe-container iframe{position:absolute;display:block;top:0;left:0;width:100%;height:100%;-webkit-box-shadow:0 0 8px rgba(0,0,0,0.6);box-shadow:0 0 8px rgba(0,0,0,0.6);background:#000}.lity-hide{display:none}

.lity {background:rgba(0,0,0,.2);}
.lity-wrap:before {margin-right: 0;}
.lity-content:after {-webkit-box-shadow: initial;box-shadow: initial;}
