@charset "utf-8";

/*=====================
  merit
=====================*/
body#merit {
}


/*  contentWrap
=====================*/
#merit #contentWrap {
  /* background:repeating-linear-gradient(135deg, #d8effc 0, #d8effc 3px, #fff 3px, #fff 6px); */
}
#merit #contentWrap figure {
  position: relative;
  height: fit-content;
}

.pageMV {
  position: relative;
/*  background:repeating-linear-gradient(135deg, #d8effc 0, #d8effc 3px, #fff 3px, #fff 6px);*/
  text-align: center;
  /* height: 390px;
  background: url(../img/merit/main_bg.jpg) no-repeat center center;
  background-size: cover; */
}
.pageMV h2 {
  /* position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  color: #fff;
  white-space: nowrap; */
}

/*===== 共通 =====*/

[class^="sec"] {
  margin: 0 auto;
  padding: 100px 0 0;
}
[class^="sec"] h3 {
  /* font-family: 'Oswald', sans-serif; */
  font-size: 30px;
  font-weight: 600;
  line-height: 1.6;
  letter-spacing: 0.1em;
  margin: 0 auto 40px;
  text-align: center;
  font-feature-settings: "palt";
}
[class^="sec"] h3 span {
  font-size: 1.25em;
}
[class^="sec"] p {
  /* font-family: 'Oswald', sans-serif; */
  font-size: 16px;
  font-weight: 600;
  line-height: 2.2;
  letter-spacing: 0.1em;
  /* margin: 0 auto 70px;
  text-align: center; */
  font-feature-settings: "palt";
}
[class^="sec"] p.copy {
  /* font-family: 'Oswald', sans-serif; */
  font-size: 20px;
  font-weight: 600;
  line-height: 2.2;
  letter-spacing: 0.4em;
  margin: 0 auto 50px;
  text-align: center;
  font-feature-settings: "palt";
}

.filterDS {
  filter: drop-shadow(0 0 12px rgba(0, 0, 0, .4));
}

.caption {
  position: absolute;
  bottom:5px;
  font-size: 15px;
  font-family: 'Oswald', sans-serif;
  letter-spacing: 0.03em;
}

.merit_Box {
  background: #FFF;
  box-shadow: 0px 10px 10px -6px rgba(0, 0, 0, 0.3);
  margin-bottom: 100px;
}
.merit_Box .ttl {
  display: flex;
  justify-content:center;
  align-items: center;

  background: #3575a7;
  padding: 4% 0;
}
.merit_Box .ttl figure {
  width:40%;
  text-align: center;
}
.merit_Box .ttl figure img {
  max-width: 300px;
  width:100%;
}
.merit_Box .ttl p {
  width:60%;

  color:#FFF;
  font-size: 31px;
  font-weight: 600;
  line-height: 2.2;
  letter-spacing: 0.2em;
}

.merit_Box .txt_Box {
  padding: 5% 8% 8% 8%;
}
.merit_Box .txt_Box > p {
  font-size: 18px;
  font-weight: normal;
  line-height: 2.0;
  letter-spacing: 0.4em;

  padding: 0 0 30px 2em;
}

/*===== 個別 =====*/
.sec01 {
  background: url(../img/merit/bg.png) no-repeat center center;
  background-size: cover;
}

.anc_List {
  display: flex;
  justify-content:space-between;
  align-items: center;
  padding: 0 0 120px;
}
.anc_List li {
  width: calc((100% - 6%) / 3);
  box-shadow: 0px 10px 10px -6px rgba(0, 0, 0, 0.3);
}
.anc_List li a {
  transition: .3s;
}
.anc_List li a:hover {
  transition: .3s;
  opacity: .5;
}
.anc_List li .fig {
  background: #3575a7;
  padding: 5% 0;
}
.anc_List li .fig figure {
  max-width: 160px;
  margin: 0 auto;
}
.anc_List li .txt {
  background: #FFF;
  padding: 5% 0 0;
  border:1px solid #FFF;
}
.sec01 .anc_List li .txt p {
font-size: clamp(15.6px,1.6vw,19.2px);
  text-align: center;
  margin: 0 auto;
  letter-spacing: 0.2em;
}

.sec01 .anc_List li .more {
padding: 1em 0;
text-align: center;
background: #fbf200;
margin: 5% 0 0;
}
.sec01 .anc_List li .more span {
position: relative;
padding-right: 1.2em;
font-size: clamp(11px,1.6vw,19.2px);
}
.sec01 .anc_List li .more span::after {
content: "▼";
position: absolute;
top: 53%;
right: 0;
transform: translate(0,-50%);
font-size: 80%;
}


.sec02 {
  background: #d7eefb;
  padding: 100px 0;
}
.sec02 .img_Set01 {
  display: flex;
  justify-content:space-between;
  align-items: stretch;
}
.sec02 .img_Set01 li:nth-child(1) {
  width:60.7%;
}
.sec02 .img_Set01 li:nth-child(2) {
  width:37.7%;
}
.sec02 .link_Txt {
  text-align: center;
  margin-top: 60px;
}
.sec02 .link_Btn {
  margin: 60px auto 0;
  text-align: center;
}
.sec02 .link_Btn a {
position: relative;
  display: inline-block;
  background: #29abe2;
  padding: 18px 0;
  width:420px;
  color:#FFF;
  font-size: 22px;
  letter-spacing: 0.2em;
  transition: .3s;
}
.sec02 .link_Btn a::after {
content: "〉";
position:absolute;
top: 50%;
right: 0;
transform: translate(0,-50%);
font-size: 70%;
}
.sec02 .link_Btn a:hover {
  transition: .3s;
  opacity: .5;
}


.sec02 .img_Set02 {
  display: flex;
  justify-content:space-between;
}
.sec02 .img_Set02 li {
  width:49%;
}
.img_02_01 {
  margin-bottom: 15px;
}
.img_05 {
  box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.35);
}
.img_05 .att {
  position: absolute;
  bottom:-2.5em;
  right:0;

  font-size: 11px;
}


.conv_Set {
  display: flex;
  justify-content: center;
}
.conv_Set li {
  margin: 0 10px;
}
.conv_Set li a {
  display: block;
  padding: 16px 0;
  width:250px;

  text-align:center;
  font-size: 18px;
  letter-spacing: 0.2em;
  transition: .3s;
}
.conv_Set li.b_request a {
  background: linear-gradient(90deg, rgba(41, 171, 226, 1) 0%, rgba(156, 216, 242, 1) 30%, rgba(255, 255, 255, 1) 50%, rgba(156, 216, 242, 1) 76%, rgba(41, 171, 226, 1) 100%);
}
.conv_Set li.b_reserve a {
  background: linear-gradient(90deg, rgba(180, 125, 50, 1) 0%, rgba(220, 200, 90, 1) 30%, rgba(255, 255, 255, 1) 50%, rgba(220, 200, 90, 1) 76%, rgba(180, 125, 50, 1) 100%);
}

.conv_Set li a:hover {
  transition: .3s;
  opacity: .5;
}

/*-----------------------------
tab横のみ
-----------------------------*/
@media only screen and (min-width: 1024px) and (max-width: 1200px) {






}


/*-----------------------------
tab
-----------------------------*/
@media only screen and (min-width: 768px) and (max-width: 1023px)  {

br.tab.sp {
  display: block;
}

[class^="sec"] {
  margin: 0 auto;
  padding: 50px 0 0;
}

}


/*=============================
spから
=============================*/
@media only screen and (max-width: 767px) {

.pageMV {
  background: url(../img/merit/main_bg_sp.jpg) no-repeat center center;
  background-size: cover;
  height: 200px;
}

.inner {
  width: 92%;
}

/*===== 共通 =====*/
/* [id^="merit0"] {
  padding-top: 70px;
  margin-top: -70px;
} */
[class^="sec"] {
  margin: 0 auto;
  padding: 50px 0 0;
}
[class^="sec"] h3 {
  font-size: 22px;
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: 0.1em;
  margin: 0 auto 20px;
}
[class^="sec"] h3 + p {
  font-size: 16px;
  font-weight: 500;
  line-height: 2.2;
  margin: 0 auto 50px;
}
[class^="sec"] p.copy {
  /* font-family: 'Oswald', sans-serif; */
  font-size: 15px;
  letter-spacing: 0.2em;
  margin: 0 auto 30px;
}

.caption {
  position: absolute;
  bottom:5px;
  font-size: 13px;
  font-family: 'Oswald', sans-serif;
  letter-spacing: 0.03em;
}


.merit_Box {
  margin-bottom: 50px;
}
.merit_Box .ttl {
  display: flex;
  justify-content:center;
  align-items: center;

  padding: 5% 0;
}
.merit_Box .ttl figure {
  width:25%;
  text-align: center;
  margin-right: 20px;
}
.merit_Box .ttl figure img {
  max-width: 100%;
  width:100%;
}
.merit_Box .ttl p {
  width:60%;

  font-size: 15px;
}

.merit_Box .txt_Box {
  padding: 5% 4% 8% 4%;
}
.merit_Box .txt_Box > p {
  font-size: 13px;
  letter-spacing: 0.2em;

  padding: 0 0 20px 0;
}


.filterDS {
  filter: drop-shadow(0 0 7px rgba(0, 0, 0, .4));
}


/*===== 個別 =====*/
.anc_List {
  flex-direction: column;
  padding: 0 0 60px;
}
.anc_List li {
  width: 100%;
}
.anc_List li a {
  display: flex;
  justify-content: space-between;
align-items: unset;
}
.anc_List li .fig {
  width:35%;
  padding: 5% 0;
}
.anc_List li .fig figure {
  max-width: 100%;
  width:70%;
}
.anc_List li .txt {
  width:65%;
  padding: 3.5% 0 0;
  display: flex;
flex-direction: column;
justify-content: space-between;
}
.sec01 .anc_List li .txt p {
  text-align: center;
  font-size: 13px;
  line-height: 1.3;
  letter-spacing: 0.1em;
  margin: 0 auto;
}
.anc_List li + li {
  margin-top: 20px;
}
.sec01 .anc_List li .more {
padding: 0 0 0.3em;
/* margin: 3% 0 0; */
}


.sec02 {
  padding: 50px 0;
}
.sec02 .img_Set01 {
  flex-direction: column;
}
.sec02 .img_Set01 li:nth-child(1) {
  width:100%;
  margin-bottom: 15px;
}
.sec02 .img_Set01 li:nth-child(2) {
  width:100%;
}
.sec02 .link_Txt {
  text-align: center;
  margin-top: 30px;
}
.sec02 .link_Btn {
  margin: 30px auto 0;
}
.sec02 .link_Btn a {
  width:100%;

  font-size: 16px;
  letter-spacing: 0.2em;
}


.sec02 .img_Set02 {
  flex-direction: column;
}
.sec02 .img_Set02 li {
  width:100%;
}
.sec02 .img_Set02 li + li {
  margin-top: 15px;
}
.img_02_01 {
  margin-bottom: 15px;
}
.img_05 {
  margin-bottom: 30px;
}
.img_05 .att {
  position: absolute;
  bottom:-3.5em;
  right:0;

  font-size: 11px;
  line-height: 1.3;
}







.conv_Set {
  flex-direction: column;
}
.conv_Set li {
  width:90%;
  margin: 0 auto 20px;
}
.conv_Set li a {
  display: block;
  padding: 16px 0;
  width:100%;

  font-size: 18px;
}





}