@charset "utf-8";

#merit {
background-color: #fff;

font-family: 'Noto Serif JP', serif;
font-weight: 400;
letter-spacing: 0.06em;
}

.text01 {
font-size: min(calc(18 / 1024 * 100vw),18px);
letter-spacing: 0.06em;
line-height: calc(36 / 18);
text-align: center;
}
@media screen and (max-width:768px) {
.text01 {
font-size:calc(13 / 380 * 100vw);
}
}

.mv {
position: relative;
z-index: 0;

}

.mv .mv_ttl {
position: absolute;
z-index: 1;
top:calc(144 / 1920 * 100vw);
left:calc(210 / 1920 * 100vw);

font-weight: 400;
font-size:calc(35 / 1920 * 100vw);
letter-spacing: 0;
line-height: calc(70 / 35);
color: #fff;
}

.mv .mv_img {
position: relative;
z-index: 0;

}
.mv .mv_img::after {
content: "";
display: block;
position: absolute;
z-index:0;
background-color: #000;
top: 0;
left: 0;
width: 100%;
height:100%;
opacity: .3;
}
@media screen and (max-width:768px) {

.mv .mv_ttl {
top:calc(150 / 380 * 100vw);
left:calc(20 / 380 * 100vw);
font-size:calc(16 / 380 * 100vw);
line-height: calc(32 / 16);
    text-shadow: 0 1px 1px rgba(0, 0, 0,.4);
  }
}

.attintion {
padding:min(calc(120 / 1024 * 100vw),120px) 0;
}

.attintion p {
font-weight: normal;
font-size: min(calc(24 / 1024 * 100vw),24px);
letter-spacing: 0.06em;
line-height: calc(48 / 24);
color: #333;
text-align: center;
}
@media screen and (max-width:768px) {
.attintion {
padding:calc(56 / 380 * 100vw) 0;
}

.attintion p {
font-size: calc(14 / 380 * 100vw);

}
}

.merit_base {
padding: min(calc(136 / 1024 * 100vw),136px) 0;
}

.merit01,.merit03 {
background-color: #f0f0eb;
}
.merit04 {
padding-bottom:0;
}


.merit_base .inner{
margin:0 auto;
width:1260px;
max-width: 85%;

}

.merit_base .ttl_merit {
font-weight: 400;
font-size:min(calc(32 / 1024 * 100vw),32px);
letter-spacing: 0.06em;
line-height: calc(36 / 32);
text-align: center;
margin-bottom:min(calc(32 / 1024 * 100vw),32px);

}
.merit_base .ttl_merit .size_l{
display: block;
color:#b48000;
font-weight: normal;
font-size: min(calc(80 / 1024 * 100vw), 80px);
letter-spacing: 0;
line-height: calc(97 / 80);
margin-bottom:min(calc(44 / 1024 * 100vw), 44px);

}

.merit_base .btn00 {
position: relative;
z-index: 0;

margin:0 auto;
width:min(calc(340 / 1024 * 100vw), 340px);
aspect-ratio: 340 / 58;
background-color: #9b7d46;
color:#fff;
font-size: min(calc(21 / 1024 * 100vw), 21px);
letter-spacing: 0.06em;
line-height: calc(21 / 21);
text-align: center;
display: flex;
justify-content: center;
align-items: center;

}
.merit_base .btn00::after {
content: "";
display: block;
position: absolute;
z-index:0;
border:solid #fff;
border-width: 0 1px 1px 0;

top: 50%;
right: min(calc(20 / 1024 * 100vw), 20px);
transform: translate(0,-50%) rotate(-45deg);
width: min(calc(8 / 1024 * 100vw), 8px);
aspect-ratio: 1;

}
.merit_base .btn00.adjust01 {
background-color: #2c4e2a;

}
.merit_base .btn00.adjust02 {
background-color: #000066;

}


.merit_base .block_slide {
margin:min(calc(64 / 1024 * 100vw), 64px) 0 min(calc(64 / 1024 * 100vw), 64px);
}
.merit_base .block_slide ul {
list-style: none;
}


.merit_base .block_slide {
position: relative;
z-index: 0;
}

.merit_base .block_slide .slide-arrow {
position: absolute;
z-index: 1;
width:min(calc(70 / 1024 * 100vw), 70px);
aspect-ratio: 1;
background-color: rgba(75 70 65 / .8);
top:50%;
transform: translateY(-50%);
display: flex;
justify-content: center;
align-items: center;
}

.merit_base .block_slide .slide-arrow::after {
content: "";
display: block;
z-index:0;
background-image: url("../../img/pages/merite/arrow.svg");
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
width:42.86%;
aspect-ratio: 300 / 76;
}
.merit_base .block_slide .slide-arrow.prev-arrow {
left:0;

}
.merit_base .block_slide .slide-arrow.next-arrow {
right:0;
}
.merit_base .block_slide .slide-arrow.next-arrow::after {
transform: scale(-1, 1);
}


.merit_base .block_slide .slick-dots {
 position: static;
    margin-tio:8px;
}


.merit_base .block_slide .slick-dots li button {
background-color: rgba(75 70 65 / .6);
}
.merit_base .block_slide .slick-dots li.slick-active button,
.merit_base .block_slide .slick-dots li button:hover {
background: #b48000;
}



@media screen and (max-width:768px) {
.merit_base {
padding: min(calc(136 / 1024 * 100vw),136px) 0;
}
.merit04 {
padding-bottom:0;
}

.merit_base .ttl_merit {
font-size:calc(19/ 380 * 100vw);
margin-bottom:calc(20/ 380 * 100vw);

}
.merit_base .ttl_merit .size_l{
font-size: calc(32/ 380 * 100vw);
margin-bottom:calc(32 / 380 * 100vw);

}

.merit_base .btn00 {

width:calc(320 / 380 * 100vw);
aspect-ratio: 320 / 48;
font-size:calc(15 / 380 * 100vw);
}
.merit_base .btn00::after {
right:calc(20 / 380 * 100vw);
width: calc(7 / 380 * 100vw);
}

.merit_base .block_slide {
    width:100vw;
margin:calc(32 / 380 * 100vw) calc(50% - 50vw) calc(32 / 380 * 100vw);
}


.merit_base .block_slide .slide-arrow {
position: absolute;
z-index: 1;
width:calc(44 / 380 * 100vw);
}


}






.merit04 .block_system {
background-color: #f0f0eb;
margin:min(calc(64 / 1024 * 100vw), 64px) 0;
max-width:780px;
margin:min(calc(56 / 1024 * 100vw), 56px) auto min(calc(56 / 1024 * 100vw), 56px);

}

.merit04 .block_system .ttl_system {
background-color: #8a7f71;
    font-weight: 400;
font-size: min(calc(24 / 1024 * 100vw), 24px);
letter-spacing: 0.06em;
line-height: calc(36 / 24);
color: #fff;
text-align: center;
padding:.5em;
}
.merit04 .block_system .system_inner{

padding:min(calc(32 / 1024 * 100vw), 32px) min(calc(30 / 1024 * 100vw), 40px);
}


.merit04 .block_system .ttl_system02 {
font-weight: 400;
font-size: min(calc(22 / 1024 * 100vw), 22px);
letter-spacing: 0.06em;
line-height: calc(60 / 22);
color: #333333;
text-align: center;
width:fit-content;
margin:0 auto min(calc(32 / 1024 * 100vw), 32px);
}
.merit04 .block_system .ttl_system02 span{
display: block;
border-bottom:1px solid #8a7f71;
}

.merit04 .block_system .text01 {
color: #b40000;
border:1px solid #b40000;
background-color: #fff;
margin-bottom:min(calc(16 / 1024 * 100vw), 16px);
letter-spacing: 0;
padding:.5em;
    font-size: min(calc(17 / 1024 * 100vw),17px);
}

.merit04 .block_system .cap {
font-size: min(calc(12 / 1024 * 100vw), 12px);
line-height: 2;
}
.merit04 .block_system .cap a{
border-bottom:1px solid #333;
}

.merit04 .block_btn {
display: flex;
justify-content: center;
gap:min(calc(50 / 1024 * 100vw), 50px);
}

.merit04 .block_btn .btn00 {
margin:0;
}


.link_text {
    display: block;
  width: fit-content;
  margin: 0 auto 1.0em;
  line-height: 1;
  font-size: .7em;
  background-color: #8a7f71;
  padding: 0.5em 1em .7em;
  color: #fff;
  border-radius: 999px;
}



@media screen and (max-width:768px) {


.merit04 .block_system {
margin:calc(40 / 380 * 100vw) auto calc(32 / 380 * 100vw);

}

.merit04 .block_system .ttl_system {
font-size:calc(16 / 380 * 100vw);
line-height: calc(36 / 24);
    padding:.8em .5em;

}
.merit04 .block_system .system_inner{
padding:calc(10 / 380 * 100vw) calc(20 / 380 * 100vw);
}


.merit04 .block_system .ttl_system02 {
font-size:calc(14 / 380 * 100vw);
line-height:2;
margin:0 auto calc(12 / 380 * 100vw);
}
.merit04 .block_system .ttl_system02 span{
    padding-bottom:calc(12 / 380 * 100vw);
    margin-bottom:calc(12 / 380 * 100vw);
}

.merit04 .block_system .text01 {
margin-bottom:calc(12 / 380 * 100vw);
    font-size: calc(12 / 380 * 100vw);
}

.merit04 .block_system .cap {
font-size:calc(12 / 380 * 100vw);
}

.merit04 .block_btn {
flex-flow: column;
gap:calc(20 / 380 * 100vw) 0;
}

    .link_text {
  margin: 1.0em auto 1.0em;
  font-size: 1.0em;


}
}
