@media screen and (max-width: 960px) {
  .pcView {
    display: none !important; 
  } 
}

@media screen and (min-width: 961px) {
  .spView {
    display: none !important; 
  } 
}

/* ###########################
20260415 feature 
############################### */
#hero .hero--catch{
    display: flex;
    flex-direction: column;
}
#home_feature {
    background: url("../images/add/feature_bg.jpg");
}
#home_feature .deco{
    color: #8E9496;
}
#home_feature .boxs{
    display: flex;
    justify-content: center;
    gap : 2px;
}
#home_feature .box{
    padding: 40px 0;
    background: #fff;
    width: calc(530/1600*100%);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    font-weight: normal;
}
#home_feature .box span{
    color: #A59984;
}

@media screen and (max-width: 960px) {
#home_feature .boxs{
    flex-direction: column;
}
#home_feature .box{
    width: 100%;
}
}



/* ###########################
20260415 home_bnr
############################### */
#home_bnr {
    background: #fff;
    padding-bottom: 6rem;
}
#home_bnr .bg{
    background:#C0C0C0;
}
#home_bnr .box{
    width: 96%;
}
#home_bnr .pic{
    width: 50%;
}
#home_bnr .sttlBox{
    background: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 50%;
}
#home_bnr .txt{
    color: #8E9496;
}
#home_bnr a{
  position: relative;
  display: inline-block;
  overflow: hidden;
  background: #A59984;
  padding: 1rem 2rem;
  color: #fff;
  font-size: 12px;
  z-index: 1;
}

/* 黒レイヤー */
#home_bnr a::before{
  content: "";
  position: absolute;
  inset: 0;
  background: #1b1b1b;
  transform: translateX(-105%);
  z-index: -1;
}

/* hover：左から入る */
#home_bnr a:hover::before{
  animation: slideIn .4s forwards;
}

/* hover外れた瞬間：右に抜ける */
#home_bnr a:not(:hover)::before{
  animation: slideOut .4s forwards;
}

/* 左→中央 */
@keyframes slideIn{
  from { transform: translateX(-105%); }
  to   { transform: translateX(0); }
}

/* 中央→右 */
@keyframes slideOut{
  from { transform: translateX(0); }
  to   { transform: translateX(105%); }
}


@media screen and (max-width: 960px) {
#home_bnr {
    padding-bottom: 40px;
}
#home_bnr .box{
    flex-direction: column;
    width: 90%;
}
#home_bnr .pic,
#home_bnr .sttlBox{
    width: 100%;
}
#home_bnr .sttlBox{
    padding: 2rem 0;
}
#home_bnr .head5 {
    font-size: 100%;
}
#home_bnr a{
  padding: 0.5rem 1rem;
}
}


/* ###########################
20260415 home_faq
############################### */
#home_faq {
    padding-bottom: 8rem;
}
#home_faq .faq li{
    padding: 4rem 0;
    border-top: 1px solid #FFFFFF;
}
#home_faq .faq li:last-child{
    border-bottom: 1px solid #FFFFFF;
}
#home_faq .faqBox{
    display: flex;
}
#home_faq .faqBox.q{
    margin-bottom: 2rem;
    
}
#home_faq .faqBox.q .en{
    color: #A59984;
}
#home_faq .faqBox .txt a{
    text-decoration: underline;
    color: #A59984;
}
#home_faq .faqBox .txt{
    margin-top: calc((1.8em - 1em) / 2);
    margin-left: 2rem;
}

@media screen and (max-width: 960px) {
#home_faq {
    padding-bottom: 4rem;
}
#home_faq .faq li{
    padding: 2rem 0;
}
#home_faq .faqBox.q{
    margin-bottom: 1rem;
}
#home_faq .faqBox .txt{
    margin-top: calc((1.4em - 1em) / 2);
    margin-left: 1rem;
}
}



/* ###########################
20260415 home_area
############################### */
#home_area{
    background: #fff;
}
#home_area .box{
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: -10rem;
}
#home_area .txt{
    width: calc(785/1351*100%);
}
#home_area img{
    width: calc(566/1351*100%);
    height: auto;
}
#home_area iframe{
  display: block;
    width: 100%;
    height: 40vh;
  filter: grayscale(100%);
}
@media screen and (max-width: 960px) {
#home_area .box{
    flex-direction: column;
    margin-top: 0 ;
}
#home_area .txt{
    width: 100%;
        position: relative;
        z-index: 1;
}
#home_area img{
    width: 100%;
    height: auto;
    margin-top: -16rem;
    z-index: 0;
    opacity: 0.7;
}
#home_area iframe{
  display: block;
    width: 100%;
    height: 40vh;
  filter: grayscale(100%);
} 
}