/*! Writen  by SCSS */
@import url("https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400..800;1,400..800&display=swap");
.garamond {
  font-family: "EB Garamond", serif;
  font-optical-sizing: auto;
  font-style: normal; }

.sec_main {
  position: relative; }
  .sec_main .inner_head {
    width: 53.79%;
    position: absolute;
    z-index: 2;
    top: 71.67%;
    left: 8.58%; }
  .sec_main img {
    width: 100%; }

.wrap::before {
  content: "";
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 100lvh;
  z-index: -1;
  background: url("../images/bg.jpg") top center/cover no-repeat; }

.sec01 {
  padding-top: clamp(80px, 10%, 120px);
  padding-bottom: clamp(80px, 10%, 120px);
  /*	.read{
  		margin-bottom: $cl100;
  	}*/ }
  @media screen and (max-width: 480px) {
    .sec01 {
      padding-top: 50px; } }

.slide_outer {
  position: relative;
  margin-bottom: clamp(25px, 3.34%, 40px); }
  .slide_outer .slide_image {
    position: relative; }
    .slide_outer .slide_image .slide_text {
      position: absolute;
      left: 10px;
      right: 10px;
      bottom: 6.25%;
      text-align: center;
      font-size: clamp(13px, 1.73vw, 18px);
      line-height: 1;
      letter-spacing: 0.1em; }
      .slide_outer .slide_image .slide_text.white {
        color: #fff; }

.swiper-button-next,
.swiper-button-prev {
  max-width: 60px;
  width: 6%;
  transition: opacity 0.3s ease-in-out;
  height: auto;
  top: 0;
  bottom: 0;
  margin-top: 0;
  display: flex;
  align-items: center;
  line-height: 0; }
  @media (hover: hover) {
    .swiper-button-next:hover,
    .swiper-button-prev:hover {
      opacity: 0.7; } }
  @media screen and (max-width: 480px) {
    .swiper-button-next,
    .swiper-button-prev {
      width: 8%; } }
  .swiper-button-next:focus,
  .swiper-button-prev:focus {
    outline: none; }
  .swiper-button-next::after,
  .swiper-button-prev::after {
    content: none; }

.swiper-button-next {
  left: calc(100% + 25px);
  right: auto; }
  @media screen and (max-width: 1200px) {
    .swiper-button-next {
      left: auto;
      right: 10px; } }
  @media screen and (max-width: 480px) {
    .swiper-button-next {
      right: 5px; } }

.swiper-button-prev {
  right: calc(100% + 25px);
  left: auto; }
  @media screen and (max-width: 1200px) {
    .swiper-button-prev {
      right: auto;
      left: 10px; } }
  @media screen and (max-width: 480px) {
    .swiper-button-prev {
      left: 5px; } }

.thum_slide .swiper-wrapper,
.thum_slide2 .swiper-wrapper {
  margin: 0 auto;
  flex-wrap: wrap !important;
  justify-content: center;
  gap: clamp(15px, 2vw, 24px) 2%; }
  @media screen and (max-width: 480px) {
    .thum_slide .swiper-wrapper,
    .thum_slide2 .swiper-wrapper {
      gap: 10px 2%; } }
.thum_slide .swiper-slide,
.thum_slide2 .swiper-slide {
  cursor: pointer;
  position: relative;
  line-height: 0;
  max-width: 180px;
  width: 15%; }
  @media screen and (max-width: 480px) {
    .thum_slide .swiper-slide,
    .thum_slide2 .swiper-slide {
      width: 32%; } }
  .thum_slide .swiper-slide:first-child,
  .thum_slide2 .swiper-slide:first-child {
    margin-left: 0.84%; }
    @media screen and (max-width: 480px) {
      .thum_slide .swiper-slide:first-child,
      .thum_slide2 .swiper-slide:first-child {
        margin-left: 0; } }
  .thum_slide .swiper-slide:nth-child(4),
  .thum_slide2 .swiper-slide:nth-child(4) {
    margin-right: 0.84%; }
    @media screen and (max-width: 480px) {
      .thum_slide .swiper-slide:nth-child(4),
      .thum_slide2 .swiper-slide:nth-child(4) {
        margin-right: 0; } }
  .thum_slide .swiper-slide .thum_text_box,
  .thum_slide2 .swiper-slide .thum_text_box {
    position: absolute;
    inset: 0;
    z-index: 2;
    background: rgba(255, 255, 255, 0.4);
    transition: opacity 0.3s ease-in-out;
    font-size: clamp(10px, 1.44vw, 15px);
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    inset: 15px; }
    @media screen and (max-width: 768px) {
      .thum_slide .swiper-slide .thum_text_box,
      .thum_slide2 .swiper-slide .thum_text_box {
        inset: 10px;
        font-size: 11px; } }
    @media screen and (max-width: 480px) {
      .thum_slide .swiper-slide .thum_text_box,
      .thum_slide2 .swiper-slide .thum_text_box {
        font-size: 10px; } }
    .thum_slide .swiper-slide .thum_text_box .thum_text,
    .thum_slide2 .swiper-slide .thum_text_box .thum_text {
      color: #333333;
      line-height: 1.34;
      text-shadow: 0px 0px 0px rgba(255, 255, 255, 0.9), 0px 0px 1px rgba(255, 255, 255, 0.9), 0px 0px 2px rgba(255, 255, 255, 0.9), 0px 0px 3px rgba(255, 255, 255, 0.9), 0px 0px 4px rgba(255, 255, 255, 0.9), 0px 0px 5px rgba(255, 255, 255, 0.9), 0px 0px 6px rgba(255, 255, 255, 0.9), 0px 0px 7px rgba(255, 255, 255, 0.9), 0px 0px 8px rgba(255, 255, 255, 0.9), 0px 0px 9px rgba(255, 255, 255, 0.9), 0px 0px 10px rgba(255, 255, 255, 0.9);
      font-weight: 600; }
  .thum_slide .swiper-slide::before,
  .thum_slide2 .swiper-slide::before {
    content: "";
    display: block;
    position: absolute; }
  @media (hover: hover) {
    .thum_slide .swiper-slide:hover .thum_text_box,
    .thum_slide2 .swiper-slide:hover .thum_text_box {
      opacity: 0; } }
  .thum_slide .swiper-slide.swiper-slide-thumb-active .thum_text_box,
  .thum_slide2 .swiper-slide.swiper-slide-thumb-active .thum_text_box {
    opacity: 0; }

/*# sourceMappingURL=style.css.map */