@charset "utf-8";
.headline {
	display: flex;
	justify-content: flex-end;
	position: relative;
	z-index: 2;
	color: #3f4845;
	top: 0;
	width: 100vw;
    padding: clamp(60px, 10.7143vw, 180px) clamp(60px, 12.7976vw, 215px) clamp(60px, 10.7143vw, 180px) 15px;
}
.headline::before {
    content: "";
    background: url(../imgs/leaf_icon01.png) no-repeat top right / contain;
    width: 32%;
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
}
.headline .ttl {
	font-size: clamp(4.5rem,5.0595vw,8.5rem);
	letter-spacing: 0.015em;
	line-height: 1;
}
.headline .txt {
	font-size: clamp(1.4rem,1.3095238095238095238vw,2.2rem);
	letter-spacing: 0.08em;
	line-height: 1.7;
	margin-bottom: clamp(5px,0.8929vw,15px);
}
@media screen and (max-width: 767px) {
    .headline {
        justify-content: center;
        padding: 60px 15px;
    }
    .headline::before { width: 60%;}
}
.head_cont { position: relative; }
.head_cont .ttl {
    color: rgba(63, 72, 69, 0.8);
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 15px;
    font-size: clamp(3.5rem, 4.166666vw, 7rem);
    letter-spacing: 0.01em;
    line-height: 1;
    position: relative;
    z-index: 1;
    margin-left: -4.6vw;
}
.head_cont .ttl::after {
    content: "";
    flex: 1;
    height: 1px;
    background-color: #787e7c;
    position: relative;
    bottom: 5px;
}
.head_cont .icon {
    position: absolute;
    left: -19%;
    top: -37px;
    width: clamp(160px, 21.428571428571428571vw, 360px);
}
.head_cont .txt {
    font-size: clamp(1.4rem, 1.6rem, 1.6rem);
    line-height: 2.0;
    margin-left: 14%;
    margin-top: 30px;
    position: relative;
    z-index: 1;
}
.head_cont .ttl_sub {
    font-size: clamp(1.8rem, 1.3095vw, 2.2rem);
    line-height: 1.6;
    margin-left: 14%;
    margin-top: 30px;
    position: relative;
    z-index: 1;
}
.head_cont .ttl_sub + .txt { margin-top: clamp(10px, 1.1905vw, 20px);}
.head_cont .ttl_sub + .ttl_sub { margin-top: clamp(20px, 3.5714vw, 60px);}
.head_cont .ttl_sub .lg {
    font-size: 146%;
    display: inline-block;
}
@media screen and (max-width: 1366px) {
    .head_cont .ttl { margin-left: 0;}
}
@media screen and (max-width: 1024px) {
    .head_cont .icon { left: -15px;}
    .mb30SP { margin-bottom: 30px;}
}
@media screen and (max-width: 767px) {
    .head_cont .txt { 
        font-size: 1.4rem; 
        margin-left: 0;
        letter-spacing: 0.01em;
    }
    .head_cont .ttl_sub {
        font-size: 1.6rem;
        margin-left: 0;
    }
}
.notes {
    font-size: 1rem;
    letter-spacing: 0.06em;
    line-height: 1.6;
}
.ttl_cap {
    font-size: clamp(1.2rem, 0.8333vw, 1.4rem);
    margin-bottom: 10px;
}
.mt160 { margin-top: clamp(60px, 9.5238vw, 160px);}
/* sec_intro */
.sec_intro {
    padding: clamp(40px, 7.14285714vw, 120px) 0 clamp(60px, 9.2262vw, 155px);
}
.intro_ttl {
    font-size: clamp(1.8rem, 1.3095vw, 2.2rem);
    line-height: 2;
    letter-spacing: 0.1em;
    text-align: center;
    margin-bottom: clamp(30px, 6.8452vw, 115px);
}
.intro_txt {
    font-size: clamp(1.2rem, 0.8333vw , 1.4rem);
    line-height: 2.4;
    letter-spacing: 0.1em;
    text-align: center;
}
.intro_img {
    max-width: 1028px;
    margin: 0 auto calc(clamp(0px, 0.8929vw, 15px)*-1);
}
.intro_img .cap_list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    text-align: center;
    max-width: 87%;
    margin: auto;
    position: absolute;
    bottom: 18%;
    left: 0;
    right: 0;
}
.intro_img .cap_list .pic_cap {
    position: static;
    color: #b3b3b3!important;
    letter-spacing: 0;
}
@media screen and (max-width: 767px) {
    .intro_ttl { letter-spacing: 0.05em;}
    .intro_txt { letter-spacing: 0.01em;}
    .intro_img {
        width: calc(100% + 30px);
        left: -15px;
    }
}
/* sec_zoning */
.sec_zoning { padding: 0 0 clamp(60px, 8.9286vw, 150px);}
.position_img {
    max-width: 970px;
    margin: auto;
}
.position_map {
    position: relative;
    margin-bottom: 10.5%;
    display: grid;
    grid-template-columns: 79.5% auto;
    align-items: flex-end;
}
.position_map .img_note { margin: 0 0 -26% -40%;}
.geology_img {
    max-width: 700px;
    margin: auto;
}
@media screen and (max-width: 767px) {
    .position_map {
        grid-template-columns: 100% auto;
        margin-bottom: 200px;
    }
    .position_map .img_note { margin: 0 0 -200px -200px;}
}
/* sec_protential */
.sec_protential {
    background-color: #bbc5bc;
    padding: 0 0 clamp(60px, 8.631vw, 145px);
}
.protential_block {
    max-width: 1070px;
    margin: auto;
}
.protential_block .txt {
    font-size: clamp(1.3rem, 0.9524vw, 1.6rem);
    line-height: 1.75;
}
.protential_list {
    display: grid;
    grid-template-columns: 44% 1fr;
    gap: 30px;
}
@media screen and (max-width: 767px) {
    .protential_list { grid-template-columns: 1fr;}
}
/* sec_ranking */
.sec_ranking { padding: 0 0 clamp(60px, 9.5238vw, 160px);}
.ranking_list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: clamp(20px, 2.0833vw, 35px);
    max-width: 970px;
    margin: auto;
}
.ranking_list .no_icon { margin-top: 6%;}
@media screen and (max-width: 767px) {
    .ranking_list { grid-template-columns: 1fr;}
}