﻿
h1,h2,h3,h4,p, .pop400, #pc_nav li, #top_pc_nav li, #footer_nav li, .overlay ul li, #cms_2-c .cate_title, #cms_2-c .cate_txt1, #cms_4-b .cate_title, #cms_4-b .box_title1, #cms_7-b .box_item, #mail_contact .txt_left, .jp, .cate_list, .fadein_up2, #cms_2-a .box_txt1, .blogBlock, .blog_pager, .cms_2-a .box_txt1 {font-family: "Hannari","游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif";}
#page3 p, #page3 h3, #page3 h2, #page3 .blogBlock {
    font-family: "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
/*--------------------------------------------
 色 ・　文字
----------------------------------------------*/
:root{
    --color1: #90877c;
    --color2: #bb0909;
    --color3: #bb0909;
    --color4: #C8ACA9;
    --text: #111111;
    --base: #ffffff;
    
    --font1: 16px;
    --fontB1: 32px;
    --font-jp: 'Noto Sans JP', "游ゴシック Medium", sans-serif;
}
/* スマホ */
@media screen and (max-width: 667px){
    :root{
        --fontB1: 22px;
    }
}
/*--------------------------------------------
 
----------------------------------------------*/




/*--------------------------------------------
 
----------------------------------------------*/




/*--------------------------------------------
 プライバシーポリシー
----------------------------------------------*/



/*--------------------------------------------
 お問い合わせ
----------------------------------------------*/


/* --------------------------------------------
 メインイメージ 
---------------------------------------------*/

/* タブレット */
@media screen and (max-width: 768px){}
/* スマホ */
@media screen and (max-width: 667px){}

/* --------------------------------------------
 リンクボタン 
---------------------------------------------*/
.linkStyle,a{
	color: var(--color1);
	text-decoration: underline;
	transition: all 0.5s;
}
a{
    text-decoration: none;
}
.linkStyle:hover,a:hover{
	opacity: 0.7;
	text-decoration: none;
}

.cate_list li a,.more a{
    background-color: var(--color1);
    /*background: linear-gradient(90deg, var(--color3)5%, var(--color1)95%);*/
    color: var(--base);
    font-weight: bold;
    padding: 10px 20px;
    transition: all 0.8s;
}

.cate_list li a:hover,.more a:hover{
    background-color:var(--color3);
    opacity: 0.7;
}


/*--------------------------------------------
 色 ・　文字
----------------------------------------------*/
html,body,.font_10,.font_11,.font_12,.font_13,.font_14,.font_15{font-size: var(--font1);}
.font_2up{font-size: max(calc(var(--font1) + 2px), calc(1rem  + 2px));}
.font_4up{font-size: max(calc(var(--font1) + 4px), calc(1rem  + 4px));}
.font_2dw{font-size: max(calc(var(--font1) - 2px), calc(1rem  - 2px));}
.font_4dw{font-size: max(calc(var(--font1) - 4px), calc(1rem  - 4px));}
.font_6dw{font-size: max(calc(var(--font1) - 6px), calc(1rem  - 6px));}



/* color */
body, .txt_color_nomal, .hvr_txt_color_nomal:hover{color: var(--text);}
.linkStyle{transition: 0.5s;color: var(--text)}
.linkStyle:hover{opacity: 0.7}

.txt_white, .hvr_txt_white:hover{color: white;}
.txt_red, .hvr_txt_red:hover{color: var(--red);}
.txt_color1, .hvr_txt_color1:hover{color: var(--color1)} /* メインカラー */
.txt_color2, .hvr_txt_color2:hover{color: var(--color2)} /* サブカラー */
.txt_color3, .hvr_txt_color3:hover{color: var(--color3)} /* アクセントカラー1 */
.txt_color4, .hvr_txt_color4:hover{color: var(--color4)} /* アクセントカラー2 */

/* background-color */
.bg_white, .hvr_bg_white:hover{background-color: white} /* 白背景 */
.bg_black, .hvr_bg_black:hover{background-color: var(--black)} /* 黒背景 */
.bg_color1, .hvr_bg_color1:hover{background-color: var(--color1)} /* メインカラー */
.bg_color2, .hvr_bg_color2:hover{background-color: var(--color2)} /* サブカラー */
.bg_color3, .hvr_bg_color3:hover{background-color: var(--color3)} /* アクセントカラー1 */
.bg_color4, .hvr_bg_color4:hover{background-color: var(--color4)} /* アクセントカラー2 */
.bg_color_clear, .hvr_bg_color_clear:hover{background-color: transparent!important}


/* border-color ※!important */
.border_white, .hvr_border_white:hover{border-color: white}
.border_black, .hvr_border_black:hover{border-color: var(--black)}
.border_color1, .hvr_border_color1:hover{border-color: var(--color1)}
.border_color2, .hvr_border_color2:hover{border-color: var(--color2)}
.border_color3, .hvr_border_color3:hover{border-color: var(--color3)}
.border_color4, .hvr_border_color4:hover{border-color: var(--color4)}

/*************************************************/

.menu .bg_white {
    background-color: rgba(0, 0, 0, 0);
}


.back1:before, .back2:before {
    background-color: rgba(200, 172, 169, 0.5) !important;
}
.cms_title, .top_cms_box {
    position: relative;
}

header.scr_header {
    background-color: rgba(200, 172, 169, 0.7) !important;
}
#pc_nav li a {
    color: #222;
}
#pc_nav li a::after {
    background: rgba(0, 0, 0, 0.5);
}
#page3 .blog_list .border_color2 {
    border-color: var(--color1);
}
#main_img:before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background-color: rgba(21, 71, 46, 0.5);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

.cate_list li a {
    color: var(--color1) !important;
}
.cate_list li a:hover {
    opacity: 0.2 !important;
}
#footer {
    background-color: var(--color4);
}
.cate_list li a, .cate_list li a:hover {
    opacity: 0.9;
}
.cate_list li a {
    color: #fff;
}
#footer h2, #footer_txt, #footer .tel_bt, #h1txt {
    color: #fff;
}
.blog_wrap .border_color2 {
    border-color: #a1b4ab;
}
#fakeloader {
    /*background-image: url(../img/sizu.jpg);
    background-size: contain;*/
    background-color: #fff;
}

#spanizer {
    z-index: 3;
    top: 13%;
    font-size: 30px;
    color: #fff;
}
#footer .tel_bt .txt_color3 {
    color: #e28b7c;
}
#intro_wrap, #contents3_wrap .con_box {
    box-shadow: 1px 2px 12px #25630621;
}
.overlay {
    background: linear-gradient(135deg, rgba(234, 197, 182, 1), rgba(193, 163, 125, 1)) !important;
}
@-webkit-keyframes letter-glow {
  0% {
    opacity: 0;
    text-shadow: 0px 0px 1px rgba(255, 255, 255, 0.1);
  }
  66% {
    opacity: 1;
    text-shadow: 0px 0px 20px rgba(255, 255, 255, 0.9);
  }
  77% {
    opacity: 1;
  }
  100% {
    opacity: 0.9;
    text-shadow: 0px 0px 20px rgba(255, 255, 255, 0);
  }
}

@keyframes letter-glow {
  0% {
    opacity: 0;
    text-shadow: 0px 0px 1px rgba(255, 255, 255, 0.1);
  }
  66% {
    opacity: 1;
    text-shadow: 0px 0px 20px rgba(255, 255, 255, 0.9);
  }
  77% {
    opacity: 1;
  }
  100% {
    opacity: 0.9;
    text-shadow: 0px 0px 20px rgba(255, 255, 255, 0);
  }
}

.cms_title .pop400 {
    color: #111;
}

.top_cms_box .blogListPattern_item {
    background-color: rgba(255, 255, 255, 0.9);
}
#contents3_wrap:after {
    background-color: rgba(144, 135, 124, 0.5) !important;
}
.btn1, .btn4 {
    width: 300px;
}
.btn2, .btn3, .btn5 {
    margin: 20px auto 0;
    width: 300px;
}
.cate_list li a:before {
    left: 0px;
}
#page8 #form_box input {
    background-color: rgba(255, 255, 255, 1) !important;
}
input::placeholder, textarea::placeholder {
  color: #222 !important;
}
.button_container span:nth-of-type(1) {
    font-size: 13px;
}
.num, .cms_2-a h4, #cms_2-a h4 {
    color: #90877c;
}
.return a, .more_btn {
    color: var(--color1);
}
#page_title .page_title_box {
    background-color: var(--color4);
    border: 1px solid #fff;
    box-shadow: 0 0 0 10px #C8ACA9;
}
.line:before {
    background-color: var(--color1) !important;
}
/* タブレット */
@media screen and (max-width: 768px){

#spanizer {
    top: 75%;
}
#intro_wrap:before {
    top: 21px;
    height: 15px;
}
#contents3 .con_box {
    background-image: none;
}
}
/* スマホ */
@media screen and (max-width: 667px){

#spanizer {
    z-index: 3;
    top: 75%;
    font-size: 39px;
    color: #fff;
    line-height: 1.3;
    left: 5%;
}
.btn1, .btn4 {
    margin: 20px auto 0;
}
.btn1, .btn2, .btn3, .btn4, .btn5 {
    width: 300px;
}
    #intro_wrap {
        padding-top: 20%;
    }
        #intro_wrap:before {
        top: 26px;
    }
    .cms_2-a .box_title1 {
        font-size: 19px;
    }
    .button_container span:nth-of-type(1) {
    font-size: 12px;
}
}

@media screen and (max-width: 321px){
.page_title_box h2 {
    font-size: 23px;
}
#spanizer {
        z-index: 3;
        top: 75%;
        font-size: 35px;
        color: #fff;
        line-height: 1.3;
        left: 4%;
    }
}