/*■■ 全体 ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
@import url('https://fonts.googleapis.com/css2?family=Zen+Old+Mincho&display=swap');
body {
    font-family:"Zen Old Mincho","游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif";
    
    line-height: 1.7;
    font-size: 18px;
}

.cms_wrap .border_color1 {
    border-color: #7d7d7d;
}

/*■■ header ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
@media screen and (max-width: 320px){
   #header {
       justify-content: flex-start;
   }
   
   #pc_nav ul li {
       margin-right: 0px;
       margin-left: 0px;
   }
}

/*■■ top ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
#intro .intro_back {
    bottom: -7px;
}

.fv_hand {
    bottom :-3%;
    height: 90%;
    width: auto;
    left: 45%;
    transform: translateX(-50%);
    z-index: 3;
}

.fv_hand img {
    width: auto;
    height: 100%;
}

.copy_1 {
    right: 14%;
    top: 50%;
    transform: translateY(-50%);
    width: 20%;
    z-index: 5;
}

.copy_1 img{
    width: 100%;
    height: auto;
}

.copy_3 {
    left: 9.8%;
    top: 15%;
    width: 17%;
    z-index: 5;
    max-width: 320px;
}

.copy_3 img{
    width: 100%;
    height: auto;
}

#contents2 .con2_img1,#contents3 .con3_img1 {
    filter: grayscale(1);
}

#top_cms .cms_box .page_title_txt {
    padding-bottom: 10px;
}



/* タブレット */
@media screen and (max-width: 768px){
    body {
        font-size: 20px;
    }
    
    #main_img {
        height: 80vh !important;
    }
    
    .copy_1 {
        left: 50%;
        top: 55%;
        height: 37%;
        right: auto;
        width: auto;
        transform: translate(-50%, -50%);
    }
    
    .copy_1 img {
        width: auto;
        height: 100%;
    }
    
    .copy_3 {
        left: 6%;
        top: 6%;
        width: 38%;
    }
    
    #top_cms .cms_sub_title {
        top: 40px;
    }
    
    #top_cms .cms_box .page_title_txt {
        padding-top: 100px;
    }
    
    #intro .intro_wrap, #contents2 .con2_box, #contents3 .con3_box {
        padding: 140px 50px 80px 50px;
    }
    
/*ハンバーガーメニュー*/
    #sp_nav ul, #sp_nav a {
        font-size: 21px;
    }
}
/* スマホ */
@media screen and (max-width: 667px){
    body {
        font-size: 16px;
    }
    
    #main_img {
        height: 80vh!important;
    }
    
    #main_img .box_img {
        background-position: top left 45%;
    }
    
    .copy_1 {
        height: 34%;
    }
    
    .copy_3 {
        width: 51%;
    }
    
    #top_cms .cms_sub_title {
        top: 60px;
    }
    
    #intro .intro_wrap {
        padding: 120px 20px 20px 20px;
    }
    
    #intro .intro_back {
        font-size: -webkit-calc(1rem + 30px);
        font-size: calc(1rem + 30px);
    }
    
    .con1_box {
        padding-bottom: 70px;
        padding-top: 70px;
    }
    
    #contents2 .con2_box, #contents3 .con3_box {
        padding: 50px 20px 50px 20px;
    }
    
    .top_cms_wrap .cms_2-c .box_item {
        border: 1px solid var(--color3);
        padding: 5%;
    }
    
    /*ハンバーガーメニュー*/
    #sp_nav ul, #sp_nav a {
        font-size: 15px;
    }
}

@media screen and (max-width: 320px){
    #top_cms .cms_sub_title {
        letter-spacing: 1px;
    }
}
/*■■ cms ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
#page_title {
    background-image: url(/Files/img/page_title.jpg)!important;
    filter: grayscale(1);
}

.cms_2-c .box_wrap:nth-of-type(7) {
        margin-top: 6%;
    }

.v_type3 .cate_box{border: 1px solid var(--color3);}
.v_type3 .box_title1{color: #8f8e8e;}

#page03 .cms_wrap .bg_color1 {
    background-color: var(--color3);
}

#page03 .cms_wrap .border_color1 {
    border-color: var(--color3);
}

#page03 #cms_3-b .cate_txt1 {
    font-size: 18px;
}


/* タブレット */
@media screen and (max-width: 768px){}
/* スマホ */
@media screen and (max-width: 667px){
    section[id^="page"] {
        padding: 40px 20px;
    }
    
    .v_type3 .cate_title{
        letter-spacing: -0.05em;
    }
    
    
    #cms_7-a .box_title1 {
        color: #bfa057;
    }

}


/*■■ footer ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/

#foot_banner {
	bottom: 10px;
	right: 40px;
	z-index: 5;
	width: 400px;
}


/* タブレット */
@media screen and (max-width: 768px){
    .footer_wrap {
        padding-bottom: 30px;
    }
}
/* スマホ */
@media screen and (max-width: 667px){
    .footer_wrap {
        padding-bottom: 20px;
    }
    
    #foot_banner{
	    width: 250px;
        left: 0;
        right: 0;
        margin: auto;
	}
}