﻿@import url('https://fonts.googleapis.com/css2?family=Cantata+One&family=Montserrat&family=Noto+Serif+JP&display=swap');

#main_menu, #page10 .cate span{font-family: 'Montserrat', "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic",  sans-serif!important}

#aisatsu h2, #top_contents h2, #top_cms .cms_title, .page_title, a[href^="tel:"], .effect.effect-1, .cate_title, #top_contents .contents_box h2::before{font-family: 'Cantata One', 'Noto Serif JP', "游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif"!important}

.linkStyle{color: #999999}

#fakeloader .fl{width: 80%!important;max-width: 500px!important;}
#logo img{width: 280px}
.header .grid_3 a[href="page08.aspx"]{display: none}
#info_map .foot_tel_bt a[href="page08.aspx"]{display: none}
#main_img{height: 70vh}
#main_menu{border-bottom: none}
#main_menu.fixed{background-color: #6A6445!important;border-bottom: none}
#top_cms .cms_title h2{color: #999999;font-size: 16px;font-weight: normal}
#top_cms .cms_title p{font-size: 28px}
#top_cms .cms_box > .border_white{text-align: left}
#main_img2{background-position: center}
#main_img2 .page_title{background-color: rgba(17,17,17,0.6)!important}
.page_title h2{font-size: 30px;color: #fff;background-color: transparent;border: solid 1px #fff;letter-spacing: 3px}
#aisatsu > div{background-color: rgba(17,17,17,0.6)!important;position: relative;}
#aisatsu > div::before{position: absolute;content: "";width: 1px;height: 80px;background-color: #fff;left: 0;right: 0;top: 0;margin: auto}
.contents_box::after, .contents_box2::before, .contents_box2::after{display: none}
.contents_box::before{transform: rotate(135deg);transition: 2s;top: -30px;left: 100px;transform-origin: left bottom;width: 0}
[data-aos^=fade][data-aos^=fade].aos-animate::before{width: 100px}
#top_contents{background-image: url(./Dup/img/bg_img.png);background-size: 800px;background-position: right 50px top 50px;background-repeat: no-repeat}
#top_contents .contents_box{background-color: #6A6445;background-image: none!important;padding: 50px;padding-left: 100px}
#top_contents .contents_box h2{text-align: left;margin-bottom: 30px;padding-bottom: 20px;position: relative}
#top_contents .contents_box h2::before{position: absolute;top: 0;left: -50px;color: #fff;font-size: 20px}
#top_contents .contents_box h2::after{position: absolute;content: "";width: 40px;height: 1px;background-color: #fff;left: 0;bottom: 0}
#top_contents #contents1 .contents_box h2::before{content: "01"}
#top_contents #contents2 .contents_box h2::before{content: "02"}
#top_contents #contents3 .contents_box h2::before{content: "03"}

.cate_title{background-color: transparent;padding: 0;margin: 0;display: block;border: none;width: 100%!important;font-size: 24px;text-align: center;padding-bottom: 30px!important;margin-bottom: 50px;border-bottom: solid 1px #333;color: #fff;position: relative;border-radius: 0!important}
.cate_title::before{position: absolute;content: "";width: 1px;height: 40px;bottom: -20px;left: 0;right: 0;margin: auto;background-color: #fff}

#cms_4-a .cate_box > div{background-color: #1a1a1a}
#cms_4-a figure{border-color: #1a1a1a}
#cms_6-b .cate_box:first-of-type, .cms_6-b .cate_box:first-of-type{border-top: none}
.cms_6-b .box_txt2, #cms_6-b .box_txt2{background-color: rgba(255,255,255,0.1)}

#page10 .cate span{display: block;padding-left: 0}
#page10 .cate span::after{content: "-"}


/** tablet 780 **/
@media screen and (max-width: 768px){
#main_img{height: 60vw}
#f_menu ul li a{letter-spacing: 1px}
.page_title h2{width: 350px!important}
#top_contents{background-size: calc(100% - 40px);background-position: right 20px top 20px}
}

/** mobile 750 **/
@media screen and (max-width: 667px){
#logo img{width: 200px}
#logo{width: 100%!important;text-align: center;margin-right: 0}
.page_title h2{width: 300px!important;font-size: 26px;letter-spacing: 2px}
#top_contents .contents_box h2::before{font-size: 18px}
#top_contents .contents_box{padding: 50px 20px;padding-left: 70px}
.contents_box::before{top: -25px;height: 1px;left: 70px;width: 70px}
[data-aos^=fade][data-aos^=fade].aos-animate::before{width: 70px}
#aisatsu > div::before{height: 50px}
.cate_title{font-size: 20px;}
}

/** IE **/
@media all and (-ms-high-contrast:none) {

}