@charset 'utf-8';

/* top
------------------------------------------------ */
.slick-arrow{ width: 30px; height: 50px; border:0; background-color: transparent; position: absolute; top:50%; transform: translateY(-50%); z-index: 1; background-repeat: no-repeat; background-position:  center center; background-size: contain; cursor: pointer; outline: none; }
.slick-prev{ left: 0; background-image: url(../../img/share/arrow-prev.svg); }
.slick-next{ right: 0; background-image: url(../../img/share/arrow-next.svg); }
.slick-dots{ margin-top: 6px; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; }
.slick-dots li{ margin: 0 6px; line-height: 1; }
.slick-dots button{ padding: 0; width: 14px; height: 14px; background-color: #CACAC8; border-radius: 50%; border:0; font-size: 0; color:transparent; cursor: pointer; outline: none; }
.slick-dots .slick-active button{ background-color: #0F5FAD; }
.slider--item{ display: flex !important; flex-wrap: wrap; align-items: center; justify-content: center; background-repeat: no-repeat; background-size: cover; background-position: center center; }
.slider-desc{ width: 100%; max-width: 1150px; padding: 0 50px; }
.slider-desc{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.slider-desc h2{ font-family: 'Koulen', cursive; font-weight: 400; }
.slider-desc p{ font-family: 'Koulen', cursive; font-weight: 400; }
.slider-inner{ position: relative; transition: .5s ease; opacity: 0; padding: 5px 25px; position: relative; display: inline-flex; flex-direction: column; max-width: 580px; border:10px solid #fff; transform: translateY(30px); }
.slick-slide.slick-active .slider-inner{ opacity: 1; transform: translateY(0) }
.hexagon { position: absolute; line-height: 1; }
.hexagon.first{ top:-32px; left: -43px; }
.hexagon.second{ bottom:-49px; right: -27px; }
.slick-slide img{ width:100%; } 


@media only screen and (min-width: 768px) {
    /* .slick-list,
    .slick-track,
    .slider--item {
        height: calc(100vh - 125px) !important;
    } */
    .hexagon svg{ width: 60px; height: 60px; }
}
@media only screen and (max-width: 767px) {	
    .slick-dots{ position: absolute; bottom: 15px; left: 0; width: 100%; }
    .slick-dots li{ margin: 0 3px; }
    .slick-dots button{ width: 5px; height: 5px; }
    .slick-arrow{ width: 33px; height: 33px; }
    .slick-prev{ left: 0; background-image: url(../../img/share/arrow-prev-sp.svg); }
    .slick-next{ right: 0; background-image: url(../../img/share/arrow-next-sp.svg); }

    /* .slider--item {
        padding: 25px 0;
        min-height: 200px;
    } */
    .slider-desc{ padding: 5px 80px; text-align: center; }
    .slider-desc h2{ font-size: 1.4rem !important; text-align: left; }
    .slider-desc p{ font-size: 1.2rem !important; text-align: left; }
    .slider-inner{ padding: 5px 15px; border-width: 3px; }
    .hexagon svg{ width: 20px; height: 20px; }
    .hexagon.first{ top: -11px; left: -15px; }
    .hexagon.second{ bottom:-18px; right: -9px; }
}

#banner{ margin-top: 48px; padding-top: 35px; border-top:3px solid #EC92B5; }
#banner a{ display: block; border-radius: 11px; overflow: hidden; box-shadow: 0 3px 6px rgba(0,0,0,0.13); }
.banner--list { display: block; }
.banner--list li:nth-child(n+2) { margin-top: 30px; }

    @media only screen and (max-width: 767px) {

        .banner--list li:nth-child(n+2) { margin-top: 20px; }

    }

#latest-post{ padding-top: 38px; }
.latest-post--title{ padding: 7px 0; width: 226px; text-align: center; font-size: 2.4rem; font-weight: 400; color:#fff; line-height: calc(46 / 24); background-color: #EC92B5; box-shadow: 0 3px 3px rgba(0,0,0,0.1); }
.latest-post--list{ margin-top: 30px; }
.latest-post--list li{  }
.latest-post--list li a{ display: block; }
.latest-post--list .thumb{ overflow: hidden; border-radius: 10px; width: 100%; height: 250px; }
.latest-post--list .thumb img{ transition: .5s ease; width: 100%; height: 100%; object-fit: cover; object-position: center center; }
.latest-post--list .thumb:hover img{ transform: scale(1.2); }
.latest-post--list .cat{ margin-top: 10px; display: flex; flex-wrap: wrap; }
.latest-post--list .cat span{ margin-right: 5px; min-width: 84px; padding: 5px 5px 2px; font-size: 1.3rem; font-weight: 400; font-family: 'Hanuman', serif; color:#000; text-align: center; background-color: #CFCFCF; }
.latest-post--list h3{ margin-top: 13px; font-family: 'Koulen', cursive; font-weight: 400; font-size: 1.7rem; color:#121212; line-height: calc(28 / 17); overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; }
.latest-post--list .txt{ margin-top: 18px; font-size: 1.8rem; font-weight: 400; color:#121212; line-height: calc(28 / 15); }
.latest-post--list .read-more{  text-align: right; font-size: 1.8rem; line-height: calc(32 / 16); font-weight: 400; color:#0044FF; }
.latest-post--list .read-more span{ display: inline-block; font-family: 'Content', cursive; }
.latest-post--list .read-more span:after{ transition: .2s ease; display: block; content:''; width: 100%; height: 2px; background-color: transparent; border-radius: 2px; }
.latest-post--list .read-more span:hover:after{ background-color: #0044FF; }

.latest-post--list li a:hover .cat span,
.latest-post--list li a:hover h3,
.latest-post--list li a:hover .txt{ color:#0F5FAD; }

@media only screen and (min-width: 768px) {
    .latest-post--list{ display: flex; flex-wrap: wrap; }
    .latest-post--list li{ width: 30.5%; }
    .latest-post--list li:not(:nth-child(3n+1)){ margin-left: 4.25%; }
    .latest-post--list .txt{ overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; line-clamp: 3; -webkit-box-orient: vertical; }
}

@media only screen and (max-width: 767px) {	
    #latest-post{ padding-top: 10px; }
    .latest-post--title{ padding: 0; width: 121px; font-size: 1.3rem; line-height: normal; }
    .latest-post--list{ margin-top: 10px; }
    .latest-post--list li{ max-height: 7em; overflow: hidden; }
    .latest-post--list li+li{ margin-top: 10px; }
    .latest-post--list .thumb{ float: left; width: 99px; height: 66px; margin-right: 5px; }
    .latest-post--list .cat{ margin: 0; line-height: 1.8; }
    .latest-post--list .cat span{ font-size: 1rem; }
    .latest-post--list .cat span{ padding: 4px 5px 1px; min-width: 45px; }
    .latest-post--list h3{ margin-top: 9px; font-size: 1.2rem; }
    .latest-post--list .txt{ margin-top: 2px; font-size: 1rem; }
    .latest-post--list .read-more{ display: none; }
}

#category{ padding-top: 76px; }
.category--list{  }
.category--list li{ overflow: hidden; border-radius: 10px; }
.category--list li a{ position: relative; padding: 13px 90px 15px 10px; display: flex; flex-wrap: wrap; word-break: break-all; color:#121212; }
.category--thumb{ overflow: hidden; }
.category--thumb img{ width: 100%; height: 100%; object-fit: cover; object-position: center center; }
.category--desc{ width: calc(100% - 108px); padding-left: 14px; }
.category--desc i{ display: block; line-height: 1; position: absolute; right: 33px; top: 50%; transform: translateY(-50%); }
.category--desc h3{ font-size: 2rem; font-weight: 400; font-family: 'Koulen', cursive; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; line-clamp: 1; -webkit-box-orient: vertical; word-break: break-word; }
.category--desc p{ margin-top: 8px; font-size: 1.5rem; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; word-break: break-word; }

@media only screen and (min-width: 768px) {
    .category--list{ display: flex; flex-wrap: wrap; justify-content: space-between; }
    .category--list li{ width: calc(50% - 10px); }
    .category--list li:not(:nth-child(-n+2)){ margin-top: 20px; }
    .category--thumb{ width: 108px; height: 108px; }
}

@media only screen and (max-width: 767px) {
    #category{ padding-top: 10px; }
    .category--thumb{ padding: 0 5px 0 0; width: 65px; height: unset; }
    .category--thumb img{ object-position: center top; }
    .category--desc{ padding-left: 0; padding-bottom: 10px; width: calc(100% - 65px); }
    .category--list li+li{ margin-top: 6px; }
    .category--list li a{ padding: 10px 26px 0 0; }
    .category--desc i{ right: 9px; }
    .category--desc i svg{ width: 15px; height: 15px; }
    .category--desc h3{ font-size: 1.3rem; }
    .category--desc p{ margin-top: 0; font-size: 0.8rem; }
}