img {
    display: block;
    max-width: 100%;
    height: auto;
}

.header_logo {
    height: 45px;
    background-color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
}

.header_logo .site {
    width: clamp(200px, 23vw, 350px);
  }

.hero {
    background-color: #b81c22;
} 

.lead {
    text-align: center;
    font-weight: 500;
}

.img_container {
    width: min(100%,850px); 
    margin: 0 auto;
}

.item_container {
    width: min(92%,1060px); 
    margin: 0 auto;
}   

.text_container {
    width: min(92%,750px);
    padding: clamp(20px, 3vw, 35px) 0;
    
    margin: 0 auto;
}
    
.text_container img {
    margin: 15px auto;
}

.otherback {
    background-color: #e3f5f8;
}

.otherback2 {
    background-color: #f8f6da;
}

.otherback3  {
    background: linear-gradient(to right, #dbbc53, #f8e9ad);
}

.w_container {
    margin: 0 auto 15px;
    width: min(92%, 800px);
}

.h_container {
    padding: clamp(25px, 3vw, 35px) 0;
}

.btn_order a {
    margin-top: 10px;
    display: block;
    padding: 5px;
    background-color: #b81c22;
    color: #ffffff;
    font-weight: 700;
    text-align: center;
}

.midashi {
    display: block;
    width: min(90%, 700px);
    margin: 30px auto;
    padding: 10px;
    text-align: center;
    background-color: #f4efe8; 
    font-weight: 700;
}

/*PC椹嶏降锟斤胶锟斤浇锟斤涧楂蕉楂剑锟斤浇锟斤姜楂ｅ寘锝斤匠锟斤浇锟斤溅椹嶏降锟斤胶锟斤浇锟斤匠锟斤浇锟斤浇锟斤浇锟斤浇1锟斤浇锟斤浇锟斤浇锟斤浇2锟斤浇锟斤浇闄峰婊勩仐锟斤胶锟斤浇锟斤涧楝╂惥锝斤降锟斤浇锟斤溅楂ｅ寘锝斤匠锟斤浇锟斤溅椹嶏降锟斤胶锟斤浇锟斤匠*/
.imgtext_container {
    margin: auto;
    width: min(94%, 950px);
    background-color: #ffffff;
    display: flex;
    flex-direction: column-reverse;
    gap: clamp(25px, 3vw, 35px);
    padding: 30px 20px;
    margin-bottom: 20px;
    border-radius: 20px;
}

@media (min-width: 768px) {
    .imgtext_container {
    flex-direction: row;
    align-items: center;
    }

 /*楂櫌锝斤骄锟斤浇锟斤溅楂椒锟斤娇锟斤浇锟斤匠楝建锟斤骄锟斤浇锟斤浇锟斤浇锟斤郊锟斤浇锟斤浇2锟斤浇锟斤浇锟斤浇锟斤浇1锟斤浇锟斤浇锟斤浇锟斤浇*/
    .imgtext_container.reverse {
     flex-direction: row-reverse;
    }
 
    .imgtext_container > .text {
     flex: 1;
     min-width: 17em;
    }
 
    .imgtext_container > .imgtext_img {
     flex: 1;
    }
}

/*PC椹嶏降锟斤胶锟斤浇锟斤涧楂蕉楂剑锟斤浇锟斤姜楂ｅ寘锝斤匠锟斤浇锟斤溅椹嶏降锟斤胶锟斤浇锟斤匠锟斤浇锟斤浇锟斤浇锟斤浇1锟斤浇锟斤浇锟斤浇锟斤浇1锟斤浇锟斤浇闄峰婊勩仐锟斤胶锟斤浇锟斤涧楝╂惥锝斤降锟斤浇锟斤溅楂ｅ寘锝斤匠锟斤浇锟斤溅椹嶏降锟斤胶锟斤浇锟斤匠*/

.two_container {
    width: min(92%,1060px);
    margin: 10px auto 20px;
    display: grid;
    gap: clamp(15px, 2vw, 25px);     
}

@media (min-width: 768px) {
    .two_container {
    grid-template-columns: 1fr 1fr;
    align-items: center;
    }
}

/*PC椹嶏降锟斤胶锟斤浇锟斤涧3楂蕉楂剑锟斤浇锟斤姜楂ｅ寘锝斤匠锟斤浇锟斤溅椹嶏降锟斤胶锟斤浇锟斤匠SP椹嶏降锟斤胶锟斤浇锟斤涧2楝╂惥锝斤降锟斤浇锟斤溅楂ｅ寘锝斤匠锟斤浇锟斤溅椹嶏降锟斤胶锟斤浇锟斤匠*/

.three_container {
    width: min(92%,950px);
    margin: 20px auto;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: clamp(15px, 2vw, 25px);
}

@media (min-width: 768px) {
    .three_container {
    grid-template-columns: repeat(3, 1fr);
    align-items: center;
    }
}

.page_menu {
    position: fixed;
    top: 85%;
    right: 3%;
    width: 25%;
  }

@media (min-width: 768px) {
    .page_menu {
        top: 70%;
        right: 10%;
        width: 10%;
    } 
}
  
.copy_ {
    background-color: #000;
    
    padding: 5px;
    color: #fff;
    text-align: center;
}

.fadeUp {
    animation-name: fadeUpAnime;
    animation-duration: 1s;
    animation-fill-mode: forwards;  
}

@keyframes fadeUpAnime {
    from {
        opacity: 0;
        transform: translateY(100px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.fadeUpTrigger {
    opacity: 0;
}