﻿/* ----------　all　---------- */

/* ----------　カラー　---------- */

:root{
    --white:#f5f3ee;
    --black:#60513c;
}

.txt_color1,.hvr_txt_color1:hover{color: #1e1c1b;} /* メインカラー */
.txt_color2,.hvr_txt_color2:hover{color: #4d0808;} /*　サブカラー*/
.txt_color3,.hvr_txt_color3:hover{color: #111b39;}　/* アクセントカラー1 */
.txt_color4,.hvr_bg_color4:hover {color: #f5f5f5;} /* アクセントカラー2 */
/*.txt_color5,.hvr_txt_color5:hover{color: #f2ede7;}*/ 

.bg_white,.hvr_bg_white:hover{background-color: var(--white)} /* 白背景 */
.bg_black,.hvr_bg_black:hover{background-color: var(--black);} /* 黒背景 */

.bg_color1,.hvr_bg_color1:hover{background-color: #4d0808;
                                background-image: url(dup/img/bg_img.jpg);
                                background-size: cover;}　/* メインカラー */
.bg_color2,.hvr_bg_color2:hover{background-color:#a79e96;} /*　サブカラー*/
.bg_color3,.hvr_bg_color3:hover{background-color: #4d0808; 
                                background-image: url(dup/img/bg_img.jpg);}　/* アクセントカラー1 */
/*.bg_color4,.hvr_bg_color4:hover{background-color: #c5bfb7;} /* アクセントカラー2 */
/*.bg_color5,.hvr_bg_color5:hover{background-color: #f2ede7;}*/ 

.border_color1,.hvr_border_color1:hover{border-color: #6a5d50;}　/* メインカラー */
.border_color2,.hvr_border_color2:hover{border-color: #fff;} /*　サブカラー*/
.border_color3,.hvr_border_color3:hover{border-color:#85614c;}　/* アクセントカラー1 */
/*.border_color4,.hvr_border_color4:hover{border-color: #fce4d6;}*/
/*.border_color5,.hvr_border_color5:hover{border-color: #f2ede7;}*/

.bg_color3, .hvr_bg_color3:hover {background-color: #b8aa9c;}
.border_color4 { border-color: #6a5d50;}
.bg_color2 {background-color: #ddd6d0;
            background-image: url(dup/img/bg_img2.jpg);
            background-size: contain;}
.bg_color4 {background-color: #c5bfb7;}
.txt_color3, .hvr_txt_color3:hover {color: #43444e;}


#main_menu ul li a{color: #f5f5f5;}
.tel_bt a{color: #fff;}

.close_menu span, .open_menu span {
    font-size: 12px !important;
}

.open_menu span {  color: white;}

/* ----------　ヘッダーバナー　---------- */
.head_banner a{
    color: #fff;
    background-color:#a79e96;
}
.head_banner a:hover{
    background-color:#6a5d50;
    transition: all 0.5s;
}

/* ----------　フォント　---------- */
.en_font{
    font-family: "游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif"!important;
}
body {
    background-color: #f5f3ee;
    font-family: "游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif"!important;
}

h1, h2, h3, h4, h5, h6 {
    font-family: "游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif"!important;
}

/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc { display: block !important; }
.sp { display: none !important; }

.linkStyle{
	color:#111b39;
}
.linkStyle:hover{
	color:#82604b;
	opacity: 0.7;
	transition: all 0.5s;
}

   footer .logo img {
    max-width: 500px;
}
 

#foot_banner a {color: var(--white);}

/* ----------　TOP　---------- */

header.bg_color4 {background-color: #bdb4a8;}
#main_img figure{
    top: 0px!important;
}
#contents3 .con_no {color: #f5f5f5;}

.example{
    position: relative;
    display: inline-block;
}
.example img{
    display: block;
    max-width: 100%;
    height: auto;
}
.example img:nth-of-type(2){
    position: absolute;
    right: 0%;
    bottom: 0%;
    width: 50%;
    height: auto;
}

   .more txt_right:hover{
       color: #fff;
   }

/* ----------　バナー　---------- */

.bnr {
    max-width: 300px;
    max-height: 300px;
    width: 100%;
    /* height: 100%; */
    position: absolute;
    bottom: 10px;
    right: 0%;
    z-index: 99;
    transition: 0.5s;
 }
#main_img #main_img_border {
    position: absolute;
    top: 20px;
    left: 20px;
    border-color: #fff;
    box-sizing: border-box;
    transition: ease 0.3s;
    z-index: 9;
    pointer-events: none;
}

#foot_banner a {color: var(--white);}
/*#main_img::before {*/
/*    content: "";*/
/*    position: absolute;*/
/*    width: 100%;*/
/*    height: 100%;*/
/*    top: 0;*/
/*    left: 0;*/
/*    background-color: rgba(120 ,164 ,215 ,0.25);*/
/*    mix-blend-mode: color-burn;*/
/*}*/
.catch {
    z-index: 3 !important;
    max-width: 900px !important;
    width: 90% !important;
    top: 50px !important;
    left: 5%!important;
    filter: drop-shadow(1px 1px 10px rgba(51, 69, 93,0.2));
}

      /*#main_img #main_img_border{*/
      /*    top:50px;*/
      /*}*/
.point p {
    padding-left: 25px;
    position: relative;
}
.point p:before {
    font-family: "FontAwesome";
    content: "\f00c";
    position: absolute;
    left: 0px;
    top: 0px;
    color: #85614c;
}
#cms_6-b .cate_box{
    /*background: #4d0808;*/
    /*background-image: url(dup/img/bg_img.jpg);*/
    /*background-size: cover;*/
    background-position: center;
}

    #intro h2 {
    font-size: 36px;
}

.cate_list li a {color: #1e1c1b;}
.opacity05 {opacity: 0.8;}

.button:hover::after {box-shadow: inset 0 0 0 15em #b8aa9c;}

.font_14 {font-size: 16px;}
html, body {font-size: 16px;}
.fat-nav li {font-size: 16px;}

   footer .logo img {
    max-width: 500px;
}

/* ----------　下層ページ　---------- */
#page_title .page_box p{
    color: #8a6657;
}
.cate_list li a {color: #1e1c1b;}
.opacity05 {opacity: 0.8;}

.pager li a {color: #6a5d50;}

.page08.linkStyle{
           display: block;
           width: 300px;
           padding: 15px 0;
           margin: auto;
           background: #569f3c;
           color: #FFF;
           text-decoration: none;
           text-align: center;
}

#cms_2-b .cate_box{
    border-left: none;
    position: relative;
}
#cms_2-b .cate_box:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 10px;
    height: 100%;
    background-image: url(dup/img/bg_img.jpg);
}

#page03 .border_so10-l {
    border-left: 10px solid;
}


.cate_title {background-size: 40% !important;}
.example:hover{
    background: #225f0d;}　　

.cate_list li a {color: #1e1c1b;}

#cms_1-b .date {color: #fff;}

#page02 li a {color: #ffffff;}

#page10 li a {
    color: #ffffff;
    border-radius: 5px 5px 0 0;
}

/* 会社情報 */
#page07 .box_wrap .box {
    background-color: transparent;
    background-image: none;
}
#page07 .box_wrap .box:nth-of-type(odd) {
    background-size: cover;
    background-image: url(dup/img/bg_img2.jpg);
}
/* お問い合わせ */
/* プライバシーポリシー */
/* サイトマップ */

/*-------------------------------------------------------
			          タブレット
-------------------------------------------------------*/
@media screen and (max-width: 768px){

    header h1 {
        max-width: 210px;
    }

.bnr {
    max-width: 150px;
    max-width: 200px;
    max-height: 150px;
    bottom: 30px
 }
}

      /*#main_img #main_img_border{*/
      /*    top:50px;*/
      /*}*/
      
    #intro h1 {
    display: flex;
    margin: bottom initial;
    }
    
     #intro h2 {
    font-size: 36px;
}

    footer .logo img {
    max-width: 400px;
}
    
    @media only screen and (max-width: 768px){
    .catch {
    z-index: 3 !important;
    max-width: 800px !important;
    margin: auto !important;
    width: 95% !important;
    top: 60px !important;
    left: 20px!important;
    right:20px !important;
}

.cate_title {background-size: 60% !important;}

    }

/*-------------------------------------------------------
		            	スマホ
-------------------------------------------------------*/
@media screen and (max-width: 667px){

 /*.bnr {*/
 /*   max-width: 75px;*/
 /*   max-height: 75px;*/
 /*   width: 100%;*/
 /*   height: 100%;*/
 /*   position: absolute;*/
 /*   bottom: -25%;*/
 /*   right: 0%;*/
 /*   z-index: 99;*/
 /*   transition: 0.5s;*/
 /*}*/
 
 /*   section#main_img {*/
 /*   margin-top: -32px;*/
 /*}*/
    header {
    padding: 15px;
}
    header h1 {
    max-width: 150px;
}
    #menu_bt {
    top: 19px;
}
 
  .banner {
    width: 40%;
    bottom: 320px;
    right: 10px;
}

      #main_img #main_img_border{
          top:50px;
      }
.point .txt_box{
    padding: 5% 0;
}
}

/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 667px) {
    .pc { display: none !important; }
    .sp { display: block !important; }

    .catch {
    z-index: 3 !important;
     display: block !important;
    max-width: 500px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 80% !important;
    top: 60px !important;
    left: 20px!important;
    right:20px !important;
 }

.bnr {
    max-width: 150px;
    max-height: 100px;
    bottom: 10px;
    /* width: 100%; */
    /* height: 100%; */
    /* position: absolute; */

    /* right: 0%; */
    /* z-index: 99; */
    /* transition: 0.5s; */
}

   .letter_4 {
     letter-spacing: 0px; 
}

    #intro h1 {
    display: flex　!important;
    margin: bottom initial　!important;
    }

    #intro h2 {
    font-size: 18px;
}

    footer .logo img {
    max-width: 350px;
}

a.scroll_bt{display:none;}



}



/*追従バナー--------------------------------------------------------------------------------*/


div#foot_banner {
    z-index: 999;
}
    
.fixed_img {
    /*display: block ;*/
    position: fixed;
    bottom: 5px;
    right: 90px;
    z-index: 999 !important;
    width: 100%;
    max-width: 300px;
    transition: 0.5s;
}
.fixed_img:hover{
    opacity: 0.8 !important;
    transition: 0.5s;
}

/*--------1700px-------*/
@media screen and (max-width: 1700px){
 p#copyright {
    padding-bottom: 110px;
}
}

/*--------タブレット--------*/
@media screen and (max-width: 768px){
.fixed_img {
    max-width: 280px;
}


#main_img #main_img_border {
    top: 20px;
}
    
}
    
/*--------スマートフォン--------*/
@media screen and (max-width: 667px){
.fixed_img {
    max-width: inherit;
    width: 65%;
    left: 55%;
    transform: translate(-56%, 0px);
}
}




/*2023/5/22動画追加--------------------------------------------*/
#video{height: 100vh!important; }
#video video{
	width: auto!important;
	height: 100%;
	top: 50%;
	left: 50%;
	-ms-transform: translate(-50%,-50%);
	-webkit-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
    vertical-align: bottom;
}

/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
	#video {
		height: auto!important;
		width: 100%;
	}
	#video video {
		width: 100%!important;
		height: auto;
		position: relative;
		top: 0%;
		left: 0%;
		-ms-transform: translate(-50%,-50%);
		-webkit-transform: translate(-50%,-50%);
		transform: translate(0%,0%);
	}
	
#main_img {
    position: relative;
    height: auto;
    min-height: auto;
    height: auto!important;
    width: 100%;
}

#main_img #main_img_border {
    top: 20px;
    height: calc(100% - 40px) !important;
}
}


/*--------スマートフォン--------*/
@media screen and (max-width: 667px){
#main_img #main_img_border {
    top: 10px;
    height: calc(100% - 20px) !important;
    width: calc(100% - 20px) !important;
    left: 10px;
}

#video video {
    width: auto !important;
    height: 45vh !important;
    position: relative;
    top: 0%;
    left: 0%;
    -ms-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    transform: translate(0%,0%);
}
}
/*2023/5/22動画追加--------------------------------------------*/

#video::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: rgba(120 ,164 ,215 ,0.25);
    mix-blend-mode: color-burn;
}



/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
.catch {
    z-index: 3 !important;
    max-width: 600px !important;
    margin: auto !important;
    width: 50% !important;
    top: 25px !important;
    left: 21px!important;
    right: auto !important;
}

.bnr {
    bottom: 45px;}
}

/*--------スマートフォン--------*/
@media screen and (max-width: 667px){
.catch{display:none !important;}
}