@import url('https://fonts.googleapis.com/css2?family=Yuji+Boku&display=swap');

:root{
    --red: #bb2c2c;
    --black:#170000;
    --red2: #760202;
}

.bg_color1 {
    background-color: var(--red);
}

.hvr_txt_color1:hover {
    color: var(--red);
    text-shadow: white 2px 0px 0px, white -2px 0px 0px, white 0px -2px 0px, white 0px 2px 0px, white 2px 2px 0px, white -2px 2px 0px, white 2px -2px 0px, white -2px -2px 0px, white 1px 2px 0px, white -1px 2px 0px, white 1px -2px 0px, white -1px -2px 0px, white 2px 1px 0px, white -2px 1px 0px, white 2px -1px 0px, white -2px -1px 0px, white 1px 1px 0px, white -1px 1px 0px, white 1px -1px 0px, white -1px -1px 0px;
}



/*#wrap {
    min-width: 1280px;
}*/

.main_img_wrap .navi{
    display: none;
}

.img-container {
    border-radius: 17px;
}

body{
        background-color: #170000;
}



#contents .box figure:after {
        background-image: url(./Dup/img/back.jpg);
    background-color: transparent !important;
        width: 150%;
    height: 80%;
    border: 0px solid;
    opacity: 0.35;
}

#contents .box .txt_wrap {
    z-index: 1;
}

.other{
        max-width: 1280px;
    margin: auto;
    padding-bottom: 100px;
}


.bg_color2 {
    background-color: white;
    background-image: url(./Dup/img/back.jpg);
}


.img-container:before, .t_cms_img2 .img-container:before {
    background: transparent;
        background-image: url(./Dup/img/sho.jpg);
    background-size: auto 100%;
    background-position: center;
}

h1, h2, h3, h4, h5, h6{
        font-family: 'Yuji Boku', serif;
}

.txt_wrap h3{
       font-size: -webkit-calc(1rem + 14px);
    font-size: calc(1rem + 14px);
    font-family: 'Yuji Boku', serif;
}

#loading_logo{
    max-width: 500px;
}


.main_wrap .menu:before{
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    background-image: url(./Dup/img/catch.png);
    background-position: center;
    background-repeat: no-repeat;
    -webkit-transform: translate(-50% , -50%);
    transform: translate(-50% , -50%);
    background-size: 100%;
    pointer-events: none;
}

.main_wrap .menu:before {
    height: 250%;
    top: -250%;
    background-image: url(./Dup/img/catch.png);
    background-size: contain;
    pointer-events: none;
        -webkit-transform: translate(-50% , -50%);
    transform: translate(-50% , -0%);
}

footer {
    background-color: #760202;
}

.button_container span{
    background-color: white;
        filter: drop-shadow(0px 0px 4px black) drop-shadow(0px 0px 5px black) drop-shadow(0px 0px 10px black);
}

.button_container.active .top, .button_container.active .bottom{
    background-color: black;
}

/*.main_img_wrap {
    min-width: 1280px;
}*/

.ore{
        max-width: 800px;
    margin: 0 auto 100px;
    width: 95%;
}

.ore > img:nth-of-type(1){
    max-width: 600px;
    display: block;
    margin: auto;
    margin-bottom: 50px;
}

.tori{
    border: 10px solid #170000;
    box-sizing: border-box;
    margin: 50px auto;
    position: relative;
}

.pare{
    position: relative;
}

.pare:before{
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    background-image: url(./Dup/img/tori.png);
    background-position: center;
    background-repeat: no-repeat;
    -webkit-transform: translate(-50% , -50%);
    transform: translate(-50% , -50%);
    background-size: 100px;
    pointer-events: none;
    z-index: 1;
}

.ore a{
        display: block;
    margin: 50px auto 100px;
    text-align: center;
    max-width: 300px;
    background-color: #bb2c2c;
    color: white;
    padding: 20px;
    box-sizing: border-box;
    border-radius: 30px;
}

#contents{
    background-image: url(./Dup/img/tyou.png), url(./Dup/img/tyou.png);
    background-repeat: no-repeat;
    background-position: calc(0% + 30px) calc(0% + 10px), calc(100% - 30px) calc(0% + 10px);
    background-size: 140px;
}

.main_wrap .test{
    position: absolute;
    top: -280px;
    height: 280px;
    width: auto;
    transform: translate(-50%, 0%);
    left: 50%;
    display: block;
}

.txt_color1 {
    color: #545454;
}

#title_img {
    width: 75%;
}

.page_title_box p.font_45{
        font-family: 'Yuji Boku';
    font-size: 50px;
}

.letter_4 {
    letter-spacing: 1px;
}

.linkStyle{
color: #cc3535;
}

.video_wrap {
    min-width: auto;
}

.cate_list li {
    width: 30%;
}

#map{
    padding-top: 200px !important;
    margin-top: -100px;
}

.cate{
    padding-top: 100px;
    margin-top: -100px;
}

/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){

.main_img_wrap {
    min-width: 97%;
}

.main_wrap .test {
    position: absolute;
    top: -200px;
    height: 200px;
    width: auto;
    transform: translate(-50%, 0%);
    left: 50%;
    display: block;
}

#contents .box .txt_wrap {
    width: 80%;
    margin-bottom: 50px;
}

#contents .box figure {
    width: 80%;
}

}

/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){

.main_wrap .test {
    position: absolute;
    top: -110px;
    height: 110px;
    width: auto;
    transform: translate(-50%, 0%);
}
.main_img_wrap {
    min-width: 95%;
}

#contents .box .txt_wrap {
    width: 100%;
    margin-bottom: 0px;
}

#contents .box figure {
    width: 100%;
}

.ore {
    max-width: 800px;
    margin: 50px auto 100px;
    width: 90%;
}

.txt_wrap h3 {
    font-size: -webkit-calc(1rem + 8px);
    font-size: calc(1rem + 8px);
    letter-spacing: 0.01em;
}

#page_title .img-container::after {
    background-color: rgba(255,255,255,0.4) !important;
}

#page_title h2, #page_title p {
    color: #c73d3d;
}

#page_title {
    width: 95% !important;
    /* margin: auto; */
    padding: 50px auto;
    padding-top: 10px;
    margin: auto;
    margin-bottom: 15px;
}

.page_title_box p.font_45 {
    font-size: 18px;
    letter-spacing: 0.01em;
}

.page_title_box p.font_45 {
    font-family: 'Yuji Boku';
    font-size: 28px;
}

.top_page .main_wrap{
    margin-top: 200px !important;
}

.cate_list li {
    width: 100%;
}


}