@charset "utf-8";
/* 1536 , 1530 × 735 ,1366 *//* ←記画面幅でも崩れていないか確認 */

/* カテゴリリンクの飛び先位置の数値を適宜調整してください */

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

@import url('https://fonts.googleapis.com/css2?family=Shippori+Mincho&display=swap');

.flow_type3 .cate{counter-reset: box;}
.flow_type3 .cate_box{counter-increment: box;}
.flow_type3 .box_item{padding-top: 60px;}
.flow_type3 .box_title1{z-index: 0}
.flow_type3 .box_title1::before, .flow_type3 .box_title1::after{
	position: absolute;
	content: "";
	display: block;
	pointer-events: none
}
.flow_type3 .box_title1::before {
	content: "0"counter(box);
	font-size: 86px;
	color: #ebebeb;
	left: 0;
	top: -70px;
	z-index: -1;
}
.flow_type3 .box_title1::after{
	width: 100%;
	height: 1px;
	bottom: 0;
	left: 0;
	background-color: #222
}

#main_img{
    display: block;
}

#main_img_sp{
    display: none;
    width: 100%;
}

#foot_banner a {
padding: 0px;
}
#page-top {
    position: fixed;
    right: 20px;
    z-index: 99;
}

#foot_banner {
    z-index: 99;
    width: 280px;
    right: 105px;
    bottom: 10px;
}


/*-------- スマートフォン --------*/
@media screen and (max-width: 667px){
.flow_type3 .box_title1::before{
	left: auto;
	right: 0;
	top: -50px
}
.flow_type3 .box_item {
    padding-top: 36px;
}
}

#logo .logo img {
    width: 37% !important;
}

#intro {
padding-bottom: 0px;
}


#info_title_box {
    padding-top: 150px;
    padding-bottom: 0;
    position: relative;
    z-index: -2;
}

#nav{
    border-radius: 0% 0% 30px 30px;
        background-color: rgba(242, 237, 231, 1);
}


#contents .con_box .con_item1, #contents .con_box .con_item2 {
    width: 172px;}
    
.link_type1 .link_top .link_title {
    font-size: 20px;
    margin-bottom: 20px;
    text-align: center;
    padding-top: 50px!important;
    margin-bottom: 30px;
    color: #474521;
    font-weight: normal;
    background-image: url("../img/Item7.png");
    background-size: 80px;
    background-position: top center;
    background-repeat: no-repeat;
}
.link_type1 .link_top .link_title{
    font-size: 20px;
    margin-bottom: 20px;
}
.link_type1 .link_top a{
	padding-top: 40px;
	padding-bottom: 40px;
}
.link_type1 .link_top a:hover{
    background-color: #ededeb;
}
.link_type1 .link_top a:hover .link_img1{
    transform: translate(-50%, -50%) scale(1.1,1.1);
    opacity: 0.1;
}
@media screen and (max-width: 667px){
.link_type1 .link_top .link_title{
    font-size: 15px;
}
}

.spinner4 {
/*     background-image: url("/Files/img/LOGO.png")!important;
background-size: cover;
background-color: #ffd8b8;
    width:7%;
    height: 7%; */
display: none;
    
}

#fakeloader{
    background-image:url("/Files/img/loading.png")!important;
    background-position:center ;
    background-size: cover;
}

#cost{
    width:37%!important;
        margin: 0 auto;
}
#cost_txt{
    width: 80%!important;
}

.cms_2-f .box_img1 img {
    position: absolute;
    width: 32%;
    height: auto;
    top: 50%;
    object-fit: cover;
    left: 33%;
    transform: translate(0, -50%)
}



/* 
\\\\\\\\\ */

.catch_copy{
    display: flex;
    flex-direction: column;
    position: absolute;
    left: 50%;
    top: 56.3%;
    z-index: 3;
    align-items: center ;
        transform: translateX(-50%);
    z-index:3;
}

.fv-title {
    transform: translate(100%);
    animation: titleSlideUp 0.95s cubic-bezier(.22, 1, .36, 1) 2.5s forwards;
opacity: 0;
}

.fv-subtitle{
transform: translate(100%);
opacity: 0;
  animation: titleSlideUp 0.95s cubic-bezier(.22, 1, .36, 1) 2.5s forwards;
 
}
@keyframes titleSlideUp {
  from {
    opacity: 0;
    transform: translateY(100%);
  }
  to {
    opacity: 1;
transform: translateY(0%);
  }
}


/* 左右都做裁切，方便上滑动画 */
.title-mask {
  overflow: hidden;
  display: block;
}

#info_title_box {
    padding-top: 150px;
    padding-bottom: 150px;
    position: relative;
    z-index: -2;
    font-family: 'BioRhyme', 'Noto Sans JP', "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif !important;
    color:white!important;
}

.contact_title{
    font-size: 2.2rem;
}


#filter_white{
    
        background-color: rgba(255, 255, 255, 0.7)!important;
}

.flow_type3 .box_title1::before {
    content: "0" counter(box);
    font-size: 86px;
    color: #c7c7c7;
    left: 0;
    top: -70px;
    z-index: -1;
}
#main_img {
    height: auto;
    max-height: 100vh;
padding-top: 0px;
    position: relative;
}

#page_title #filter_white{
    background-color: rgb(239 143 65 / 34%) !important;
    color:white;
}

 #filter_white .txt_color_nomal{
     color:white;
 }


/* ---------------------------　タブレット　-------------------------- */
@media screen and (max-width: 768px){
    
    
    #main_img {
    padding-top: 20%;
}
    
    .catch_copy {
        top: 70.3%;
    }
.fv-title {
    width: 80%;}
    
.fv-subtitle {
    width: 50%;
}

.spinner4 {
    background-image: url("/Files/img/LOGO.png")!important;
    background-size: contain;
    background-repeat: no-repeat;
    background-color: #ffd8b8;
        width:7%;
        height:7%;
}

.kanji-big {
    font-size: 4.3rem;
}
.title-row1 {
    font-size: 1.2rem;}

.title-row2 {
    font-size: 3.2rem;}

#logo .logo{
    text-align: center;
}


.contact_title {
    font-size: 1.8rem;
}

} 

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


#main_img{
    display:none;
}

#main_img_sp{
    display:block ;
    width: 100%;
}

.title-mask {
  overflow: hidden;
  display: block;
}


.title-row1,
.title-row2 {
  margin: 0;
  white-space: nowrap;
}

    .title-row1 {
        font-size: 1rem;
        line-height: 1;
        letter-spacing: 0.01em;
    }

.title-row2 {
  font-size: 3rem;
  line-height: 0.92;
  letter-spacing: 0;
}

.drawer-menu li {
    margin-bottom: 20px;
}

.drawer-menu{
    padding-top:25% ;
}

    #intro_sp {
        height: 200px;
        
    }
        
.spinner4 {
    width: 20%;
    height: 20%;
}        
        
        
.contact_sp{
            font-size:0.8rem;
        }
        
        
.txt_left{
    text-align: left;
}


    #logo .logo {
        width: 150px;
        margin-left: -15px;
    }

.cms_title_sp{
    font-size: 1.5rem;
}
        
        
    #page_title h2 span {
        font-size: 25px;
    }
    
    
.contact_title {
    font-size: 0.9rem;
}    

    .catch_copy {
        top: 5%;
        width: 80%;
    }
    
    
    #cost {
    width: 100% !important;
    margin: 0 auto;
}
        }
        
        
        
        /*■■　FV　■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■




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

}

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

}



/*■■　TOP　■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/




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

}

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

}



/*■■　下層ページ　■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
/*カテゴリリンクの飛び先位置を調整する*/
/* --- PC --- */
:root {
--header-height: 170px;
}
/* --- スマートフォン --- */
@media screen and (max-width: 667px){
:root {
--header-height: 100px;
}
}





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

}

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

}