@font-face {
  font-display: swap;
  font-family: 'Noto Serif JP';
  font-style: normal;
  font-weight: 500;
  src: url('noto-serif-jp-v31-japanese-500.woff2') format('woff2');
}
@font-face {
  font-display: swap;
  font-family: 'Noto Serif JP';
  font-style: normal;
  font-weight: 700;
  src: url('noto-serif-jp-v31-japanese-700.woff2') format('woff2');
}

/*====================================================
////id |  cmn
====================================================*/
header {
    display: none;
}
#contents {
    font-size: min(4vw, 1.8rem);
}
#contents h2 {
    letter-spacing: .03em;
}
.f-serif {
    font-family: "Noto Serif JP","游明朝 Medium", "YuMincho Medium", "游明朝体 Medium", "Hiragino Mincho ProN", "MS PMincho", serif;
}
/* ////////// mobile ////////// */
@media screen and (max-width: 769px) {
}

/* ////////// PC ////////// */
@media print, screen and (min-width: 769px) {
}

@media (hover: hover) {}

/*====================================================
////id |  mv
====================================================*/
#mv {
    background-color: #000;
    padding-bottom: min(10vw, 40px);
}
.mv-img {
    margin: auto;
    max-width: 1700px;
}
.mv-img-coverImg {
    padding-top: min(56%, 950px);
    height: min(70vw, 80vh);
    height: min(70vw, 80svh);
    max-height: 950px;
}
.mv-title {
    display: grid;
    place-items: center;

}
.mv-title-text {
    display: flex;
        justify-content: center;
}
.mv-title-text p {
    border: solid 1px;
    color: #fff;
    font-size: min(3.8vw, 2.2rem);
    min-width: min(80%, 500px);
    padding: .2em 1em;
    text-align: center;
}
/* ////////// mobile ////////// */
@media screen and (max-width: 1080px) {
    .mv-img-coverImg {
        padding-top: min(100%, 650px);
    }
    .mv-title-head {
        margin: auto;
        width: min(90%, 650px);
    }
}

/* ////////// PC ////////// */
@media print, screen and (min-width: 1080px) {
    #mv {
        overflow: hidden;
    }
    .mv-img-figure {
        height: 70vh;
        height: 70svh;
            min-height: 500px;
    }
    .mv-title-head {
        margin: auto;
        max-width: 1600px;
    }
}

@media (hover: hover) {}

/*====================================================
////id |  overview
====================================================*/
#overview {
    background: url('../img/crystal_award/overview-bg.webp') no-repeat center / cover;
}
.overview-head {
    margin-bottom: .3em;
    padding-top: .8em;
    position: relative;
    text-align: center;
}
.overview-head::before {
    background: url('../img/crystal_award/head_deco-1.svg') no-repeat center / contain;
    content: '';
    display: block;
    margin: auto;
    position: absolute;
        top: 0;
        left: 0;
    width: 100%;
    height: .68em;
}
.overview-point-wrapper {
    display: flex;
        flex-wrap: wrap;
        gap: 0 min(1vw, 20px);
        justify-content: center;
}
.overview-point {
    width: min(40vw, 260px);
}
.overview-text {
    font-weight: 700;
    line-height: 1.6;
    margin-top: min(7vw, 45px);
    text-align: center;
}
/* ////////// mobile ////////// */
@media screen and (max-width: 769px) {
    .overview-head {
        font-size: min(7vw, 4rem);
    }
    .overview-text {
        font-size: min(4.5vw, 3.0rem);
    }
}

/* ////////// PC ////////// */
@media print, screen and (min-width: 769px) {
    .overview-head {
        font-size: min(5vw, 6.8rem);
    }
    .overview-text {
        font-size: min(3.0vw, 3.5rem);
    }
}

@media (hover: hover) {}

/*====================================================
////id |  detail
====================================================*/
#detail {
    clip-path: inset(0);
    position: relative;
}
#detail::before {
    background: url('../img/crystal_award/detail-bg.webp') no-repeat center / cover;
    content: '';
    display: block;
    pointer-events: none;
    position: fixed;
        top: 0;
        left: 0;
    width: 100%;
    height: 100%;
}
.detail-inner {
    flex: 1;
}
.detail-item-wrapper {
    display: grid;
        grid-gap: min(15vw, 65px);
}
.detail-item-coverImg {
    height: 100%;
    padding-top: 100%;
}
.detail-item-img .slideShow:before {
    background-color: #fdeac6;
}

.detail-item-text dt {
    color: #fff;
    font-weight: 700;
    line-height: 1.4;
    margin-bottom: .6em;
    text-shadow: .05em .05em .1em rgba(0, 0, 0, .8);
}
.detail-item-text dd {
    position: relative;
}
.detail-item-text dd .text {
    background-color: rgba(0, 0, 0, .3);
    color: #fff;
    padding: 1em;
}
.detail-item-text dd .deco_en {
    color: rgba(255, 255, 255, .15);
    font-weight: 700;
    line-height: 1;
    position: absolute;
        right: 0;
        bottom: calc(100% + .1em);
}
/* ////////// mobile ////////// */
@media screen and (max-width: 769px) {
    .detail-item-img {
        margin: 0 auto 1.5em;
        width: min(90%, 400px);
    }
    .detail-item-text dt {
        font-size: min(6vw, 3.0rem);
        text-align: center;
    }
    .detail-item-text dd .deco_en {
        font-size: min(16vw, 12rem);
    }
}

/* ////////// PC ////////// */
@media print, screen and (min-width: 769px) {
    .detail-item {
        display: flex;
            gap: min(3vw, 56px);
    }
    .detail-item:nth-child(even) {
        flex-direction: row-reverse;
    }
    .detail-item-img {
        width: min(30vw, 470px);
    }
    .detail-item-text {
        display: flex;
            align-items: center;
        flex: 1;
        padding: 30px 0;
    }
    .detail-item-text dt {
        font-size: min(3vw, 3.3rem);
    }
    .detail-item-text dd .deco_en {
        font-size: min(10vw, 12rem);
    }
}

@media (hover: hover) {}

/*====================================================
////id |  scene
====================================================*/
#scene {
    background: url('../img/crystal_award/scene-bg.webp') no-repeat center / cover;
}
.scene-head {
    margin-bottom: .8em;
    padding-bottom: .8em;
    position: relative;
}
.scene-head::after {
    background: url('../img/crystal_award/head_deco-2.svg') no-repeat center / contain;
    content: '';
    display: block;
    margin: auto;
    position: absolute;
        bottom: 0;
        left: 0;
    width: 100%;
    height: .6em;
}
.scene-item-wrapper {
    display: flex;
        flex-wrap: wrap;
        gap: min(10vw, 50px) min(4vw, 28px);
        justify-content: center;
}
.scene-item dt {
    font-weight: 700;
}
/* ////////// mobile ////////// */
@media screen and (max-width: 960px) {
    .scene-head {
        font-size: min(7vw, 4rem);
    }
    .scene-item-wrapper {
        display: grid;
            grid-gap: min(7vw, 50px);
    }
    .scene-item-img {
        margin: 0 auto ;
        width: min(40%, 200px);
    }
    .scene-item-coverImg {
        padding-top: 100%;
    }
    .scene-item-text {
        flex: 1;
    }
    .scene-item dt {
        font-size: min(5vw, 2.4rem);
        margin-bottom: .3em;
        text-align: center;
    }
}

/* ////////// PC ////////// */
@media print, screen and (min-width: 960px) {
    .scene-head {
        font-size: min(5vw, 5rem);
    }
    .scene-item {
        width: min(30%, 380px);
    }
    .scene-item dt {
        font-size: min(2.8vw, 3rem);
        margin: .5em 0 .3em;
        text-align: center;
    }
}

@media (hover: hover) {}

/*====================================================
////id |  design
====================================================*/
#design {
    clip-path: inset(0);
    color: #fff;
    overflow: hidden;
    position: relative;
}
#design::before {
    background: url('../img/crystal_award/design-bg.webp') no-repeat center / cover;
    content: '';
    display: block;
    pointer-events: none;
    position: fixed;
        top: 0;
        left: 0;
    width: 100%;
    height: 100%;
}
.design-wrapper {
    position: relative;
}
.design-wrapper::before,
.design-wrapper::after {
    content: '';
    display: block;
    margin: auto;
    opacity: .1;
}
.design-wrapper::before {
    background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 470 557"><path fill="%23ffffff" d="M464.21,0c-7.24,108.53-53.99,136.87-105.64,147.13-30.48,3.46-43.95-13.2-49.7-22.51-11.86-19.24-6.58-23.76,8.83-34.59,15.38-10.83,23.63-21.8,17-36.89-20.94-5.2-30.52-1.29-44.65,15.13-14.17,16.43-9.48,42.96,9.98,61.99,12.19,10.58,23.17,16.91,33.41,20.24-9.77.31-22.42-.38-36.64-1.06-42.15-2.04-98.06-4.07-133.44,19.83-10.78,3.37-27.61,10.19-51.6-26.87C87.76,105.37,80.74,62.11,0,80.71c9.34,8.24,20.66,24.55,24.69,39.26,4.04,14.65,58.13,72.86,111.74,60.23-48.16,61.64-36.83,76.49-35.17,99.18-15.05,21.54-28.45,31.45-43.98,40.58-15.54,9.17-28.42,29.99-24.88,65.11,34.98,3.74,83.11-25.08,79.79-73.35,12.32,21.96,31.25,36.54,53.62,46.15,13.25,15.68,21.84,37.73,19.58,55.68-3.72,29.97-27.94,27.55-37.86,28.94-9.98,1.34-96.7,32.59-50.09,104.63,3.94-20.23,15.37-25.52,28.41-29.82,26.38-9.32,46.95-30.35,55.68-56.92-6.26,49.3,8.55,77.4,29.56,96.63-5.79-17.01-4.24-23.9,2.03-35.78,6.31-11.88,21.2-27.23,6.38-55.31-14.79-28.09-22.43-37.06-24.47-49.58-1.3-8.18-4.86-33.11-18.51-54.31,11.88,4.04,24.09,7.03,36.49,8.96,42.16,6.82,51.22-6.12,84.78,27.53,33.52,33.6,64.65,42.4,99.32,27.84-10.69-9.74-15.03-44.16-41.72-57.17-14.81-7.22-49.31-6.15-80.34-5.07-24.94.87-47.63,1.73-56.02-1.72,32.93-2.92,58.5-34.41,64.34-67.12,5.85-32.75,41.01-37.75,41.01-37.75-38.48-8.92-75.11-2.48-93.34,27.77-18.23,30.25-69.51,70.68-103.03,37.03-33.52-33.65-27.51-136.37,66.44-157.59-29.38,38-24.68,56.39-9.66,69.12,15.06,12.77,47.22,10.53,62.08-.72-25.41-5.73-33.73-26.33-34.81-42.39-1.09-16.12,13.44-29.17,25.87-31.28,28.12-4.8,48.94-3.97,68.42-3.15,15.23.64,29.66,1.29,46.1-.76,105.62-13.12,119.81-110.77,117.29-155.56h-5.53Z" /></svg>') no-repeat top left / contain;
    position: absolute;
        top: 0;
        left: 1.5%;
    width: min(35vw, 470px);
    height: 80%;
}
.design-wrapper::after {
    background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 517 702"><path fill="%23ffffff" d="M87.63,157.14c18.93-6.62,59.27-38.42,94.06-20.66,34.78,17.69,53.13,42.02,55.57,84.89-26.38-33.6-76.29-27.54-88.43-26.32-12.16,1.17-22.38-3.73-52.17-10.62-29.79-6.89-40.42,10.72-49.92,19.52-9.52,8.75-15.56,11.89-32.82,10.66,23.06,14.85,52.85,21.74,97.22,3.82-22.6,14.66-37.13,38.96-39.34,65.81-.8,13.19-2.91,25.13-20.79,33.76,78.51,25.73,86.33-62.68,85.13-72.3-1.14-9.58-9.34-31.53,17.65-42.35,26.97-10.84,72.08,3.43,82.64,28.67-52.29-18.25-61.94,33.42-51.45,53.52,9.2-26.53,57.23-37.37,56.29-18.35-1.01,19.06-7.66,48.05-37.94,93.17,3.71-40.91-31.32-41.86-66.86-25.37,30.85-9.6,50.09,22.55,39.15,54.43-10.93,31.89-84.64,20.32-124.13,126.45-45.89,123.36,16.43,179.33,40.35,186.12-69.9-60.85-45.86-131.48-36.23-148.66,9.64-17.14,37.32-14.24,44.84-3.45,7.52,10.79,20.16,26.58,29.83,9.44,9.25-24-12-39.12-46.68-33.28,64.17-48.65,94.89-15.39,109.02-4.21,14.11,11.2,10.54,27.78-6.75,42.49-17.25,14.7-25.93,28.79-16.29,46.16,25.7,3.91,36.77-1.86,51.91-23.12,15.17-21.31,6.59-52.61-18.88-73.28-56.96-43.28-118.25-3.77-146.41,29.38,29.67-101.66,79.45-107.55,89.13-111.46,16.38-6.59,33.89-6.09,45.43,18.58s33.34,24.86,36.66,43.6c9.72-12.07,16.82-29.19,10.35-53.93-6.47-24.78-29.94-33.05-79.45-20.12,27.6-20.7,66.46-66.46,81.49-97.85,6.99-6.21,46.55-24.83,55.86-27.77,9.36-2.9,24.7,4.46,29.45,16.09,4.74,11.57,5.98,28.8-9.79,41.48,14.22,2.76,37.43-6.68,43.57-20.73,6.13-14.03,3.11-28.47-30.39-44.94,72.83-17.33,112.17,52.32,100.28,87.27-11.89,34.95-61.51,24.26-84.58,9.39-23.07-14.87-50.84-6.83-74.64,12.56,0,0,26.25-8.53,41.53,12.32,15.27,20.84,43.89,34.06,67.87,24.84-10.49,11.83-78.66,33.14-92.84,51.37-9.08,11.66-8.76,26.32-8.44,38.09.18,6.62.36,12.33-1.13,16.09,29.17-1.7,47.89-18.5,59.79-53.41,11.91-34.96,22.67-29.03,49.76-48.22,27.11-19.18,48.3-43.58,50.1-75.86,14.2,34.83,57.64,38.47,80.78,23.9-9.54-25.72-25.66-35.84-39.64-36.92-13.97-1.07-26.7-3.4-44.58-13.28-6.6-16.41-3.77-30.64-58.47-57.2,41.73-9.53,59.58-68.66,57.38-80.27-2.22-11.65.1-26.88,3.8-35.84-62.71,14.64-52.81,47.23-56.88,81.27-4.06,34.08-13.05,25.31-21.54,36.12-47.54-6.62-85.73,18.28-114.58,35.21,0,0,9.09-18.15,9.28-37.44,0,0,7.57-2.66,27.79-8.04,20.21-5.38,54.77-34.83,53.01-66.49-58.52-11.8-69.78,31.74-81.81,56.53,2.66-13.67.18-28.57-2.3-41.44-2.55-13.23-5.1-24.32-2.08-29.76,5.9-10.75,47.12-18.7,57.58-30.56,10.52-11.87,25.78-57.45,15.76-84.18-6.29,22.41-54.61,28.97-69.4,41.09-14.78,12.18-19.72,38.4-18.08,62.47-3.99-11.4-16.57-22.11-29.48-37.11-12.94-15.03-2.99-30.43,5.22-56.38,8.23-26.01,1.54-66-26.86-82.55,3.63,7.03,3.06,19.48-8.64,35.13-11.66,15.63-17.42,36.55-8.33,68.87-44.41-35.07-80.27-25.67-108.97,6.74-13.46,15.16-26.49,25.25-55.2,22.86,39.19,41.04,68.72,30.19,87.63,23.54h0Z" /></svg>') no-repeat bottom right / contain;
    position: absolute;
        bottom: 0;
        right: 1.5%;
    width: min(55vw, 520px);
    height: 80%;
}
.design-head {
    text-shadow: 0 0 .3em #120a05, 0 0 .3em #120a05, 0 0 .3em #120a05, 0 0 .3em #120a05;
}
.design-item-wrapper {
    display: grid;
        grid-gap: min(7vw, 60px) min(5vw, 45px);
    margin: min(8vw, 70px) auto 0;
}
.design-item-text {
    line-height: 1.4;
    margin-top: 1em;
    text-shadow: 0 0 .3em #120a05, 0 0 .3em #120a05, 0 0 .3em #120a05, 0 0 .3em #120a05;
}
#design .slick-list {
    overflow: visible;
}
.design-gallery {
    margin: min(10vw, 70px) auto 0;
}
.design-gallery-item-coverImg {
    padding-top: 100%;
}
/* ////////// mobile ////////// */
@media screen and (max-width: 960px) {
    .design-item-wrapper {
        max-width: 600px;
    }
}
@media screen and (max-width: 769px) {
    .design-head {
        font-size: min(7vw, 4rem);
    }
    .design-gallery {
        width: min(40%, 300px);
    }
}

/* ////////// PC ////////// */
@media print, screen and (min-width: 769px) {
    .design-head {
        font-size: min(5vw, 5rem);
    }
}
    
@media screen and (min-width: 960px) {
    .design-item-wrapper {
        grid-template-columns: 1fr 1fr;
    }

}

@media (hover: hover) {}

/*====================================================
////id |  flow
====================================================*/
#flow {
    background: url('../img/crystal_award/flow-bg.webp') no-repeat center / cover;
}
.flow-head-wrapper {
    display: flex;
        justify-content: center;
}
.flow-head {
    padding: 0 1.6em;
    position: relative;
}
.flow-head::before,
.flow-head::after {
    background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 52 19"><path fill="%238C8C8C" d="M0,5.55c2.5,2.38,9.87,4.45,17.04.76C20.53,4.51,27.02,0,34.05,0h.03c4.4,0,9.01,1.77,13.22,7.07-6.47-4.42-15.83-1.91-23.04,2.58C15.63,15.04,6.63,16.48,0,5.55ZM37.96,8.93c3.53-.53,7.13.1,10.26,1.8-7.36.22-12.38,4.81-15.2,6.07-3.6,1.62-8.03-.5-10.72-3.02,6.84,1.07,10.44-4.13,15.66-4.85ZM52,13.48c-1.94,3.39-3.75,5-5.56,5.36-2.12.45-4.33-.07-6.03-1.42,4.77,0,5.1-5.42,11.59-3.94Z" /></svg>') no-repeat center / contain;
    content: '';
    display: block;
    margin: auto;
    position: absolute;
        top: .2em;
        bottom: 0;
    width: 1.2em;
    height: 1em;
}
.flow-head::before {
    left: 0;
}
.flow-head::after {
    right: 0;
    transform: scale(-1, 1);
}
.flow-item-wrapper {
    display: grid;
        grid-gap: min(8vw, 42px);
    margin: min(7vw, 70px) auto 0;
    max-width: 900px;
}
.flow-item {
    display: grid;
        grid-gap: min(4vw, 70px);
        grid-template-columns: min(20%, 150px) 1fr;
    line-height: 1.6;
}
.flow-item-coverImg {
    border-radius: 100%;
    box-shadow: 0 3px 6px rgba(0, 0, 0, .15);
    padding-top: 100%;
}
.flow-item-text {
    display: flex;
        align-items: center;
}
.flow-item dt {
    font-weight: 500;
    margin-bottom: .3em;
}
/* ////////// mobile ////////// */
@media screen and (max-width: 769px) {
    .flow-head {
        font-size: min(7vw, 4rem);
    }
    .flow-item dt {
        font-size: min(4.5vw, 2.2rem);
    }
}

/* ////////// PC ////////// */
@media print, screen and (min-width: 769px) {
    .flow-head {
        font-size: min(5vw, 5rem);
    }
    .flow-item dt {
        font-size: min(2.2vw, 2.6rem);
    }
}

@media (hover: hover) {}

/*====================================================
////id |  cta
====================================================*/
#cta {
    background-color: #000;
    color: #fff;
    position: relative;
    text-align: center;
}
#cta::before ,
#cta::after {
    background: url('../img/crystal_award/cta-bg.webp') no-repeat bottom center / cover;
    content: '';
    display: block;
    margin: auto;
    mix-blend-mode: lighten;
    position: absolute;
        left: 0;
        right: 0;
    width: 100%;
    height: min(30vw, 300px);
}
#cta::before {
    top: 0;
}
#cta::after {
    bottom: 0;
    transform: rotate(180deg);
}
.cta-inner {
    padding: min(24vw, 230px) 0;
}
.cta-head {
    margin-bottom: .5em;
}
.cta-link-wrapper {
    display: flex;
        flex-wrap: wrap;
        gap: 20px min(4vw, 40px);
        justify-content: center;
    margin: min(10vw, 74px) auto 0;
}
.cta-link {
    border-radius: 2em;
    color: var(--black);
    display: grid;
        align-items: center;
        justify-content: center;
    font-size: min(5.5vw, 2.4rem);
    font-weight: 700;
    overflow: hidden;
    padding: .3em .8em;
    position: relative;
    text-align: center;
    text-shadow: 0 0 .07em #fff, 0 0 .07em #fff, 0 0 .07em #fff, 0 0 .07em #fff, 0 0 .07em #fff, 0 0 .07em #fff, 0 0 .07em #fff, 0 0 .07em #fff, 0 0 .07em #fff, 0 0 .07em #fff, 0 0 .07em #fff, 0 0 .07em #fff, 0 0 .07em #fff, 0 0 .07em #fff, 0 0 .07em #fff, 0 0 .07em #fff, 0 0 .07em #fff, 0 0 .07em #fff, 0 0 .07em #fff, 0 0 .07em #fff, 0 0 .07em #fff, 0 0 .07em #fff, 0 0 .07em #fff, 0 0 .07em #fff, 0 0 .07em #fff, 0 0 .07em #fff, 0 0 .07em #fff, 0 0 .07em #fff, 0 0 .07em #fff, 0 0 .07em #fff, 0 0 .07em #fff, 0 0 .07em #fff;
    transition: .2s ease-in-out;
    width: min(100%, 15em);
    min-height: 3.4em;
}
.cta-link::after {
    border: solid 2px #fff;
    border-radius: 2em;
    box-sizing: border-box;
    content: '';
    display: block;
    margin: auto;
    pointer-events: none;
    position: absolute;
        top: 0;
        left: 0;
    width: 100%;
    height: 100%;
}
.cta-link-bg {
    position: absolute;
        top: 0;
        left: 0;
    width: 100%;
    height: 100%;
}
.cta-link-bg::before,
.cta-link-bg::after {
    background: url('../img/crystal_award/cta_btn-bg.webp') no-repeat center left;
    background-size: auto 100%;
    content: '';
    display: block;
    margin: auto;
    position: absolute;
        top: 0;
    width: 55%;
    height: 100%;
    z-index: -1;
}
.cta-link-bg::before {
    left: 0;
}
.cta-link-bg::after {
    right: 0;
    transform: scale(-1, 1);
}
.cta-link > span {
}
/* ////////// mobile ////////// */
@media screen and (max-width: 769px) {
    .cta-head {
        font-size: min(7vw, 4rem);
    }
}

/* ////////// PC ////////// */
@media print, screen and (min-width: 769px) {
    .cta-head {
        font-size: min(4.5vw, 4.5rem);
    }
    .cta-text {
        font-size: 2.2rem;
    }
}

@media (hover: hover) {
    .cta-link:hover {
        filter: contrast(1.1);
        transform: scale(1.05);
    }
}
