@charset "utf-8";

/* @font-face{
    font-family:'Noto Sans JP';
    font-style:normal;
    font-weight:400;
    src:url(../fonts/NotoSansCJKjp/NotoSansCJKjp-Regular.woff2) format('woff2'),
        url(../fonts/NotoSansCJKjp/NotoSansCJKjp-Regular.woff) format('woff'),
        url(../fonts/NotoSansCJKjp/NotoSansCJKjp-Regular.otf) format('opentype');
} */
/* @font-face{
    font-family:'Noto Sans JP';
    font-style:normal;
    font-weight:700;
    src:url(../fonts/NotoSansCJKjp/NotoSansCJKjp-Bold.woff2) format('woff2'),
        url(../fonts/NotoSansCJKjp/NotoSansCJKjp-Bold.woff) format('woff'),
        url(../fonts/NotoSansCJKjp/NotoSansCJKjp-Bold.otf) format('opentype');
} */
/* @font-face {
    font-family: 'Noto Serif Japanese';
    font-style: normal;
    font-weight: 400;
    src: url(../fonts/NotoSerifCJKjp/NotoSerifCJKjp-Regular.woff2) format('woff2'),
        url(../fonts/NotoSerifCJKjp/NotoSerifCJKjp-Regular.woff) format('woff'),
        url(../fonts/NotoSerifCJKjp/NotoSerifCJKjp-Regular.otf) format('opentype');
} */
/* @font-face {
    font-family: 'Noto Serif Japanese';
    font-style: normal;
    font-weight: 500;
    src: url(../fonts/NotoSerifCJKjp/NotoSerifCJKjp-Medium.woff2) format('woff2'),
        url(../fonts/NotoSerifCJKjp/NotoSerifCJKjp-Medium.woff) format('woff'),
        url(../fonts/NotoSerifCJKjp/NotoSerifCJKjp-Medium.otf) format('opentype');
} */
/* @font-face {
    font-family: 'Noto Serif Japanese';
    font-style: normal;
    font-weight: 700;
    src: url(../fonts/NotoSerifCJKjp/NotoSerifCJKjp-Bold.woff2) format('woff2'),
        url(../fonts/NotoSerifCJKjp/NotoSerifCJKjp-Bold.woff) format('woff'),
        url(../fonts/NotoSerifCJKjp/NotoSerifCJKjp-Bold.otf) format('opentype');
} */

/*==============================
    基本設定
==============================*/
body{
    color:#333;
    font-size:12px;
    font-family:'YakuHanJP_Narrow','游ゴシック', YuGothic, 'ヒラギノ角ゴ Pro', 'Hiragino Kaku Gothic Pro', 'メイリオ', 'Meiryo', sans-serif;
    margin:0;
    padding:0;
    text-align:left;
    background:#fff;
    -webkit-text-size-adjust:100%;
    -webkit-tap-highlight-color:rgba(0,0,0,0.25);
    position:relative;
    word-break:break-all;
    min-width:1400px;
}
@media only screen and (max-width:767px){
    body{
        min-width:0;
    }
}

body *, body *::before, body *::after{box-sizing:border-box;}
img{vertical-align:bottom;}
h1,h2,h3,h4,h5,h6{font-weight:normal;}
th{
    font-weight:normal;
    text-align:left;
}

/*font layout*/
.fBold{font-weight:bold;}
.fSerif{font-family:'Noto Serif Japanese', serif;}

/*rollover*/
.ro a:hover,
a.ro:hover,
a .ro:hover,
.cursorPointer:hover{ opacity:0.8; }
.ro a,
a.ro,
a .ro,
.cursorPointer{
    transition:opacity 0.2s ease-out;
}
.cursorPointer{cursor:pointer;}
@media only screen and (max-width:767px){
    .ro a:hover,
    a.ro:hover,
    a .ro:hover,
    .cursorPointer:hover{ opacity:1; }
}

/*rollover(brightnessによる変化)*/
.brt a:hover,a.brt:hover,a .brt:hover{ -webkit-filter: brightness(1.1);filter: brightness(1.1); }
.brt a,
a.brt,
a .brt{
    transition:filter 0.2s ease-out;
}
@media only screen and (max-width:767px){
    .brt a:hover,a.brt:hover,a .brt:hover{ filter:none; }
}

/*ro無効化*/
.ro .no_ro a:hover,
.ro a.no_ro:hover,
.ro .no_ro .cursorPointer:hover,
.ro .cursorPointer.no_ro:hover{ opacity:1; }

/* 電話リンクの無効化 */
a[href^="tel:"]{
    pointer-events:none;
    cursor:default;
}
@media only screen and (max-width:767px){
    a[href^="tel:"]{
        pointer-events:auto;
        cursor:pointer;
    }
}

/* container */
#container{
    overflow:hidden;
    max-width:1920px;
    margin:0 auto;
}

/*========================================
    レスポンシブ用(不要な場合は削除)
========================================*/
.spOnly,
.brSp,
.imgSp{
    display:none;
}
.img100{
    width:100%;
    height:auto;
}
@media only screen and (max-width:767px){
    .spNone,
    .brPc,
    .imgPc{
        display:none;
    }
    .spOnly{
        display:block;
    }
    .brSp,
    .imgSp{
        display:inline;
    }
    .imgR{
        width:100%;
        height:auto;
    }
}
/*-----------------------------------------------
	jsHide
-----------------------------------------------*/
.jsHide{
    opacity: 0;
    transform: translate(0px, 50px);
    transition: opacity 0.5s cubic-bezier(0.18, 1.00, 0.29, 1.00), transform 2s cubic-bezier(0.18, 1.00, 0.29, 1.00);
}
.jsHide.jsShow{
    transform: none;
    opacity: 1;
}
/*-----------------------------------------------
    imgCover
-----------------------------------------------*/
/* imgCover */
.imgCover,
.imgCont{
    position:relative;
}
.imgCover img {
    width:100%;
    height:100%;
    position:absolute;
    top:0;
    left:0;
    object-fit:cover;
    font-family:'object-fit:cover;';
}
.imgCont img{
    width:auto;
    height:auto;
    max-width:100%;
    max-height:100%;
    display:block;
    position:absolute;
    top:0;
    bottom:0;
    left:0;
    right:0;
    margin:auto;
}
/*-----------------------------------------------
  wrapper
-----------------------------------------------*/
.wrapper1280{
    max-width: 1280px;
    width: calc(100% - 40px);
    margin: 0 auto;
}
@media only screen and (max-width:767px){
    .wrapper1280{
        width: 100%;
    }
    .wrapperSp{
        width: 92%;
        margin: 0 auto;
    }
}
/*-----------------------------------------------
  header
-----------------------------------------------*/
#header{
    position: absolute;
    width:320px;
    top: 0;
    left: 0;
    z-index: 9999;
}
#header .herderLogo{
    display: block;
    text-decoration: none;
}
@media only screen and (max-width:767px){
    #header{
        width: 140px;
    }
}
/*-----------------------------------------------
 footer
-----------------------------------------------*/
#footer{
    position:relative;
    background: #f7f2eb;
}
#footer .inner{
    text-align: center;
    max-width: 1080px;
    margin: 0 auto;
    padding-top: 27px;
}
#footer .inner .footerLogo{
    display: inline-block;
    position: absolute;
    width: 203px;
    left: calc(50% - 101.5px);
    top: -129px;
}
#footer .inner .telbox{
    text-align: center;
}
#footer .inner .telbox .tit{
    font-size: 18px;
    line-height: 34px;
    font-weight: bold;
    letter-spacing: 1.5px;
}
#footer .inner .telbox .list{
    display: flex;
    margin-top: 22px;
}
#footer .inner .telbox .list .item{
    width: calc((100% - 90px) / 3);
    margin-right: 45px;
    text-align: center;
}
#footer .inner .telbox .list .item:last-child{
    margin-right: 0;
}
#footer .inner .telbox .list .item .subtit{
    width: 100%;
    background: #fff;
    border: 1px solid #0f1a30;
    padding: 12px 0;
}
#footer .inner .telbox .list .item .subtit .txt{
    font-size:15px;
    letter-spacing: 1px;
    line-height: 34px;
}
#footer .inner .telbox .list .item .tel{
    font-size: 26px;
    line-height: 34px;
    font-weight: bold;
    text-decoration: none;
    display: inline-block;
    color: #0f1a30;
    margin-top: 24px;
    letter-spacing: 3px;
}
#footer .inner .telbox .list .item .subtxt{
    font-size: 13px;
    line-height: 34px;
    margin-top: 9px;
    letter-spacing: 0.5px;
}
#footer .inner .telbox .list .item .linktxt{
    font-size:13px;
    line-height: 34px;
}
#footer .inner .telbox .list .item .linktxt .link{
    display: inline-block;
    font-size: 13px;
    line-height: 1;
    text-decoration: none;
    position: relative;
    color: #0f1a30;
}
#footer .inner .telbox .list .item .linktxt .link::after{
    content: "";
    position: absolute;
    left: 0;
    bottom: -7px;
    height: 1px;
    width: 100%;
    background: #0f1a30;
}
@media only screen and (max-width:767px){
    #footer{
        padding-top: 0;
    }
    #footer .inner{
        text-align: center;
        width: 92%;
        margin: 0 auto;
        padding-top: 25px;
    }
    #footer .inner .footerLogo{
        display: block;
        width: 150px;
        left: calc(50% - 75px);
        top: -85px;
    }
    #footer .inner .telbox{
    }
    #footer .inner .telbox .tit{
        font-size: 13px;
        letter-spacing: 0;
    }
    #footer .inner .telbox .list{
        display:block;
        margin-top: 20px;
    }
    #footer .inner .telbox .list .item{
        width:265px;
        margin: 0 auto;
        text-align: center;
        margin-bottom: 27px;
    }
    #footer .inner .telbox .list .item:last-child{
        margin-right: auto;
        margin-bottom: 0;
    }
    #footer .inner .telbox .list .item .subtit{
        padding: 4px 0;
    }
    #footer .inner .telbox .list .item .subtit .txt{
        font-size:12px;
    }
    #footer .inner .telbox .list .item .tel{
        font-size: 22px;
        margin-top: 9px;
        letter-spacing: 1px;
    }
    #footer .inner .telbox .list .item .subtxt{
        font-size: 12px;
        line-height: 1.5;
        margin-top: 7px;
        letter-spacing: 0;
    }
    #footer .inner .telbox .list .item .linktxt{
        font-size:12px;
    }
    #footer .inner .telbox .list .item .linktxt .link{
        font-size: 12px;
    }
    #footer .inner .telbox .list .item .linktxt .link::after{
        bottom: -7px;
    }
    #footer .inner .copy{
        font-size: 10px;
        letter-spacing: 0;
        margin-top: 33px;
    }
}
#footer .inner .f_middletxt{
    font-size: 12px;
    line-height: 34px;
    letter-spacing: 0.75px;
    text-align: center;
    margin-top: 46px;
}
#footer .flexbnr{
    display: flex;
    max-width: 1120px;
    margin: 0 auto;
    margin-top: 49px;
}
#footer .flexbnr .item{
    width: calc((100% - 80px) / 2);
    margin-right: 80px;
    color: #3c352f;
}
#footer .flexbnr .item:last-child{
    margin-right: 0;
}
#footer .flexbnr .item .link{
    display: block;
}
#footer .flexbnr .item .txt{
    font-size: 12px;
    line-height: 28px;
    text-align: center;
    margin-top: 7px;
}
#footer .copy{
    display: block;
    padding: 8px 0;
    font-size: 12px;
    line-height: 34px;
    letter-spacing: 0.5px;
    text-align: center;
    background: #c0ccba;
    color: #3c352f;
    margin-top: 112px;
}
@media only screen and (max-width:767px){
    #footer .inner .f_middletxt{
        font-size: 12px;
        line-height:1.83;
        letter-spacing: 1px;
        text-align: left;
        margin-top: 31px;
    }
    #footer .flexbnr{
        display: block;
        width: 92%;
        margin-top: 33px;
    }
    #footer .flexbnr .item{
        width: 100%;
        margin-right: 0px;
        margin-bottom: 13px;
    }
    #footer .flexbnr .item:last-child{
        margin-bottom: 0;
    }
    #footer .flexbnr .item .link{
        display: block;
    }
    #footer .flexbnr .item .txt{
        font-size: 12px;
        line-height:2;
        text-align: left;
        margin-top: 6px;
    }
    #footer .copy{
        display: block;
        padding: 9px 4%;
        letter-spacing: 0;
        text-align:left;
        margin-top: 33px;
        font-size: 10px;
    }
}

/* fNav */
#fNav{
    position: fixed;
    bottom: -315px;
    right: -102px;
    z-index: 999;
    -webkit-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
}
#fNav.active{
    bottom: 0;
}
#fNav .link{
    display: block;
    width: 410px;
    height: 176px;
    position: relative;
}
#fNav .link::after{
    content: "";
    position: absolute;
    width:80px;
    height: 207px;
    right: 129px;
    top: -122px;
    background: url(../img/common/imgIconfNav.png) center center no-repeat;
}
@media only screen and (max-width:767px){
    #fNav{
        right: 0px;
        width: 100%;
    }
    #fNav .link{
        display: block;
        width: 100%;
        height: auto;
        position: relative;
    }
    #fNav .link::after{
        width:41px;
        height: 105px;
        right: 50px;
        top: calc(0% - 42px);
        background-size: 100% auto;
    }
}
@media only screen and (max-width:374px){
    #fNav .link{
        height: 82px;
        width: 100%;
        display: block;
    }
    #fNav .link img{
        position: absolute;
        width: 375px;
        left: calc(50% - 187.5px);
        bottom: 0;
    }
    #fNav .link::after{
        right: calc(50% - 134px);
    }
}