﻿
/* color */
body,.txt_color_nomal{color: #333333;}
.txt_white{color: white;}
.txt_red{color: red;}
.txt_color1{color: #808080} /* メインカラー */
.txt_color2{color: #1a1a1a} /* サブカラー */
.txt_color3{color: #c39035} /* アクセントカラー1 */
.txt_color4{color: #808080} /* アクセントカラー2 */

/* background-color */
.bg_white{background-color: white} /* 白背景 */
.bg_black{background-color: black} /* 黒背景 */
.bg_color1{background-color: #808080} /* メインカラー */
.bg_color2{background-color: #1a1a1a} /* サブカラー */
.bg_color3{background-color: #c39035} /* アクセントカラー1 */
.bg_color4{background-color: #808080} /* アクセントカラー2 */
.bg_color_clear{background-color: transparent!important}


/* border-color ※!important */
.border_color1{border-color: #808080}
.border_color2{border-color: #1a1a1a}
.border_color3{border-color: #c39035}
.border_color4{border-color: #808080}


/* hover ---------------------------------------------------------------------------------------------*/
/* color */
.hvr_txt_color_nomal:hover{color: #333333;}
.hvr_txt_white:hover{color: white;}
.hvr_txt_red:hover{color: red;}
.hvr_txt_color1:hover{color: #808080} /* メインカラー */
.hvr_txt_color2:hover{color: #1a1a1a} /* サブカラー */
.hvr_txt_color3:hover{color: #c39035} /* アクセントカラー1 */
.hvr_txt_color4:hover{color: #808080} /* アクセントカラー2 */

/* background-color */
.hvr_bg_white:hover{background-color: white} /* 白背景 */
.hvr_bg_black:hover{background-color: black} /* 黒背景 */
.hvr_bg_color1:hover{background-color: #808080} /* メインカラー */
.hvr_bg_color2:hover{background-color: #1a1a1a} /* サブカラー */
.hvr_bg_color3:hover{background-color: #c39035} /* アクセントカラー1 */
.hvr_bg_color4:hover{background-color: #808080} /* アクセントカラー2 */
.hvr_bg_color_clear:hover{background-color: transparent!important}

/* border-color ※!important */
.hvr_border_color1:hover{border-color: #808080}
.hvr_border_color2:hover{border-color: #1a1a1a}
.hvr_border_color3:hover{border-color: #c39035}
.hvr_border_color4:hover{border-color: #808080}

.linkStyle {
    color: #c39035;
}
#page8 .txt_center {
    color: #ffffff;
    position: relative;
    border-color: #ffffff;
}
#page8 #contact_tel a {
    position: relative;
    color: #ffffff;
    border-color: #ffffff;
}
#page8 .back1:before {
    background-color: rgba(255,255,255,0) !important;
}

#footer_txt, #h1txt {
    color: #ffffff;
}
.num {
    font-family: 'Great Vibes', cursive !important;
    color: #1a1a1a;
    width: 250px;
}
#contents1 .num {
    text-align: center;
}
#contents2 .num {
    text-align: center;
}
/*.num_posi {
    left: 5%;
}*/
.nav_menu_more:last-of-type a .icon:before {
    display: none;
}
header.scr_header {
    background-color: rgba(128,128,128,0.5) !important;
}
#main_img .bg_white {
    background-color: rgba(0,0,0,0);
}
.back1:before, .back2:before {
    background-color: rgba(255,255,255,1) !important;
}
/************大理石1***********/
/*#wrap {
    background-color: #b4ada9;
    background-image: url(./Dup/img/wrap_back.png);
}*/
/************大理石2 これに決まりそう***********/
#wrap {
    background-color: #b4ada9;
    background-image: url(./Dup/img/wrap_back.png);
}
/***********ストーン調1**************/
/*#wrap {
    background-color: #a49d9a;
background-image: url("https://www.transparenttextures.com/patterns/asfalt-light.png");
}*/
/***********ブロック**************/
/*#wrap {
    background-color: #a49d9a;
background-image: url("https://www.transparenttextures.com/patterns/brick-wall.png");
}*/
/***********モルタル**************/
/*#wrap {
    background-color: #a49d9a;
background-image: url("https://www.transparenttextures.com/patterns/clean-gray-paper.png");
}*/
/***********モルタル2**************/
/*#wrap {
    background-color: #a49d9a;
background-image: url("https://www.transparenttextures.com/patterns/concrete-wall-2.png");
}*/
/***********ストーン2**************/
/*#wrap {
    background-color: #a49d9a;
background-image: url("https://www.transparenttextures.com/patterns/cream-paper.png");
}*/
/**********モルタル3**************/
/*#wrap {
    background-color: #a49d9a;
background-image: url("https://www.transparenttextures.com/patterns/subtle-grunge.png");
}*/
/**********石1**************/
/*#wrap {
    background-color: #c7bdb9;
background-image: url("https://www.transparenttextures.com/patterns/buried.png");
}*/
#contents1 .con_box {
    margin-top: 20%;
    background-color: #f9f9f9;
    padding-top: 3%;
    padding-bottom: 3%;
    padding-right: 5%;
    position: relative;
    /*background-image: url("https://www.transparenttextures.com/patterns/cubes.png");*/
    background-image: url(./Dup/img/moyou20.png);
}
#contents1 .con_box:before {
    position: absolute;
    content: "";
    background-image: url(./Dup/img/con2_right.png);
    background-position: top right;
    background-size: contain;
    background-repeat: no-repeat;
    top: -20px;
    right: -20px;
    width: 100px;
    height: 150px;
}
#contents2 .con_box {
    margin-top: 15%;
    background-color: #f9f9f9;
    padding-top: 3%;
    padding-bottom: 3%;
    padding-left: 5%;
    position: relative;
    /*background-image: url("https://www.transparenttextures.com/patterns/cubes.png");*/
    background-image: url(./Dup/img/moyou20.png);
}
#contents2 .con_box:before {
    position: absolute;
    content: "";
    background-image: url(./Dup/img/con3_left.png);
    background-position: top left;
    background-size: contain;
    background-repeat: no-repeat;
    top: -20px;
    left: -20px;
    width: 100px;
    height: 150px;
}
#contents3 .con_box {
    position: relative;
    /*background-image: url("https://www.transparenttextures.com/patterns/cubes.png");*/
    background-image: url(./Dup/img/moyou20.png);
}
#contents3 .con_box:before {
    position: absolute;
    content: "";
    background-image: url("./Dup/img/con4_left.png");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: top left;
    top: 10px;
    left: 10px;
    width: 150px;
    height: 150px;
}
#contents3 .con_box:after {
    position: absolute;
    content: "";
    background-image: url("./Dup/img/con4_right.png");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: bottom right;
    bottom: 10px;
    right: 10px;
    width: 150px;
    height: 150px;
}
#intro_wrap, #contents3 .con_box {
    background-color: #f9f9f9;
}
#intro_wrap {
    /*background-image: url("./Dup/img/yuri.png");*/
    /*background-image: url("https://www.transparenttextures.com/patterns/cubes.png");*/
    background-image: url(./Dup/img/moyou20.png);
}

#intro .bg_white:before {
    position: absolute;
    content: "";
    background-image: url("./Dup/img/left.png");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: top left;
    top: -20px;
    left: -20px;
    width: 200px;
    height: 200px;
}
#intro .bg_white:after {
    position: absolute;
    content: "";
    background-image: url("./Dup/img/right.png");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: top left;
    bottom: -20px;
    right: -20px;
    width: 200px;
    height: 200px;
}

#footer_nav_wrap a {
    color: #c39035;
}
.top_cms_box {
    position: relative;
}
#footer_con .tel_bt {
    display: none;
}
.cms_2-a h4, .cms_2-a p, .cms_1-c .box_title1, .more_btn, #footer_nav_wrap a {
    color: #1a1a1a;
}
.top_banner {
    right: 10px;
}
.top_banner:hover {
    opacity: 0.7;
}
#footer #logo2 img {
        width: 70%;
}
.menu .width_300-max {
        width: 60%;
}
footer .txt_color1 {
    color: #f9f9f9;
}
.overlay {
    background: linear-gradient(
135deg
, rgba(128,128,128,0.9) , rgba(195,144,53,0.9) ) !important;
}
.cms_2-a .box_txt1 {
        opacity: 1;
}
#contact_tel a {
    padding: 15px 30px;
}
.fa-chevron-left:before, .fa-chevron-right:before {
    display: none;
}
.swiper-container {
    overflow: visible;
}
.swiper-button-prev, .swiper-container-rtl .swiper-button-next {
    left: -25px;
    right: auto;
}
.swiper-button-next, .swiper-container-rtl .swiper-button-prev {
    right: -25px;
    left: auto;
}
.swiper-button-next:after, .swiper-button-prev:after {
    color: #333;
    font-size: 20px;
    font-weight: bold;
}
.swiper-fade .swiper-slide-active, .swiper-fade .swiper-slide-active .swiper-slide-active {
    pointer-events: none;
}
/**********切り替え***************/
#pc_nav li span {
    transition: 0.3s;
    text-align: center;
}
#pc_nav li span:nth-child(1) {display: block;}
#pc_nav li span:nth-child(2) {
     opacity:0;
     position: relative;
     top: -1.5em;
     letter-spacing: 0;
}
#pc_nav li:hover span:nth-child(1) {opacity: 0;}
#pc_nav li:hover span:nth-child(2) {
    opacity: 1;
/*    color: #c39035;*/
}
#pc_nav li {
    /*font-size: 14px;*/
    width: auto;
}
#pc_nav li a {
    margin-top: 15px;
}



#top_pc_nav li span {
    transition: 0.3s;
    text-align: center;
}
#top_pc_nav li span:nth-child(1) {display: block;}
#top_pc_nav li span:nth-child(2) {
     opacity:0;
     position: relative;
     top: -1.5em;
     letter-spacing: 0;
}
#top_pc_nav li:hover span:nth-child(1) {opacity: 0;}
#top_pc_nav li:hover span:nth-child(2) {
    opacity: 1;
/*    color: #c39035;*/
}
#top_pc_nav li {
    font-size: 14px;
    width: auto;
}

#footer_nav li span {
    transition: 0.3s;
    text-align: center;
}
#footer_nav li span:nth-child(1) {display: block;}
#footer_nav li span:nth-child(2) {
     opacity:0;
     position: relative;
     top: -1.9em;
     letter-spacing: 0;
}
#footer_nav li:hover span:nth-child(1) {opacity: 0;}
#footer_nav li:hover span:nth-child(2) {opacity: 1;}
#footer_nav li {
    font-size: 14px;
    width: auto;
}
#pc_nav li a::after, #top_pc_nav li a::after, #footer_nav li a::after {
    /*position: absolute;
    left: 0;
    content: '';
    width: 100%;
    height: 2px;
    background: rgba(255,255,255,0.5);
    bottom: -10px;
    transform: scale(0, 1);
    transition: transform .3s;
    transform-origin: left top;*/
    display: none;
}
/**********************************/

.po:hover, .in:hover {
    opacity: 0.7;
}
#cms_3-d .item_img {
    position: relative;
}
#cms_3-d .box_wrap {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-box;
    display: -webkit-flexbox;
    display: -moz-flexbox;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: flex;
    -webkit-box-lines: multiple;
    -moz-box-lines: multiple;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    flex-direction: row;
}
.takasa {
    height: 650px;
}
.banner01 {
    bottom: 0;
}
#cms_3-d .box_txt2 {
    font-size: -webkit-calc(1rem - 0px);
    font-size: calc(1rem - 0px);
}
#contents3_wrap:after {
    background-color: rgba(50,50,50,0.3) !important;
}
/*#contents3_wrap:after {
    background-color: rgba(164,157,154,0.9) !important;
}*/
/*#contents3_wrap:after {
    background-color: rgba(180,173,169,0.5) !important;
}*/
/* タブレット */
@media screen and (max-width: 768px){
    #intro .bg_white:before {
    width: 150px;
}
    #intro .bg_white:after {
    width: 150px;
    bottom: -70px;
}
#contents2 .con_box {
    padding-right: 1%;
}
#contents2 .con_box:before {
    top: -30px;
    left: -40px;
}
#contents3 .con_box:before {
    width: 100px;
    top: -30px;
    left: -21px;
}
#contents3 .con_box:after {
    bottom: -36px;
    right: -16px;
    width: 100px;
}
.swiper-button-next:after, .swiper-button-prev:after {
    color: #333;
    font-size: 20px;
    font-weight: bold;
}

}

/* スマホ */
@media screen and (max-width: 667px){
#intro .num{
display: block;
}
.num {
    width: 200px;
}
    
    #intro .bg_white:before {
    width: 75px;
}
#intro .bg_white:after {
    width: 75px;
    bottom: -145px;
}
#contents1 .con_box {
    padding-left: 5%;
}
#contents1 .con_box:before {
    width: 70px;
}
#contents2 .con_box:before {
    top: -60px;
    left: -40px;
}
#contents3 .con_box:before {
    width: 60px;
    top: -10px;
    left: -16px;
}
#contents3 .con_box:after {
    bottom: -17px;
    right: -3px;
    width: 60px;
}
.top_banner {
    width: 80px;
}
#cms_3-d .cate_box .width_300 {
    width: 250px;
}
#contact_tel .width_400-max {
    width: 100%;
    max-width: 300px;
    padding: 5px 0;
}
#footer #logo2 {
    text-align: center;
}
#line_contact {
    max-width: 300px;
}
.swiper-container {
    overflow: visible;
    margin-top: 30px;
}
}

/*2022/12/20*/
.menu .width_300-max {
    width: 90%;
}
#logo,
header.scr_header #logo {
    max-width: 90px;
}
@media screen and (max-width: 768px){
#logo {
    max-width: 90px;
}
}