.header {
/*     position: fixed;
z-index: 3; */
    top: 0;
    left: 0;
    transition: transform 0.3s ease, opacity 0.3s ease;
  }
  
.header_none {
    transform: translateY(-100%);
    opacity: 0;
  }

/* 1536 , 1530 × 735 ,1366 *//* 上記画面幅でも崩れていないか確認 */

/* 修正した場合→各項目の一番下に日付をコメントアウトして追記 */

/*■■　ALL　■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
body, .txt_color_nomal, .hvr_txt_color_nomal:hover {
    color: var(--color1);
}

:root{
    --color1: #408ce1;
    --color2: #e0f3fa;
    --color3: #0094d0;
    --color4: #ebfaff;
    --color5: #fff;
    --color6: #ffee00;
    --color7: #f7962e;
	/*--font-jp: 'Noto Sans JP', "游ゴシック Medium", sans-serif;*/
}

.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);}
/*.txt_color4, .hvr_txt_color4:hover{color: var(--color4);}*/
.txt_color6, .hvr_txt_color6:hover{color: var(--color6);}

/* background-color */
.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);}
.bg_color4, .hvr_bg_color4:hover{background-color: var(--color4);}
.bg_color5, .hvr_bg_color5:hover{background-color: var(--color5);}
.bg_color6, .hvr_bg_color6:hover{background-color: var(--color6);}
.bg_color7, .hvr_bg_color7:hover{background-color: var(--color7);}

/* border-color ※!important */
.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);}*/


/* ---------------------------　タブレット　-------------------------- */
@media screen and (max-width: 768px){

}

/* --------------------------　スマホ　-------------------------- */
@media screen and (max-width: 667px){

}



/*■■　FV　■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
#handwriting {
    width: 50%;
    height: auto;
    position: absolute;
    top: 10%;
    left: 6%;
}
#base path {
    fill:#fff; /* 塗りの色 */
}
#mask path {
    fill:none; /* 塗りの色 */
    stroke:#ffffff; /* 線の色 */
    stroke-width:10px; /* 線幅 */
    stroke-linecap:round; /* 線端の形状 */
    stroke-linejoin:round; /* 角の形状 */
}

#main_img {
    padding-top: 0;
}

.fv_txt02 {
    width: 30%;
    bottom: 0%;
    right: 0;
}

/* ---------------------------　タブレット　-------------------------- */
@media screen and (max-width: 768px){
    #handwriting_sp {
        width: 85%;
        height: auto;
        position: absolute;
        top: 7%;
        left: 6%;
    }
    
    #base01 path {
        fill:#fff; /* 塗りの色 */
    }
    #mask01 path {
        fill:none; /* 塗りの色 */
        stroke:#fff; /* 線の色 */
        stroke-width:10px; /* 線幅 */
        stroke-linecap:round; /* 線端の形状 */
        stroke-linejoin:round; /* 角の形状 */
    }
    
    #main_img {
        height: auto;
        max-height: none;
    }
    
    .fv_txt02 {
        width: 68%;
        bottom: 4%;
        right: -5%;
    }
}

/* --------------------------　スマホ　-------------------------- */
@media screen and (max-width: 667px){

}



/*■■　TOP　■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
#intro_bg {
    background-image: url('/Files/img/bg01.png');
    background-size: contain;
    background-repeat: repeat;
    background-position: top;
}

#top_cms {
    background-image: url('/Files/img/bg02.png');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top;
}

.txt_anim6 span{
	display: inline-block;
	-webkit-transform: translateY(20px);
	transform: translateY(20px);
	-webkit-animation: .35s cubic-bezier(.175,.885,.32,1.275) both;
	animation: .35s cubic-bezier(.175,.885,.32,1.275) both;
	opacity: 0;
}

.txt_anim6 span.start{
	-webkit-animation-name: slide-bs;
	animation-name: slide-bs;
	opacity: 1;
}

.custom_img01 {
        width: 21%;
    bottom: 31%;
    right: 2%;
    z-index: 2;
}

#contents .con_box .con_item1, #contents .con_box .con_item2 {
    width: 180px;
}

@keyframes slide-bs{
	0%{-webkit-transform: translateY(20px);transform: translateY(20px);}
	100%{-webkit-transform: translateY(0);transform: translateY(0);}
}

/* ---------------------------　タブレット　-------------------------- */
@media screen and (max-width: 768px){

}

/* --------------------------　スマホ　-------------------------- */
@media screen and (max-width: 667px){

}



/*■■　下層ページ　■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
#foot_banner a {
    background: var(--color7);
    color: #fff;
}

/* ---------------------------　タブレット　-------------------------- */
@media screen and (max-width: 768px){
    .custom_img01 {
    width: 41%;
    bottom: 30%;
    right: 2%;
    z-index: 2;
}
}

/* --------------------------　スマホ　-------------------------- */
@media screen and (max-width: 667px){

}