﻿/* CMS・下層ページ ----------------------------------*/
.box_img1,.cate_img1{border-radius: 15px;}
#cms_2-h .cate > div{border-radius: 35px;}

/* LP風の料金表 */
#cms_3-d .cate_box{
    margin-top: 90px;
    background-color: #fff9f5;
    border-radius: 15px;
}
#cms_3-d .box_title{
    /*background-color: #fff;*/
    /*margin: -50px 20% 20px;*/
    font-size: 28px;
    text-align: center;
    border-radius: 30px;
    padding: 10px 0 6px;
    /*border: 1px solid;*/
}
#cms_3-d .box_txt1{
    padding: 10px 20px;
    color: #fff;
    border-radius: 10px;
    text-align: center;
    font-size: 20px;
    font-weight: 600;
}
#cms_3-d .box_price1{
    font-size: 30px;
    padding: 25px 10px 14px;
}
#cms_3-d .box_price2{
     padding: 10px;
    display: block;
    vertical-align: middle;
    line-height: 2.5;
    color: #6d645d;
}
#cms_3-d .box_txt2{
    background-color: #fffefa;
    padding: 20px;
}
#cms_3-d .cate_title{font-size: 35px;}

#cms_3-d .cate{
    /*background-color: #d8fbef;*/
    padding: 40px 5%;
}


/* タブレット */
@media screen and (max-width: 768px){
    #cms_3-d .box_title{margin: 0px 15% 20px;}
}
/* スマホ */
@media screen and (max-width: 667px){
        #cms_3-d .cate_box{padding: 20px 3%;}
    #cms_3-d .box_title{
        margin: 0px 1% 20px;
        font-size: 21px;
    }
    #cms_3-d .box_txt1{
        padding: 10px 5px;
        font-size: 18px;
        letter-spacing: 0em;
        
    }
    #cms_3-d .box_price1{
        font-size: 35px;
        padding: 20px 10px 0px;
        text-align: center;
        width: 100%!important;
    }
    #cms_3-d .box_price2{
        padding: 0px;
        line-height: 1.5;
        text-align: center;
        width: 100%!important;
    }
    #cms_3-d .cate_title{font-size: 28px;}
}

/* メインイメージ -----------------------------------*/
.main_fadeIn {
animation-name: fadeInAnime;
animation-duration:2s; /* アニメーション時間 */
animation-delay: 1.8s; /* 〇秒後に変化 */
animation-fill-mode:forwards;
opacity: 0;
}

@keyframes fadeInAnime{
  0% {
    opacity: 0;
    
  }

  100% {
    opacity: 1;
  }
}
.main_fadeIn_c{
    animation-name: fadeInAnime;
animation-duration:1.8s; /* アニメーション時間 */
animation-delay: 2.8s; /* 〇秒後に変化 */
animation-fill-mode:forwards;
opacity: 0;
}
.catch {
    z-index: 3;
    position: absolute;
    top: 61%;
    left: 3%;
    transform: translate(0%, -50%);
    width: 44%;
}

#main_img .main{
    height: 100vh;
}
    #main_img .main img{
        transform: translate(-50%, -50%);
        position: absolute;
        top: 50%;
        left: 50%;
        height: 100%;
        width: auto;
    }

@media screen and (min-width: 1601px){
    #main_img .main img{
        height: auto;
        width: 100%;
    }
}

/* タブレット */
@media screen and (max-width: 768px){
    #main_img .main{height: auto;}
}
/* スマホ */
@media screen and (max-width: 667px){
    .catch {
        top: auto;
        bottom: 5%;
        left: 3%;
        transform: translate(0%, 0%);
        width: 44%;
    }
    #main_img,#main_img .main{height:50vh;}
}

/* トップページ -------------------------------------*/
header #logo{max-width: 170px!important;}
header #logo .logo img{width: 100%!important;}

#intro .intro_txt{
    background-color: #5c2c0b;
    margin-top: -25%;
    padding: 50px;
    border-radius: 20px;
    width: 36%!important;
    margin-left: 5%;
}
#intro .intro_txt h2{letter-spacing: 0em;}
#intro .intro_img1{border-radius:20px; box-shadow: 7px 9px 0px #c7ac9a;}
#intro .intro_img2{border-radius: 15px; box-shadow: 7px 9px 0px #c7ac9a;}

#contents .con_img{
    border-radius: 20px;
    box-shadow: 7px 9px 0px #c7ac9a;
}
#contents .box1{
    padding-bottom: 200px
}
#contents .box2 .con_img{margin-top: -50px;}
#contents .box2 .con_txt_wrap{padding-top: 0;}
#contents .box2{
    background-color: #fff9f5;
}
/*
#contents .box_wrap .box{
    background-color: #f7f2bf;
    border-radius: 15px;
    margin-bottom: 150px;
    padding-bottom: 0;
}
#contents .box_wrap .box .con_txt_wrap{
    padding: 20px;
}
*/
/* タブレット */
@media screen and (max-width: 768px){
    #intro .intro_txt{
        width: 100%!important;
        margin-top: -20%;
        margin-left: 0;
        margin-bottom: 50px;
    }
}
/* スマホ */
@media screen and (max-width: 667px){
    #intro .intro_txt{
        margin-top: -20px;
        padding: 30px 5% 40px;
    }
    #contents .box1{padding-bottom: 140px;}
    #contents .box2 .con_img{margin-top: -30px;}
}

/* 全体 ---------------------------------------------*/
header #header #header_menu li:last-child a span{
    border-radius: 5px;
}

.cate_list li a,.pager li a,.more a{border-radius: 5px;}
#page-top a{border-radius: 50%;}

.linkStyle{
	color:#e8a272;
	text-decoration: underline;
	transition: all 0.5s;
}
.linkStyle:hover{
	color:#e8a272;
	opacity: 0.7;
	text-decoration: none;
}

/* タブレット */
@media screen and (max-width: 768px){
    header #logo{max-width: 110px!important;}
}
/* スマホ */
@media screen and (max-width: 667px){
    header #logo{max-width: 110px!important;}
    #info .info_txt h3{letter-spacing: 0.07em;}
}

/* 配色 ----------------------------------------------*/
/*ろごのいろ*/
/*
オレンジ系　e8a272
きいろけい　ede48c
もじしょく　665e57
はいけい　f4f3ea
*/
header{background: linear-gradient(0deg, transparent, #eee1bf);}
#wrap{background-color: #fff;}
#intro{background-color: #fff9f5;color: #fff;}
header #header #header_menu li:last-child a span:hover{background-color: #e8a272;}
.cate_list li a,.more a{background-color: #8b400d;}
.cate_list li a:hover,.more a:hover,.pager li a:hover{background-color: #e8a272;}

#contents .con_title, #contents .con_no{color: #5c2c0b;}

#page_title h2{color: #665e57;}

.txt_color1,.hvr_txt_color1:hover{color: #e8a272;} 
/*.txt_color2,.hvr_txt_color2:hover{color: #f4f3f2;} */
.txt_color3,.hvr_txt_color3:hover{color: #815503;} 
/*.txt_color4,.hvr_txt_color4:hover{color: #eae4df;} */
/*.txt_color5,.hvr_txt_color5:hover{color: #f2ede7;}*/ 

.bg_color1,.hvr_bg_color1:hover{background-color: #8b400d;}
.bg_color2,.hvr_bg_color2:hover{background-color: #f7f5e4;}
/*.bg_color3,.hvr_bg_color3:hover{background-color: #60513c;} */
.bg_color4,.hvr_bg_color4:hover{background-color: #ede48c;} 
/*.bg_color5,.hvr_bg_color5:hover{background-color: #f2ede7;}*/ 

.border_color1,.hvr_border_color1:hover{border-color: #e8a272;}
/*.border_color2,.hvr_border_color2:hover{border-color: #f4f3f2;}*/
.border_color3,.hvr_border_color3:hover{border-color: #ede48c;}
.border_color4,.hvr_border_color4:hover{border-color: #ede48c;}
/*.border_color5,.hvr_border_color5:hover{border-color: #f2ede7;}*/

/*テンプレート  -------------------------------------*/
body,.font_14,.font_12,.font_100per,.font_2dw,.font_2dw_tb,.font_2dw_sp,.font_14_sp{
    font-size: 16px;
}
.font_2up{font-size: 18px;}
.font_4up{font-size: 20px;}

/* 問い合わせページ -------------------------------------*/
.con_box{}
.con_box .con_line,.con_box .con_insta{
    padding: 20px 0;
    margin-bottom: 20px;
    border-radius: 8px;
    box-shadow: 0px 3px 15px rgba(0,0,0,0.2);
}
.con_box .con_line{
    background-color: #25b950;
}
.con_box .con_insta{
    background: linear-gradient(45deg, #9e37b7, #d9307b);
}

.con_box .con_line a,.con_box .con_insta a{
    color: #FFF;
}
.con_box .con_line a span,.con_box .con_insta a span{
    font-size: 1.2rem;
    font-weight: bold;
}
.con_title{
    width: 100%;
    text-align: center;
    margin-bottom: 50px;
    font-size: 20px;
    line-height: 1.7;
}