﻿@import url('https://fonts.googleapis.com/css2?family=Damion&display=swap');
.font,.num{
    font-family: 'Damion', cursive;
    letter-spacing:0;
}

:root{
    --color1: #56383A;
    --color2: #C45F2C;
}

.font_14 {
    font-size: 17px;
}


.linkStyle{
    color:#bf9d74;
}
.linkStyle:hover{
    transition:all 0.3s;
    opacity:0.7;
    text-decoration:underline;
}

body{
    overflow:hidden;
}

#pc_nav li a,
#copyright,#copyright a{
    color:var(--color1);
}

#footer h2{
    display:none;
}
.line-l:before,
#pc_nav li a::after, #top_pc_nav li a::after, #footer_nav li a::after{
    background-color:var(--color1)!important;
}

.button_container span{
    background:var(--color2);
}
.button_container span:nth-of-type(1){
    color:var(--color2);
}
.overlay .nav_menu_more a{
    background-color:var(--color2);
}

/*--top page---------------------------
-------------------------------------*/
#main_img .catch{
    left: 0;
    right: 0;
    margin: auto;
    bottom: 15%;
    z-index: 2;
    width: 32vw;
    max-width: 700px;
}
#main_img #top_pc_nav{
    bottom: 5%;
    left: 0;
    right: 0;
    margin: auto;
}
#main_img #top_pc_nav li a{
    color: var(--color1)!important;
}
.num{
    color: var(--color1)!important;
    opacity:1!important;
}
.back1:before{
    z-index:-1;
}
#contents1r .item1 {
    width: 180px;
    top: -50px;
    left: 25%;
    z-index: 1;
}
#contents1r .item2 {
    width: 160px;
    bottom: -30px;
    right: 25%;
    z-index: 1;
}
#contents1r .con1_bg {
    top: 0;
    left: 0;
}
#contents1r .con1_box{
    color:var(--color1);
}
#contents1r .con1_wrap{
    backdrop-filter: blur(5px);
}

#top_cms .cms_title p{
    color:var(--color1);
}



/*--under page---------------------------
-------------------------------------*/
#pc_nav li a{
    text-shadow: 0 0 7px rgba(255,255,255,0.8);
}
#page_title .page_title_box{
    opacity: 0.85;
}
.pager li a:hover{
    background-color:var(--color1)!important;
}


/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
#main_img .catch{
    width:80vw;
    bottom:5%;
}
#contents1r .item1 {
    width: 150px;
    top: -30px;
    left: 5%;
}
#contents1r .item2 {
    width: 140px;
    right: 5%;
}
#contents2 .con_box {
    margin-top: 0%;
}
#page_title .page_title_box{
    width:65%;
}
}

/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){
#contents1r .item1 {
    width: 120px;
}
#contents1r .item2 {
    width: 110px;
}
#page_title .page_title_box {
    width: 75%;
}
}




