@charset "utf-8";

.flex{ display: flex; justify-content: space-between; flex-wrap: wrap;}


.contents{  padding: 130px 0 300px ; background: #f5f5f5;}
.container{ max-width: 960px;}

.titBox{ padding-bottom: 30px;}

h2{ font-size: 5rem; font-weight: bold; max-width: 1200px; width: calc(100% - 50px); line-height: 1.5; margin:0 auto;}
h2 span{ display: block; font-size: clamp(16px,1.5vw,1.8rem); }

.mv { position: relative; max-width: 960px; margin: 0 auto;}

.box figure{ text-align: center;}

.intro{ margin: 5rem 0; color: #567318;}
.intro .txt{ margin: 0 auto; font-size: 1.8rem; font-weight: bold;}
.txtBox{ margin-bottom: 5rem;}
.txtBox .subtit{ font-weight: bold; font-size: 1.8rem; margin-bottom: 2rem;}
.plate{ margin-bottom: 2rem; text-align: center;}



@media (max-width: 1400px){
    .contents{ padding: 100px 0 50px;}
    h2{ font-size: 4.5rem;}
}

@media (max-width: 768px){

    h2{ font-size: clamp( 2rem , 6.5vw, 5rem);}

    .contents{ padding: 70px 0 50px;}
}