/* ---------- font ---------- */
@import url('https://fonts.googleapis.com/css2?family=Shippori+Mincho:wght@600;700&display=swap');

:root{
    --font-jp: "Shippori Mincho", "游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif";
    /*--font-en: 'Jost', 'Zen Kaku Gothic New', "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic",  sans-serif;*/
    font-family: "游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif";
}
body, .font_sans-serif, .font_serif{
    font-family: var(--font-jp);
}
/*.font_en, a[href^="tel:"]{
    font-family: var(--font-en);
}*/

/* ---------- color ---------- */
.linkStyle{color: #161817;transition: opacity .3s;text-decoration: underline;}
.linkStyle:hover{opacity: 0.7}

:root {
    --normal_color: #333333;
    --color1: #161817;
    --color1: #3a322e;
    --color2: rgb(255 255 255 / 50%);
    --color3: #862E25;
    --color4: #d7dbd8;
}
.txt{
	color: var(--normal_color);
}


/* ---------- all ---------- */
#loading img{
    width: 217px;
}
#logo {
    width: 110px;
}
#logo2{
    max-width: 100px;
    margin: 0 auto 30px;
}
#cms1_box, .main_contents, .cms_box.bg_white {
    background: url( "../img/bg1.jpg" ) left center / 1000px repeat;
}
#top_info .contact_bt a {
    border-radius: 0;
}
#menu_nav #nav_logo{
    width: 107px;
}


/* ---------- top ---------- */
.fv_txt {
    top: 51%;
    left: 48%;
    z-index: 2;
    width: min(71%, 870px);
}

#top_link .top_link_title {
    font-size: 30px;
    margin-bottom: 50px;
    padding-bottom: 20px;
    position: relative;
}
#top_link .top_link_title::before{
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: 100px;
    height: 2px;
    background-color: #fff;
}

.logo_bg1 {
    display: block;
    text-align: right;
}
.logo_bg1 img{
        width: min(40%, 190px);
}

/* YouTube */
.youtube{
    position: relative;
    /* max-width: 780px; */
    width: min(80%, 900px);
    text-align: center;
    margin: 4% auto -7%;
    z-index: 2;
}
.youtube:before {
	content: "";
	display: block;
	width: 100%;
	padding-top: 56.25%;
}
.youtube iframe{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}



/* ---------- under ---------- */
#cms_5-e,.cms_5-e{counter-reset: num;}
#cms_5-e .number:before,.cms_5-e .number:before{
	counter-increment: num;
	content: "Q."counter(num,decimal-leading-zero);
	font-family: Verdana;
}
#cms_5-e .cate_box:last-of-type,.cms_5-e .cate_box:last-of-type{
	border-bottom: none;
	margin-bottom: 5px;
}
@media screen and (max-width: 667px){
    #cms_5-e .number:before,.cms_5-e .number:before{
        left: 50%;
    }
}



/* ---------- tablet ---------- */
@media screen and (max-width: 1200px){
#pc_nav{display: none;}
}

/* ---------- tablet ---------- */
@media screen and (max-width: 768px){
.loading_logo{
    left: 57%;
}
#logo {
    width: 97px;
    top: 30px;
    left: 29px;
}
.youtube {
    margin: 10% auto -7%;
}
.logo_bg1 {
    text-align: left;
}

}

/* ---------- mobile ---------- */
@media screen and (max-width: 667px){
#logo {
    width: 72px;
    top: 14px;
    left: 19px;
}
#head_contact a::before {
    background-color: var(--color3);
    opacity: 1;
}
.fv_txt {
    top: 52%;
    left: 51%;
    width: min(88%, 800px);
}
#menu_nav #nav_logo {
    top: 17px;
    left: 32px;
    width: 48px;
}
#main_img{
    height: 100vh;
}
#loading img {
    width: 151px;
}
#top_link .top_link_title{
    font-size: -webkit-calc(1rem + 8px);
    font-size: calc(1rem + 8px);
}
.youtube {
    width: min(90%, 900px);
    margin: 14% auto -14%;
}
.logo_bg1 {
    text-align: right;
    width: 87%;
}

}




/* fix_bnr ---------------------------------------------------------------------------------------------*/
#fix_bnr {
    bottom: 9px;
    right: 67px;
    z-index: 10;
    width: 70%;
    max-width: 320px;
    transition: 0.5s;
    opacity: 0;
}
#fix_bnr.scroll{
    opacity: 1;
}
#fix_bnr.close{
    opacity: 0;
    z-index: -1;
}
@media screen and (max-width: 768px){
#fix_bnr.close{
    transform: translateX(200px);
}
}
@media screen and (max-width: 667px){
#fix_bnr {
    width: 57%!important;
    right: 0;
    left: 0;
    margin: auto;
    bottom: 10px;
}
}
/* fix_bnr end ---------------------------------------------------------------------------------------------*/