@charset "UTF-8";



.cmHd:before{
    content: "";
    background: url(../img/index/icon-tori.png) no-repeat;
    background-size: cover;
    width: 25px;
    height: 25px;
    position: absolute;
    top: -20px;
    left: 0;
    right: 0;
    margin: auto;
}


/*------------------------------------------------------------
  mainView
------------------------------------------------------------*/
#front #mainView{
    background: url(../img/index/mvBg.jpg) no-repeat;
    background-size: cover;
}
#front #mainView h2{
    font-family: 'Noto Serif JP', "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
    font-size: 310%;
    color: #FFF;
    padding: 21vw 0 0 0;
    text-align: center;
    font-weight: 700;
    text-shadow: 0 0 10px #000;
}
#front #mainView p{
    font-family: 'Noto Serif JP', "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
    color: #FFF;
    padding: 0 0 21vw 0;
    text-align: center;
    font-weight: 500;
    text-shadow: 0 0 10px #000;
    font-size: 170%;
    line-height: 100%;
}

/*------------------------------------------------------------
  about
------------------------------------------------------------*/
#front #about{
    background: url(../img/index/aboutBg.jpg) no-repeat;
    background-size: cover;
    padding:3rem 1rem;
    margin-top: -30px;
}
#front #about .upperFlex{
    gap: 3%;
    margin: 0 0 2rem 0;
    align-items: anchor-center;
}
#front #about .upperFlex .imgWrap{
    flex:1;
}
#front #about .upperFlex .imgWrap img{
    border-radius:20px;
}
#front #about .upperFlex .txtWrap{
    flex:1;
}
#front #about .upperFlex .txtWrap h3{
    color: #9b1e1c;
    font-size: 180%;
    font-weight:700;
}
#front #about .upperFlex .txtWrap p{
    font-size: 95%;
    line-height: 200%;
}
#front #about .bottomerFlex{
    gap: 3%;
    align-items: anchor-center;
    position: relative;
    z-index: 3;
}
#front #about .bottomerFlex .txtWrap{
    flex: 1;
    background: #FFF;
    padding: 1rem;
    border-radius: 20px;
    box-shadow: 0 0 10px #00000036;
    align-items: anchor-center;
    gap: 3%;
}
#front #about .bottomerFlex .txtWrap .imgWrap{
    flex:1;
}
#front #about .bottomerFlex .txtWrap .imgWrap img{
    border-radius:20px;
}
#front #about .bottomerFlex .txtWrap .txtbox{
    flex:2;
}
#front #about .bottomerFlex .txtWrap .txtbox h3{
    color: #9b1e1c;
    font-size: 130%;
    line-height: 130%;
    font-weight:700;
}
#front #about .bottomerFlex .txtWrap .txtbox p{
    font-size: 90%;
    margin: 5px 0;
}


/*------------------------------------------------------------
  point
------------------------------------------------------------*/
#front #point{
    padding: 8rem 1rem 3rem 1rem;
    margin-top: -6rem;
    z-index: 2;
    position: relative;
    background: linear-gradient(#ffffff, #ffffff00);
}
#front #point ul{
    gap:3%;
    position: relative;
    z-index: 2;
}
#front #point ul li{
    flex: 1;
    box-shadow: 0 0 10px #00000036;
    border-radius: 20px;
}
#front #point ul li img{
    border-radius:20px 20px 0 0;
}
#front #point ul li .txtbox{
    border-radius:0 0 20px 20px;
    background:#FFF;
    padding:0 1rem 1rem 1rem;
}
#front #point ul li .txtbox h3{
    color: #9b1e1c;
    font-size: 130%;
    line-height: 130%;
    text-align: center;
    margin: 10px 0;
    font-weight:700;
}
#front #point ul li .txtbox p{
    font-size: 90%;
    margin: 5px 0;
}


/*------------------------------------------------------------
  akadori
------------------------------------------------------------*/
#front #akadori{
    background: url(../img/index/akadoriBg.jpg) no-repeat;
    background-size: cover;
    padding: 14rem 1rem 13rem 1rem;
    margin-top: -10rem;
    position: relative;
    z-index: 1;
}
#front #akadori .upperFlex{
    gap: 3%;
    margin: 0 0 2rem 0;
    align-items: anchor-center;
}
#front #akadori .upperFlex .imgWrap{
    flex:1;
}
#front #akadori .upperFlex .imgWrap img{
    border-radius:20px;
}
#front #akadori .upperFlex .txtWrap{
    flex:1.5;
}
#front #akadori .upperFlex .txtWrap h3{
    color: #9b1e1c;
    font-size: 180%;
    font-weight:700;
}
#front #akadori .upperFlex .txtWrap p{
    font-size: 95%;
    line-height: 200%;
}
#front #akadori .upperFlex .txtWrap a{
    background: #9a1e1b;
    color: #FFF;
    border-radius: 80px;
    padding: 15px 3rem;
}
#front #akadori ul{
    gap:3%;
}
#front #akadori ul li{
    flex:1;
}
#front #akadori ul li img{
    border-radius:20px;
}


/*------------------------------------------------------------
  info
------------------------------------------------------------*/
#front #info{
    padding:3rem 1rem;
}
#front #info .contentWrapper{
    box-shadow: 0 0 10px #00000036;
    padding: 3rem 6rem;
    border-radius: 20px;
    margin-top: -10rem;
    position: relative;
    z-index: 1;
    background: #FFF;
}
#info .infoWrapper{
    border-bottom: dashed 1px #a4a4a4;
    margin: 0;
    padding: 15px 0;
}
#info .infoWrapper .categoly a{
    background: #9a1e1b;
    color: #FFF;
    border-radius: 5px;
    font-weight: 600;
    padding: 1px 1rem;
    min-width: 120px;
    text-align: center;
    font-size: 14px;
}
#info .infoWrapper .categoly.cm a{
    background: #50595c; 
}
#info .infoWrapper time{
    font-size: 100%;  
}
#info .infoWrapper h3{
    padding: 0 0 0 30px;
    border: none;
    margin: 0;
    background: no-repeat;
    display: inline;
}
#front #info .moreLink{
    background: #9a1e1b;
    color: #FFF;
    border-radius: 80px;
    padding: 15px 3rem;
    margin: 3rem auto;
    width: 60%;
    text-align: center;
    display: block;
    font-weight: 700;
}




@media (max-width: 1099px) {
    #front .underlayerWrapper.double{
        padding: 10px;
    }
}


@media (max-width: 900px) {

    #front p{
        font-size:90%;
        line-height: 120%;
    }
    #front #mainView h2{
        font-size: 200%;
    }
    #front #mainView p{
        font-size: 120%;
    }
    #front #about .upperFlex .txtWrap h3{
        font-size: 150%;
    }
    #front #about .bottomerFlex .txtWrap .txtbox h3{
        font-size: 110%;
    }
    #front #point ul li .txtbox h3{
        line-height: 130%;
    }
    #front #akadori .upperFlex .txtWrap h3{
        font-size: 160%;
        line-height: 120%;
    }

}

@media (max-width: 650px) {

    #front #about .bottomerFlex{
        display:block;
    }
    #front #about .bottomerFlex .txtWrap{
        margin-bottom: 1rem;
    }
    #front #about .bottomerFlex .txtWrap .txtbox{
        flex: 4;
    }
    #front #point ul{
        display: block
    }
    #front #point ul li{
        margin-bottom:1rem;
    }
    #front #akadori .upperFlex{
        display:block;
    }
    #front #akadori .upperFlex .imgWrap{
        width: 60%;
        margin: 0 auto;
    }
    #front #akadori .upperFlex .txtWrap{
        margin-top:1rem;
    }
    #front #akadori .upperFlex .txtWrap a{
        width: 100%;
        text-align: center;
        margin: 1rem 0;
    }
    #front #info .contentWrapper{
        padding: 3rem 2rem;
    }

}

@media (max-width: 600px) {
    #front .underlayerWrapper.double{
        padding: 10px;
    }
    #front #mainView h2{
        padding: 40vw 0 0 0;
    }
    #front #mainView p{
        padding: 0 0 41vw 0;
    }
    #front #mainView .break{
        display:block;
    }
    #front #mainView .spNone{
        display:none;
    }
}

@media (max-width: 560px) {

    #front #about .upperFlex{
        display:block;
    }
    #front #about .upperFlex .imgWrap{
        margin-bottom:1rem;
    }

}

@media (max-width: 480px) {


    #front #mainView h2{
        font-size: 170%;
    }
    #front #mainView p{
        font-size: 100%;
        line-height: 160%;
    }
    #front #about .bottomerFlex .txtWrap .imgWrap img{
        border-radius: 5px;
    }
    #front #about .bottomerFlex .txtWrap .txtbox{
        flex: 2;
    }
    #front #about .bottomerFlex .txtWrap .txtbox h3{
        font-size: 100%;
    }
    #front #about .bottomerFlex .txtWrap .txtbox p{
        font-size: 70%;
    }
    #front #akadori .upperFlex .txtWrap h3{
        font-size: 130%;
        margin-top: 2rem;
    }
    #info .infoWrapper{
        padding: 8px 0;
    }
    #front #info .contentWrapper{
        padding: 2rem 1rem;
    }
    #info .infoWrapper h3{
        padding-left:0;
        display: block;
    }
    #front #info .moreLink{
        padding: 7px 3rem;
        width: 90%;
        margin: 2rem auto 0rem auto;
    }

}

@media (max-width: 380px) {


}