@charset "UTF-8";

/*-------------------------
  Font Zen Old Mincho ZENオールド明朝
---------------------------*/

@import url('https://fonts.googleapis.com/css2?family=Libre+Caslon+Text:ital,wght@0,400;0,700;1,400&family=Zen+Old+Mincho&display=swap');

.mincho-reg,
.mincho {
  font-family: "Zen Old Mincho", serif;
  font-weight: 400;
  font-style: normal;
  letter-spacing: 0.01em;
}

.mincho-reg.en{
  font-family: "Zen Old Mincho", serif;
  font-weight: 400;
  font-style: normal;
  letter-spacing: 0.01em;
}

.mincho-500 {
  font-family: "Zen Old Mincho", serif;
  font-weight: 500;
  font-style: normal;
  letter-spacing: 0.01em;
}

.mincho-bold {
  font-family: "Zen Old Mincho", serif;
  font-weight: 600;
  font-style: normal;
  letter-spacing: 0.01em;
}

.playfair-display {
  font-family: "Playfair Display", serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}

.libre-caslon-text-regular {
  font-family: "Libre Caslon Text", serif;
  font-weight: 400;
  font-style: normal;
}

.libre-caslon-text-bold {
  font-family: "Libre Caslon Text", serif;
  font-weight: 700;
  font-style: normal;
}

.libre-caslon-text-regular-italic {
  font-family: "Libre Caslon Text", serif;
  font-weight: 400;
  font-style: italic;
}

.en{
  letter-spacing: 0.01em;
  font-family: "Libre Caslon Text", serif;
  font-weight: 400;
  font-style: normal;
}

/*----------MENU-------------

TOP メインスライダー Swiper
concept


------------MENU-----------*/

/*-------------------------
	Reset
---------------------------*/
* {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  box-sizing: border-box; }

article,
aside,
details,
figcaption,
figure,
hgroup,
menu,
section,
main {
  display: block; }

body {
  -webkit-text-size-adjust: 100%; }

.clearfix::after {
   content: "";
   display: block;
   clear: both;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: bold;}

.brand_title_item h1{
  margin: 0 0 0 !important;
}

table,
input,
textarea,
select,
option {
  line-height: 1.1; }

table {
  border-collapse: collapse;
}

blockquote,
q {
  quotes: none; }

*:focus {
outline: none!important;
}

a {outline:none!important;}

a {
  -webkit-tap-highlight-color:rgba(0,0,0,0);
  cursor:pointer!important;
}

a,
ins {
  text-decoration: none; }

del {
  text-decoration: line-through; }

img {
  max-width:100%;
  vertical-align: top; }

a {
  transition: 0.3s ease-in-out; }

ul li{
  list-style:none;
}

ul{
  margin:0;
  padding:0;
}

.sp540_only{
  display: none;
}

@media (max-width: 540px){
.sp540_only{
  display: block;
}
  }


.wrap {
    max-width: 1200px;
    margin: auto;
    padding: 0 0.8rem;
}

.wrap_1600{
  max-width: 1600px;
    margin: auto;
    padding: 0 0.8rem;
}

p.mincho{
  font-family: 游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN","Hiragino Mincho Pro",HGS明朝E,メイリオ,Meiryo,serif;
  font-size: 14px;
}

@media (max-width: 320px){
p.mincho{
  letter-spacing: -.07em;
}
}

.mb_0{
  margin-bottom:0!important;
}

p.price {
    font-size: 14px;
    color: #421f1b;
    line-height: 1.6;
    text-align: center;
    padding: 10px 0 0px;
}

body.VD_2026 .pane-contents{
  font-family: 'Noto Sans JP', "Hiragino Kaku Gothic ProN", "Hiragino Maru Gothic Pro", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", sans-serif;
  letter-spacing: .11em;
  background: #1065a7;
}

/*
background:linear-gradient(90deg, #043a78 0%, #2872c7 50%, #043a78 100%);
*/

/*-------------------------
共通
------------------------- */
  .concept .concept__inner{
    color: #000 !important;
  }

  .concept .concept_inner,
  .f_fff {
    color: #fff !important;
  }

  .star .list_gift h3,
  .star p.price,
  .star p.period,
  .star p.guide_product {
    color: #000 !important;
  }

  .gold_grad {
  font-weight: bold;
  margin:0 auto 10px;
  background: linear-gradient(90deg, #bc7f04 0%, #dbb00b 45%, #fde79d 70%, #dbb10c 85%, #bc7f04 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

p.period{
  text-align: center;
  font-size: 14px;
  margin: 20px 0 10px;
}

/*-------------------------
  TOP メインスライダー Swiper
------------------------- */
.mv01 .swiper .swiper-slide img{
  width:100%;
  height:auto;
 }

.mv01 {
    max-width: 1600px;
    margin: 0 auto;
    position: relative;
    text-align: center;
  }

.mv01::before {
  content: "";
  display: block;
  padding-top: calc(((580 / 1600) * 100%));
}

.mv01 .swiper{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  max-width: 1600px;
  height: auto;
  box-sizing: border-box;
  padding: 0 0 4px !important;
  }

  .swiper-scrollbar {
  bottom: 0px !important;
}

@media only screen and (max-width: 767px) {
    .mv01 {
    margin: 0 auto 6px;
  }
  }

/*-------------------------
  目次 mokuji
---------------------------*/
.y100 .mokuji{
   /*background: #dfa678;*/
   background: linear-gradient(90deg, #af7813 0%, #fddd72 50%, #af7813 100%);
   padding: 20px 0 ;
   margin: 0px auto 0px;
}

.y100 .mokuji ul.page_links{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    max-width: 1200px;
    gap: 5px 10px;
    margin: 0 auto;
}

.y100 .mokuji ul.page_links li{
  min-width: 200px;
  height: 60px;
  font-size: 23px;
  line-height: 1.5;
  text-align: center;
  display: block;
  padding:  0 ;
  position: relative;
  border-left: 1px solid #fff;
}

.y100 .mokuji ul.page_links li:last-child{
  border-right: 1px solid #fff;
}

.y100 .mokuji ul.page_links a{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.y100 .mokuji ul.page_links a:hover{
  text-decoration: none;
  opacity: 0.5;
}

.y100 .mokuji ul.page_links li:after {
    content: "";
    background: #000;
    height: calc(tan(60deg) * 8px / 2);
    width: 10px;
    clip-path: polygon(0 0, 100% 0, 50% 100%);
    position: absolute;
    bottom: 8px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
}


@media (max-width: 540px) {
.y100 .mokuji {
    padding: 10px 0 5px;
}

.y100 .mokuji ul.page_links {
  gap: 0px 5px;
  margin: 0px auto !important;
}

.y100 .mokuji ul.page_links li {
    min-width: 120px;
    height: 55px;
    font-size: 17px;
    line-height: 1;
    border-left: none;
    border-right: 1px solid #fff;
}

.y100 .mokuji ul.page_links li.gyo_1{
  line-height: 2;
}

.y100 .mokuji ul.page_links li:last-child{
  border-right: none;
}

}

/*--------------------------------------------------------------
News
--------------------------------------------------------------*/
.news_100th {
 margin: 0px auto 0px;
 padding: 40px 0 50px;
 max-width: 650px;
 clear:both;
}

.news_100th h2{
  margin: 0 auto;
  font-size: 24px;
  font-weight: 400;
  color: #000;
  text-align: center;
}

.news_100th .news_block {
  margin:0;
  padding:5px 5px 5px 0;
  border-top:#dedddd solid 1px;
  border-bottom:#dedddd solid 1px;
}

.news_100th .news_area{
  margin:6px;
}

.news_100th div.flexcroll {
  padding:0px 10px 0px;
  height:25px;
  display: flex;
  flex-direction: column;
  overflow:auto;
  position:relative;
}

.news_100th div.flexcroll.news2 { /* ニュース2件から、height:65px;*/
  padding:0px 10px 0px;
  height:45px;
  display: flex;
  flex-direction: column;
  overflow:auto;
  position:relative;
}

.news_100th div.flexcroll.news3 { /* ニュース3件から、height:65px;*/
  padding:0px 10px 0px;
  height:65px;
  display: flex;
  flex-direction: column;
  overflow:auto;
  position:relative;
}

.news_100th .flexcroll dl.news {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  gap: 5px 5px;
  font-size: 14px;
}

.news_100th .flexcroll dl.news dt {
  width: 12%;
  line-height:1.5em;
  letter-spacing:normal;
}

.news_100th .flexcroll dl.news dd {
  width: 87%;
  line-height:1.5em;
}

.news_100th .flexcroll dl.news dd a{
  color: #fff;
  text-decoration: underline;
}

@media (max-width: 640px) {
  .news_100th .flexcroll dl.news dt {
  width: 100%;
}

.news_100th .flexcroll dl.news dd {
  width: 100%;
}
}

.news_100th ::-webkit-scrollbar {
  width: 8px;
}
.news_100th ::-webkit-scrollbar-track {
  background: #bbbbbb;
  border-radius: 8px;
}
.news_100th ::-webkit-scrollbar-thumb {
  background: #fde79d;
  border-radius: 8px;
}

/*-------------------------
  concept  ebae60
---------------------------*/

.concept{
  padding: 0rem 0 0;
}

.concept .concept__inner {
    padding: 0rem 0rem;
    background: url(img/bg_concept_w.webp),
    #f5f5f5;
    background-repeat: no-repeat;
    background-size: 55%, 100%;
    background-position: 100% 10%;
}

.concept .series_concept {
    padding: 50px 0px 100px;
}

.concept .list__special{
  align-items: flex-start;
}

.concept .list__special_img_half {
    padding: 0 0rem 0 1.5rem;
}

.concept .concept__inner .list__special_img_half {
    width: 40%;
    padding: 0 0rem 0 1.5rem;
}

.concept .concept__inner .list__special_text_half{
  width: 60%;
  padding: 0 2rem 0 0rem;
  text-align: center;
}

.concept .concept__inner .list__special_text_half p {
    font-size: 16px;
    text-align: left;
    line-height:1.8;
    max-width: 900px;
    margin: 0px auto 20px;
    padding: 0;
    filter: drop-shadow(rgba(245, 245, 245, 1) 0px 10px 10px);
    text-shadow: 1px 1px 10px #fff, -1px 1px 10px #fff, 1px -1px 10px #fff, -1px -1px 10px #fff;
}

.concept h1{
  margin:0 0 10px;
  font-size: 33px;
  line-height: 1.2;
  letter-spacing: 0.01em !important;
}

.concept h1 span{
    display: block;
    margin-bottom:10px;
  }

.concept h1 img{
    width:250px;
}

img.Heritage{
  width: 140px;
  padding: 20px 0 0;
}

@media screen and (min-width:1025px) and (max-width:1350px) {
  .concept .concept__inner {
    background-size: 60%, 100%;
    background-position: 100% center;
}

.concept .series_concept {
    padding: 20px 0px 50px;
}

}

@media screen and (min-width:768px) and (max-width:1024px) {

  .concept .concept__inner {
    background-size: 60%, 100%;
    background-position: 100% 110%;
}

.concept .series_concept {
    padding: 0px 0px 0px;
}

.concept .concept__inner .list__special{
  display: block;
}

  .concept .concept__inner .list__special_img_half {
    padding: 0 10px;
}

.concept .list__special_text_half{
  padding: 0 10px;
}

}

@media screen and (min-width:768px) and (max-width:1022px) {
.concept h1 {
    line-height: 1.4;
    margin: 0 0 20px;
    font-size: 28px;
  }

  .concept .list__special_text_half {
    padding: 0 0rem 0 0rem;
}

}

@media screen and (min-width:430px) and (max-width:767px) {
  .concept .concept__inner {
  background: url(img/bg_concept_w_sp.webp),
  #f5f5f5;
  background-repeat: no-repeat;
  background-size: 96%, 100%;
  background-position: 100% 112%;
}
}


@media (max-width: 429px) {
  .concept .concept__inner {
  background: url(img/bg_concept_w_sp.webp),
  #f5f5f5;
  background-repeat: no-repeat;
  background-size: 115%, 100%;
  background-position: 100% 113%;
}
}

@media (max-width: 767px) {
.concept::before {
  content: "";
  display: block;
  padding-top: calc(((186 / 300) * 100%));
}
  .concept{
  padding: 0rem 0 0rem;
}

  .concept .series_concept {
    padding: 0px 0 200px;
}

img.Heritage{
  width: 125px;
  padding: 0px 0 0;
}

.concept .concept__inner .list__special_img_half {
  width: 100%;
  padding: 0 0px;
}

.concept .concept__inner .list__special_text_half{
  width: 98%;
  padding: 0 0px;
}

.concept h1{
  font-size: 30px;
  line-height: 1.2;
  letter-spacing: 0.01em !important;
}

.concept .list__special_text_half p {
    font-size: 15px;
    letter-spacing: 0.07em;
  }
}

/*--------------------------------------------------------------
Special Movie
--------------------------------------------------------------*/
.movie{
  padding: 30px 10px 50px;
  text-align: center;
  background: #3c3832;
  /*background:linear-gradient(90deg, #043a78 0%, #0288d1 50%, #043a78 100%);*/
}

.movie h2{
    margin: 0 auto 20px;
    font-size: 30px;
    font-weight: 400;
    color: #fde79d;
    text-align: center;
}

.movie_area{
  padding: 0px 10px 0px;
}

.movie_wrap{
  margin: 0px auto 10px;
  max-width: 760px;
}

/*--------------------------------------------------------------
History
ゴディバの100年の歴史
--------------------------------------------------------------*/
.scroll-hint-icon {
    background: rgb(209 42 23 / 80%);
}

.y100_history{
background: #dfa678;/**/
padding: 3.6rem 0 3rem;
}

h2.y100_history_ttl {
  text-align: center;
  color: #000;
  display: block;
  margin: 0 0 20px;
  font-size: clamp(1.875rem, 1.307rem + 2.84vw, 3.438rem);
}

h2.y100_history_ttl span:nth-child(2){
  display: block;
  font-size: clamp(1.375rem, 1.33rem + 0.23vw, 1.5rem);
  font-weight: 400;
}

.y100_history_wrap {
    text-align: center;
    margin-top: 0px;
}

.slide_area_body{
    padding: 2rem 0 4rem 2rem;
    overflow-x: scroll;
    display: flex;
    -webkit-overflow-scrolling: touch;
    cursor: grab;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.slide_area{
  display: flex;
  flex-wrap: nowrap;
  gap: 0rem;
  position: relative;
  overflow-x: scroll;
  -webkit-overflow-scrolling: touch;
}

.slide_area {
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none; /* IE, Edge */
}

.slide_area::-webkit-scrollbar {
  display: none; /* Chrome, Safari */
}

.slide_area .slide{
  display: flex;
  flex-direction: column;
  width: 23rem;
  flex-shrink: 0;
  background-color: #fff;
  padding: 0 5px 0px;
}

.slide_area .slide:first-child{
  padding-left: 2rem;
  width: 25rem;
}

.slide_area .slide:nth-last-child(2){
  padding-right: 2rem;
  width: 25rem;
}

.slide_area .slide .year_number .number{
  font-family: "Zen Old Mincho", serif;
  font-style: normal;
  font-size: clamp(33px, 3.5rem, 37px);
  font-weight: 400;
  letter-spacing: .02em;
  line-height: 1;
  margin: 30px 0 0;
}

.slide_area .slide-content {
    padding: 0px 0 30px;
    background-color: #fff;
    text-align: center;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.slide_area .slide-content .media{
  padding-top: 60px;
  position: relative;
  pointer-events: none;
}

.slide_area .slide-content .media:before {
    content: "";
    position: absolute;
    top: 26px;
    left: 50%;
    transform: translate(-50%);
    width: 10px;
    height: 10px;
    border-radius: 999em;
    background-color: #000;
    z-index: 10;
}

.slide_area .slide-content .media:after{
    content: "";
    position: absolute;
    top: 30px;
    left: 11.5rem;
    width: 23rem;
    height: 2px;
    border-radius: 999em;
    background-color: #000;
}

.slide_area .slide:nth-last-child(2) .slide-content .media:after{
  width: 0rem;
}

.slide_area .slide .slide-content .slide-title {
    font-size: 14px;
    margin: 20px auto 10px;
    color: #000;
  }

.slide_area .slide .slide-content p{
    font-size: 14px;
    color: #000;
    text-align: left;
    display: inline-block;
    padding: 0 12px 0;
  }

@media only screen and (max-width: 1024px) {
    .slide_area_body {
        padding: 3rem 0 3rem 2rem;
    }

    .slide_area .slide{
    width: 18rem;
  }

  .slide_area .slide:first-child{
  padding-left: 1.5rem;
  width: 19.5rem;
}

.slide_area .slide:nth-last-child(2){
  padding-right: 1.5rem;
  width: 19.5rem;
}

.slide_area .slide-content .media:after{
    left: 8.75rem;
}

.slide_area .slide:nth-last-child(2) .slide-content .media:after{
  background-color: #fff;
  left: 8.6rem;
  width: 7rem;
}

}

@media only screen and (max-width: 767px) {
  .y100_history{
     padding: 2rem 0 ;
    }

    .slide_area_body {
        padding: 2rem 1rem 2rem 1rem;
    }

    .slide_area .slide{
    width: 18rem;
}
}


/*-------------------------
100周年記念商品
-------------------------*/
.y100_products{
    background: linear-gradient(90deg, #af7813 0%, #fddd72 50%, #af7813 100%);
    padding: 3.6rem 1.25rem 3rem;
}

/* h2 */
 .memorial{
    text-align: center;
    font-size: clamp(1.875rem, 1.307rem + 2.84vw, 3.438rem);
    margin: 0 0 20px;
  }

.memorial span{
  display: block;
}

.memorial span:nth-child(2){
  font-size: clamp(1.375rem, 1.33rem + 0.23vw, 1.5rem);
  font-weight: 400;
}

h3.title_category{
  font-family: "Libre Caslon Text", serif !important;
  font-weight: 400;
}


.category_title_1 h3,
h3.VD_gift {
  text-align: center;
  position: relative;
  padding: 1.8rem 0rem 2rem;
  font-size: clamp(1.75rem, 1.636rem + 0.57vw, 2.063rem);
  font-weight: 400;
  margin:0 0 0px;
  line-height: 1.1;
  background: transparent;
}

.category_title_1 h3:before,
.category_title_1 h3:after,
h3.VD_gift:before,
h3.VD_gift:after {
  position: absolute;
  left: 0;
  width: 100%;
  height: 4px;
  content: '';
  background-image: -webkit-linear-gradient(90deg, #af7813 0%, #fddd72 50%, #af7813 100%);
  background-image: linear-gradient(90deg, #af7813 0%, #fddd72 50%, #af7813 100%);
}

.category_title_1 h3:before,
h3.VD_gift:before,
h3.VD_gift_ec_limited:before{
  top: 0;
}

.category_title_1 h3:after,
h3.VD_gift:after,
h3.VD_gift_ec_limited:after{
  bottom: 0;
}

@media screen and (max-width:376px) {
.category_title_1 h3,
h3.VD_gift {
  font-size: 26px;
}
}

.product_01, .product_02{
  margin: 0 0 1.25rem!important;
}

.product_02.y100 {
    padding: 0 0 30px;
}

.iziModals .content_box .box.chocolate-box{
    border: solid 2px #d5b04a;
  }

@media (max-width: 768px) {
  .y100_products{
    background: linear-gradient(90deg, #af7813 0%, #fddd72 50%, #af7813 100%);
    padding: 2rem 0.625rem;
}

.product_01, .product_02{
  margin: 0 0 0.625rem!important;
}

.list__item_2 {
    margin-bottom: 0px;
}
}


/*-------------------------
  slick slider 共通
------------------------- */
.slick-track{
  display: flex;
}

.slick-slide{
  height: auto!important;
}

/*-------------------------
  archive
------------------------- */
.archive{
  text-align:center;
  padding: 2rem 0 0;
}

.archive_ttl{
  font-size: clamp(1.375rem, 1.33rem + 0.23vw, 1.5rem);
  margin: 0;
}

.archive_item{
  width: 60vw;
  margin: 5vw 4.6666666667vw 0;
  position: relative;
  display: flex;
  flex-direction: column;
  text-align: center;
}

.archive_item .collection_img img{
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

.archive_item h3{
  font-size: 16px;
}

.archive-js .slick-dots {
  text-align: center;
}

.archive-js .slick-dots li {
  display: inline-block;
  margin: 0 5px;
  width: 2.6666666667vw;
  height: 2.6666666667vw;
}

.archive-js .slick-dots li button {
  width: 2.6666666667vw;
  height: 2.6666666667vw;
  color: rgba(0,0,0,0);
  border-radius: 50%;
  border: none;
  position: relative;
  background: none;
  margin: 0;
  padding: 0;
}

.archive-js .slick-dots li button:before {
  width: 2.6666666667vw;
  height: 2.6666666667vw;
  background-color: #ecf8fc;
  border-radius: 50%;
  position: absolute;
  content: "";
  top: 0;
  left: 0;
}

.archive-js .slick-dots li.slick-active button:before {
  background-color: #000;
}

.archive-js .slick-slider {
  margin-bottom: 0;
}

.archive-js .slick-prev,
.archive-js .slick-next {
  width: 4.8vw;
  height: 4.8vw;
  border-radius: 50%;
  opacity: 1;
  transition: all .3s;
  top: 46%;
  background: none;
  border: none;
  color: rgba(0,0,0,0);
  position: absolute;
  z-index: 11;
  transform: translateY(-46%);
  cursor: pointer;
}

.archive-js .slick-prev:after,
.archive-js .slick-next:after {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  content: "";
  width: 4.8vw;
  height: 4.8vw;
  border-radius: 50%;
  background: #fff;
}

.archive-js .slick-prev:before,
.archive-js .slick-next:before {
  content: "";
  position: absolute;
  border: none;
  top: auto;
  left: auto;
  width: 1.3333333333vw;
  height: 1.8666666667vw;
}

.archive-js .slick-prev:hover,
.archive-js .slick-next:hover {
  opacity: .75;
}

.archive-js .slick-prev {
  left: calc(50% - 36.4666666667vw);
}

.archive-js .slick-prev:before {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: url("img/arrow_left.svg") no-repeat top center;
  background-size: contain;
  z-index: 1;
}

.archive-js .slick-next {
  right: calc(50% - 36.4666666667vw);
}

.archive-js .slick-next:before {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: url("img/arrow_right.svg") no-repeat top center;
  background-size: contain;
  z-index: 1;
}

@media (min-width: 821px) {

.archive_item{
  width: 15vw;
  margin: 3vw 1.2666666666vw 0;
}

.archive-js .slick-dots li {
  width: 1rem;
  height: 1rem;
}

.archive-js .slick-dots li button {
  width: 1rem;
  height: 1rem;
}

.archive-js .slick-dots li button:before {
  width: 1rem;
  height: 1rem;
}

.archive-js .slick-prev,
.archive-js .slick-next {
  width: 2.3rem;
  height: 2.3rem;
}

.archive-js .slick-prev:after,
.archive-js .slick-next:after {
  width: 2.3rem;
  height: 2.3rem;
}

.archive-js .slick-prev:before,
.archive-js .slick-next:before {
  width: 1.1rem;
  height: 1.1rem;
}

.archive-js .slick-prev {
  left: calc(50% - 27rem);
}

.archive-js .slick-next {
  right: calc(50% - 27rem);
}
}

@media (max-width: 640px) {
    .archive .wrap{
        padding: 0 0rem;
    }
}

/*-------------------------
  special_contents　slider無し 初期（2コンテンツまで）
------------------------- */

.special_100th .special-js_no{
  max-width: 1400px;
  margin: 20px auto 0;
  padding: 0 10px 0;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 20px;
}

.special_100th .special-js_no .item{
  width: 48%;
  position: relative;
  border-radius: 12px 12px 12px 12px;
  display: flex;
  flex-direction: column;
  text-align: center;
  background-color: #fff;
}

.special_100th .special-js_no .item .thumb {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 12px 12px 12px 12px;
}

.special_100th .special-js_no .item h3{
  font-size: 18px;
  margin: 20px 10px 10px;
}

.special_100th .special-js_no .item P{
  text-align: left;
  font-size: 14px;
  display: inline-block;
  padding: 0 10px 10px;
}

.special_100th .special-js_no .item .item_btn{
  width: 40%;
  min-width:260px;
  margin: auto auto 20px;
}

@media (max-width: 767px) {
  .special_100th .special-js_no .item{
  width: 96%;
  margin: 0px auto 0;
}
}


/*-------------------------
  special_contents　slick slider篇
------------------------- */
.special_100th {
  padding: 2rem 0;
  background-color: #6ac5e3;
}

h2.special_100th-ttl {
  text-align: center;
  color: #000;
  display: block;
  margin: 0px 0;
  font-size: clamp(1.875rem, 1.307rem + 2.84vw, 3.438rem);
}

h2.special_100th-ttl span:nth-child(2){
  display: block;
  font-size: clamp(1.375rem, 1.33rem + 0.23vw, 1.5rem);
  font-weight: 400;
}

.special_100th-ttl__jp {
  font-size: 3.2vw;
  display: block;
}

.special_100th .special-js .item {
  width: 80vw;
  margin: 7.2vw 2.6666666667vw;
  position: relative;
  border-radius: 12px 12px 12px 12px;
  display: flex;
  flex-direction: column;
  text-align: center;
  background-color: #fff;
}

.special_100th .special-js .item .thumb {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 12px 12px 12px 12px;
}

.special_100th .special-js .item h3{
  font-size: 18px;
  margin: 20px 10px 10px;
}

.special_100th .special-js .item P{
  text-align: left;
  font-size: 14px;
  display: inline-block;
  padding: 0 10px 10px;
}

.special_100th .special-js .item .item_btn{
  width: 40%;
  min-width:260px;
  margin: auto auto 20px;
}

.special_100th .special-js .item .txt {
  position: absolute;
  left: 0;
  right: 0;
  margin: auto;
  bottom: 9.3333333333vw;
  text-align: center;
}

.special_100th .special-js .item .txt img {
  margin: auto;
}

.special_100th .special-js .item.slick-active {
  box-shadow: -0.1rem 1.1rem 1rem rgba(11,32,95,.4);
}

.special_100th .special-js .item.slick-active .thumb {
  border: 1px solid #fff;
}

.special_100th .special-js .slick-dots {
  text-align: center;
}

.special_100th .special-js .slick-dots li {
  display: inline-block;
  margin: 0 5px;
  width: 2.6666666667vw;
  height: 2.6666666667vw;
}

.special_100th .special-js .slick-dots li button {
  width: 2.6666666667vw;
  height: 2.6666666667vw;
  color: rgba(0,0,0,0);
  border-radius: 50%;
  border: none;
  position: relative;
  background: none;
  margin: 0;
  padding: 0;
}

.special_100th .special-js .slick-dots li button:before {
  width: 2.6666666667vw;
  height: 2.6666666667vw;
  background-color: #ecf8fc;
  border-radius: 50%;
  position: absolute;
  content: "";
  top: 0;
  left: 0;
}

.special_100th .special-js .slick-dots li.slick-active button:before {
  background-color: #000;
}

.special_100th .special-js .slick-slider {
  margin-bottom: 0;
}

.special_100th .special-js .slick-prev,
.special_100th .special-js .slick-next {
  width: 4.8vw;
  height: 4.8vw;
  border-radius: 50%;
  opacity: 1;
  transition: all .3s;
  top: 46%;
  background: none;
  border: none;
  color: rgba(0,0,0,0);
  position: absolute;
  z-index: 11;
  transform: translateY(-46%);
  cursor: pointer;
}

.special_100th .special-js .slick-prev:after,
.special_100th .special-js .slick-next:after {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  content: "";
  width: 4.8vw;
  height: 4.8vw;
  border-radius: 50%;
  background: #fff;
}

.special_100th .special-js .slick-prev:before,
.special_100th .special-js .slick-next:before {
  content: "";
  position: absolute;
  border: none;
  top: auto;
  left: auto;
  width: 1.3333333333vw;
  height: 1.8666666667vw;
}

.special_100th .special-js .slick-prev:hover,
.special_100th .special-js .slick-next:hover {
  opacity: .75;
}

.special_100th .special-js .slick-prev {
  left: calc(50% - 43.4666666667vw);
}

.special_100th .special-js .slick-prev:before {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: url("img/arrow_left.svg") no-repeat top center;
  background-size: contain;
  z-index: 1;
}

.special_100th .special-js .slick-next {
  right: calc(50% - 43.4666666667vw);
}

.special_100th .special-js .slick-next:before {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: url("img/arrow_right.svg") no-repeat top center;
  background-size: contain;
  z-index: 1;
}

@media (min-width: 821px) {
.special_100th {
  padding: 3.6rem 0 6rem;
}

.special_100th .special-js .item {
  width: 48rem;/*width: 77.7rem;*/
  margin: 2rem 2.6rem;
  border-radius: 2rem;
}

.special_100th .special-js .item P{
  text-align: left;
  font-size: 14px;
  display: inline-block;
  padding: 0 20px 10px;
}

.special_100th .special-js .item .thumb {
  border-radius: 2rem;
}

.special_100th .special-js .item .txt {
  bottom: 9.5rem;
}

.special_100th .special-js .slick-dots li {
  width: 1rem;
  height: 1rem;
}

.special_100th .special-js .slick-dots li button {
  width: 1rem;
  height: 1rem;
}

.special_100th .special-js .slick-dots li button:before {
  width: 1rem;
  height: 1rem;
}

.special_100th .special-js .slick-prev,
.special_100th .special-js .slick-next {
  width: 4.6rem;
  height: 4.6rem;
}

.special_100th .special-js .slick-prev:after,
.special_100th .special-js .slick-next:after {
  width: 4.6rem;
  height: 4.6rem;
}

.special_100th .special-js .slick-prev:before,
.special_100th .special-js .slick-next:before {
  width: 1.1rem;
  height: 1.1rem;
}

.special_100th .special-js .slick-prev {
  left: calc(50% - 27rem);
}

.special_100th .special-js .slick-next {
  right: calc(50% - 27rem);
}
}






/*-------------------------
  footer_area
------------------------- */
.footer_area{
  background-color: #fff;
}

.footer_area .draps{
  max-width: 600px;
  padding: 40px 20px 20px;
  margin: 0 auto;
}

.footer_area .draps .img{
  padding: 0 0;
}

.footer_area .draps .text{
  padding: 20px 10px;
  background-color: #fff;
  text-align: center;
}

.footer_area .draps .text p:nth-child(1){
  font-size: clamp(1rem, 0.955rem + 0.23vw, 1.125rem);
  font-family: "Libre Caslon Text", serif;
  font-style: oblique;
}

.footer_area .draps .text p:nth-child(2){
  font-size:16px;
  margin-top:20px;
}

@media (max-width: 640px) {
  .footer_area .draps .img,
  .footer_area .draps .text{
  width:98%;
  margin: 0px auto;
}
}