﻿/* CMS・下層ページ ----------------------------------*/
.cms_5-c .box_title1{font-weight: 500;}
.cate_list li a{border-radius: 25px;}
/* タブレット */
@media screen and (max-width: 768px){}
/* スマホ */
@media screen and (max-width: 667px){}

/* メインイメージ -----------------------------------*/
.catch {
    z-index: 3;
    position: absolute;
    top: 50%;
    right: 2%;
    transform: translate(0%, -50%);/* X横 Y縦 始点が要素の中心になる */
    width: 35%;
    max-width: 440px;
}
/* タブレット */
@media screen and (max-width: 768px){
    .catch{width: 32%;}
}
/* スマホ */
@media screen and (max-width: 667px){
    .catch{
        right: 0%;width: 33%;
    }
}

/* トップページ -------------------------------------*/
.dec1,.dec2,.dec3{z-index: 0;}
#contents1{
    padding: 100px 0%;
    background-color: #ffdcbf;
}
#contents1 .txt2{
    text-align: center;
    font-size: 32px;
    margin-bottom: 40px;
    z-index: 2;
    position: relative;
}
#contents1 .txt3 {
    position: relative;
    text-align: center;
    line-height: 1.8;
    letter-spacing: 0.07em;
    width: 500px;
    margin: 0 auto;
    z-index: 2;
}
#contents1 .dec1{
    right: 16%;
    top: 20%;
    width: 23%;
    max-width: 300px;
}
#contents1 .dec2{
    left: 16%;
    top: 5%;
    width: 15%;
}
#contents1 .dec3{
    bottom: 3%;
    left: 27%;
    width: 110px;
}

#contents2 .mg_t-20px{
    margin-top: 15%;
}
#contents2 .txt4{font-size: 33px;}
.top_link1{
    border-bottom: 1px solid;
    color: #bd895e;
    transition: all 0.5s;
}
.top_link1:hover{color:#2e2218;}


#contents3 .txt5,#contents3 .txt7{
    font-size: 25px;
    margin-bottom: 30px;
}
#contents3 .img6{
    z-index: 1;
}

#attach .dec1{
    right: 13%;
    bottom: -80px;
    width: 13%;
    max-width: 150px;
}
#contents3 .dec2{
    left: 2%;
    top: 50px;
}
#contents3 .dec1{
    right: 2%;
    bottom: -20px;
}

.cms_title h2{font-weight: 500;position:relative;z-index:2;
    border-bottom: 2px solid;
    width: 220px;
    margin: 0 auto;}
.cms_title h2::before{
        content: "";
    background-image: url(./Dup/img/cms_title.png);
    width: 100px;
    height: 100px;
    background-size: cover;
    background-repeat: no-repeat;
    position: absolute;
    transform: translate(-50%, -50%);
    top: 0%;
    left: 14%;
    opacity: 0.4;
    z-index: -1;
}

/* アニメーション -------------------------------------*/
.con1_r{
    transform: translate(-70px,120px);
	transition: transform 1.8s ease, opacity 2s ease-out, filter 2.3s ease-out;
	transition-property: opacity,transform,filter;
	opacity: 0;
	filter: blur(0px);}
.con1_l{
    transform: translate(90px,120px);
	transition: transform 1.8s ease, opacity 2s ease-out, filter 2.3s ease-out;
	transition-property: opacity,transform,filter;
	opacity: 0;
	filter: blur(0px);}
.con1_r.start1,.con1_l.start1{transform: translate(0,0);opacity: 0.9;filter: blur(35px);}

.in1{
    transform: translate(0px,50px);
	transition: transform 1.5s ease, opacity 1.5s ease-out, filter 1.5s ease-out;
	transition-property: opacity,transform,filter;
	opacity: 0;
	filter: blur(0px);
}
.in1.start1{transform: translate(0,0);opacity: 0.8;filter: blur(33px);}
/* タブレット */
@media screen and (max-width: 768px){
    #attach{height: 350px;}
    #contents2 .mg_t-20px{ margin-top: 20px;}
    #contents2 .img5{
        width: 70%!important;
        margin: 40px auto 0;
    }
    
    .cms_title h2{font-size: 24px;}
    .cms_title h2::before{left: 20%;}
}
/* スマホ */
@media screen and (max-width: 667px){
    #contents1 .txt2{font-size: 28px; width: 330px; margin: 0 auto 40px;}
    #contents1 .txt3 {width: 86%;margin: 0 auto;text-align: left;}
    #contents1 .dec2{left: 5%; top: 3%; width: 26%;}
    #contents1 .dec1{right: 3%;top: 14%;width: 23%;}
    #contents1 .dec3{bottom: -8%; left: auto; width: 110px; right: 3%;}
    
    #attach .dec1{width: 20%;}
    
    #contents2{padding: 70px 10% 120px;}
    #contents2 .txt4{font-size: 28px; letter-spacing: 0.07em; line-height: 1.7;}
    
    #contents3 .txt5,#contents3 .txt7{letter-spacing: 0em;}
    #contents3 .dec2{display: none;}
    #contents3 .dec1{bottom: -20px; width: 20%;}
    
    .cms_title h2{font-size: 23px; width: 200px;}
    .cms_title h2::before{left: 30%;}
    /* アニメーション（スマホ） ---------------------*/
    .con1_r,.con1_l{transform: translate(0px,100px);}
    .con1_r.start1, .con1_l.start1{opacity: 0.7;filter: blur(10px);}
    .in1.start1{filter: blur(13px);}
}
@media screen and (max-width: 330px){
    #contents1 .txt2{width: 320px;}
    #contents2 .txt4{width: 210px;}
}

/* 全体 -----------------------------------------------------------*/
#fakeloader{background-color: #ffcf9d;}
.main_box{background-color: #fffaf5;}
header .head_banner a{background-color: #462f1c;}
.more a{background-color: #462f1c;}
.button:hover::after{box-shadow: inset 0 0 0 15em #9b6539;}

#page_title .dec1{
    right: 20%;
    bottom: 0;
}
.linkStyle{
	color:#764822;
	text-decoration: underline;
	transition: all 0.5s;
}
.linkStyle:hover{
	color:#bd895e;
	opacity: 0.7;
	text-decoration: none;
}

footer{
    background-image: url(./Dup/img/bg_1.jpg);
    background-size: cover;
    background-position: left top;
}

/* アニメーション下層ページ ----------------------------------*/
.in2{
    transform: translate(0px,50px);
	transition: transform 1.5s ease, opacity 1.5s ease-out, filter 1.5s ease-out;
	transition-property: opacity,transform,filter;
	opacity: 0;
	filter: blur(0px);
}
.in2.start2{transform: translate(0,0);opacity: 0.9;filter: blur(8px);}
/* タブレット */
@media screen and (max-width: 768px){
    header.pd_b-10px_tb{padding: 15px 0;}
    header .head_banner{width: 30%;left: auto;right: 20%;}
    header .head_banner.bnr_app{width: 30%;left: 20%;right: auto;}
    header .head_banner a{border-radius: 5px 5px 0 0;background-color: #bd895e;}
    header .head_banner.bnr_app a{background-color: #462f1c;}
    .main_box{padding-top: 68px;}
}
/* スマホ */
@media screen and (max-width: 667px){
    .main_box{padding-top: 47px;}
    .hamburger{top: 3px;}
    header.pd_b-10px_tb{padding: 10px 0;}
    header .head_banner{width: 50%;left: auto;right: 0%;font-size: 14px;}
    header .head_banner.bnr_app{width: 50%;left: 0%;right: auto;letter-spacing: 0em;}
    
    .more a{width: 250px;}
    
    footer{background-image: url(./Dup/img/bg_1_sp.jpg);}
}

/* 配色 ----------------------------------------------*/
body, .txt_color_nomal{font-family: "游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif";}
.txt_color1,.hvr_txt_color1:hover{color: #764822;} 
/*.txt_color2,.hvr_txt_color2:hover{color: #f4f3f2;} */
.txt_color3,.hvr_txt_color3:hover{color: #bd895e;} 
/*.txt_color4,.hvr_txt_color4:hover{color: #eae4df;} */
/*.txt_color5,.hvr_txt_color5:hover{color: #f2ede7;}*/ 

.bg_color1,.hvr_bg_color1:hover{background-color: #2e2218;}
/*.bg_color2,.hvr_bg_color2:hover{background-color: #f4f3f2;}*/
.bg_color3,.hvr_bg_color3:hover{background-color: #bd895e;} 
.bg_color4,.hvr_bg_color4:hover{background-color: #fff7ef;} 
/*.bg_color5,.hvr_bg_color5:hover{background-color: #f2ede7;}*/ 

/*.border_color1,.hvr_border_color1:hover{border-color: #ef8f41;}*/
/*.border_color2,.hvr_border_color2:hover{border-color: #f4f3f2;}*/
.border_color3,.hvr_border_color3:hover{border-color: #bd895e;}
/*.border_color4,.hvr_border_color4:hover{border-color: #eae4df;}*/
/*.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;}

/* news type4 -------------------------------*/
.topcms_news_type4 .cate_box{
	width: 30.33333%!important;
	margin-right: 1.5%;
	margin-left: 1.5%;
	border-radius: 15px;
	background-color: #fff;
	padding: 0;
	/*box-shadow: 10px 25px 30px rgb(0 0 0 / 8%);*/
}
.topcms_news_type4 .cate_box .box_img1{
    border-radius: 15px 15px 0 0;
}
.topcms_news_type4 .txt_height{
	height: 3em
}
.topcms_news_type4 .box_title1:empty{
	display: block!important;
}
/* タブレット */
@media screen and (max-width: 768px){
}
/* スマートフォン */
@media screen and (max-width: 667px){
.topcms_news_type4 .cate_box {
    width: 100%!important;
    margin-bottom: 15px;
}
}