﻿/* all page */
/*fonts*/
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@400;700;900&display=swap');
.en_font, #header .header_menu li a, .catch_txt h2, #catch .box h4, #contents .box h2, #catch .square_box a p, #contents_links .catch_txt h2, #contents .contents_txt h3 span, #top_cms .top_cms_title p span, #top_cms .top_cms_title h3, #top_cms .more a span, #main_nav li a span, footer #copyright, #page_title, .cate_list li a, .cate_list li .cate_no, .cate_title, .sub_cate_title, #page10 .sub_title, #page10 .title, .box_title, .box_title1, a[href^="tel:"], a[href^="mailto:"], .pager li a {
    font-family: 'Noto Serif JP', "游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif";
}

/* color ---------------------------------------------------------------------------------------------*/
.linkStyle{color: #111;text-decoration: underline;transition: opacity .3s;}
.linkStyle:hover{opacity: 0.7}
.txt_color1, .hvr_txt_color1:hover{color: #111;} /* メインカラー */
.txt_color2, .hvr_txt_color2:hover{color: #e6e6e6} /* サブカラー */
.txt_color3, .hvr_txt_color3:hover{color: #b31616;} /* アクセントカラー1 */
.txt_color4, .hvr_txt_color4:hover{color: #c9baa9} /* アクセントカラー2 */

/* background-color */
.bg_color1, .hvr_bg_color1:hover{background-color: #111;} /* メインカラー */
.bg_color2, .hvr_bg_color2:hover{background-color: #303030;} /* サブカラー */
.bg_color3, .hvr_bg_color3:hover{background-color: #b31616;} /* アクセントカラー1 */
.bg_color4, .hvr_bg_color4:hover{background-color: #c9baa9} /* アクセントカラー2 */

/* border-color ※!important */
.border_color1, .hvr_border_color1:hover{border-color: #111;}
.border_color2, .hvr_border_color2:hover{border-color: #e6e6e6}
.border_color3, .hvr_border_color3:hover{border-color: #b31616;}
.border_color4, .hvr_border_color4:hover{border-color: #c9baa9}

.load_logo figure {
    max-width: 400px;
}
.more a {
    background-color: #8c8d81;
}
.more a:after {
    background-color: #b31616;
}

/* header */


/* top ----------------*/
.back_color {
    background: linear-gradient(rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.975) 20%, rgba(0,0,0,0.975) 50%,rgba(0,0,0,0.5) 100%);
}

/* main img */
#main .sns_link, #main .main_box {
    z-index: 2;
}
#main .cms_img1 {
    position: relative;
}
#main .main_box {
    left: 0;
    transform: none;
    width: auto;
    text-align: center;
    top: auto;
    bottom: 30px;
}
#main .main_box, #main .main_box .more a {
    margin: 0 auto;
}
#main .main_box .more a {
    width: 80%;
}
#main .main_box h1{
    max-width: 350px;
}
#main .cms_img1 img {
    width: 100%;
    height: 100%;
}
#main .cms_img1 .catch1 {
    top: 0;
    left: 0;
    width: 100%;
    mix-blend-mode: overlay;
}
#main .cms_img1 .catch2 {
    top: 32%;
    left: 0;
    width: 18%;
    mix-blend-mode: overlay;
}
#main .cms_img1 .catch3 {
    bottom: 0;
    left: 3%;
    width: auto;
    height: 70%;
    mix-blend-mode: overlay;
}


/* main */

/* intro */
.catch_txt {
    background-color: rgba(0,0,0,0.8);
    padding-bottom: 70px;
}
#catch .catch_txt h2 {
    font-size: 60px;
    margin-top: -100px;
    margin-bottom: 50px;
    margin-left: -20px;
    text-align: center;
    line-height: 1.8;
}
#catch .catch_txt h2 span {
    border-bottom: 5px solid #d9be28;
}
.catch_txt .more {
    bottom: -25px;
    left: 50%;
    transform: translateX(-50%);
    width: 50%;
}
.catch_txt .more a {
    width: 100%;
}

/* contents */
#contents .box .box_item:after {
    background: linear-gradient(to bottom left, rgba(255,255,255,0) 50%, #111 50.5%) no-repeat top left/100% 100%;
}
#contents .box h2{
    font-size: 40px;
}
#contents .box h2:first-letter{
    font-size: 75px;
    color: #d9be28;
}
#contents .box .en_font span{
    background-image: url('./Dup/img/mark.png');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100%;
    padding: 60px 65px 72px 65px;
    font-size: calc(1rem + 50px);
    color: #d9be28;
}

/* topcms */


/* footer */
footer .entry.more a {
    background-color: #ffffff;
}


/* under page */
.content_wrap {
    background-color: rgba(255, 255, 255, 0.8);
}
.cate_list li a {
    background-color: #b31616;
    color: #fff;
    padding: 10px 5px;
}
.cate_list li a:hover {
    background-color: #fff;
    color: #b31616;
    z-index: 2;
}
#page_title {
    background-position: bottom;
}
#page_title:before {
    background: linear-gradient(to bottom right, rgba(255,255,255,0) 50%, #111 50.5%) no-repeat top left/100% 100%;
}
#page_title .page_title_box p{
    color: #fff;
}
#page_title .page_title_box p:first-child:first-letter{
    color: #d9be28;
}
#page_title:after {
    display: none;
}
.content_wrap .cate_list span{
    background-color: #d9be28;
}

/* cms1 */

/* cms2 */

/* cms3 */

/* cms4 */

/* cms5 */

/* page7 */

/* page8 */

/* page9 */

/* page10 */


/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
    #header .logo img{
        width: 100%!important;
    }
    #main{
        width: 100vh;
        height: auto!important;
    }
    #main .cms_img1 .catch2 {
        top: 15%;
        width: 11%;
    }
    #main .cms_img1 .catch3 {
        bottom: 22%;
        height: 45%;
        left: 0;
    }
    #video{margin-bottom:-10px;}
    #main .main_box {
        bottom: 0;
    }
    #main .main_box h1 {
        max-width: 250px;
        margin: 0 auto;
        margin-bottom: 30px;
    }
    #catch .catch_txt h2 {
        font-size: 50px;
        margin-top: -90px;
    }
    #contents .box h2 {
        font-size: 35px;
    }
    #contents .box h2:first-letter{
        font-size: 65px;
    }
    
}
/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){
    .load_logo figure {
        max-width: 500px;
    }
    .sp_back{
        opacity: 1!important;
    }
    /*#video video{*/
    /*    width: auto!important;*/
    /*    height: 100vh;*/
    /*}*/
    #main .main_box h1 {
        max-width: 120px;
    }
    #main .main_box h1{
        margin-bottom: 5px;
    }
    #main .main_box .more a{
        width: 95%;
        font-size: 12px;
    }
    #catch .catch_txt h2 {
        font-size: 34px;
        margin-top: -50px;
        margin-left: 0;
    }
    #contents .box h2 {
        font-size: 33px;
        letter-spacing: 1px;
    }
    #contents .box .box_item:after {
        background: linear-gradient(to top left, rgba(255,255,255,0) 50%, #111 50.5%) no-repeat bottom left/100% 100%;
    }
    #contents .no{
        z-index: 1;
    }
    #contents .box .en_font span {
        padding: 45px 42px 52px 42px;
        font-size: calc(1rem + 30px);
    }
    .shop_info .info, .shop_info .contact {
        padding: 100px 0;
    }
    .shop_info h2{
        font-size: calc(1rem + 10px);
    }
    
}



