@charset "UTF-8";
/*
Icon classes can be used entirely standalone. They are named after their original file names.

```html
<i class="icon-home"></i>
```
*/
.icon-thumb01 {
  background-image: url(../img/2019/sprite.png);
  background-position: 0 0;
  width: 124px;
  height: 124px;
}

.icon-thumb02 {
  background-image: url(../img/2019/sprite.png);
  background-position: calc(124 * 2 / 620 * 100%) calc(124 * 3 / 496 * 100%);
  width: 124px;
  height: 124px;
}

.icon-thumb03 {
  background-image: url(../img/2019/sprite.png);
  background-position: calc(124 * 3 / 620 * 100%) calc(124 * 3 / 496 * 100%);
  width: 124px;
  height: 124px;
}

.icon-thumb04 {
  background-image: url(../img/2019/sprite.png);
  background-position: calc(124 * 4 / 620 * 100%) 0;
  width: 124px;
  height: 124px;
}

.icon-thumb05 {
  background-image: url(../img/2019/sprite.png);
  background-position: calc(124 * 4 / 620 * 100%) calc(124 * 1 / 496 * 100%);
  width: 124px;
  height: 124px;
}

.icon-thumb06 {
  background-image: url(../img/2019/sprite.png);
  background-position: calc(124 * 4 / 620 * 100%) calc(124 * 2 / 496 * 100%);
  width: 124px;
  height: 124px;
}

.icon-thumb07 {
  background-image: url(../img/2019/sprite.png);
  background-position: calc(124 * 4 / 620 * 100%) calc(124 * 3 / 496 * 100%);
  width: 124px;
  height: 124px;
}

.icon-thumb08 {
  background-image: url(../img/2019/sprite.png);
  background-position: 0 calc(124 * 4 / 496 * 100%);
  width: 124px;
  height: 124px;
}

.icon-thumb09 {
  background-image: url(../img/2019/sprite.png);
  background-position: calc(124 * 1 / 620 * 100%) calc(124 * 4 / 496 * 100%);
  width: 124px;
  height: 124px;
}

.icon-thumb10 {
  background-image: url(../img/2019/sprite.png);
  background-position: calc(124 * 2 / 620 * 100%) calc(124 * 4 / 496 * 100%);
  width: 124px;
  height: 124px;
}

.icon-thumb11 {
  background-image: url(../img/2019/sprite.png);
  background-position: calc(124 * 3 / 620 * 100%) calc(124 * 4 / 496 * 100%);
  width: 124px;
  height: 124px;
}

.icon-thumb12 {
  background-image: url(../img/2019/sprite.png);
  background-position: calc(124 * 4 / 620 * 100%) calc(124 * 4 / 496 * 100%);
  width: 124px;
  height: 124px;
}

.icon-thumb13 {
  background-image: url(../img/2019/sprite.png);
  background-position: calc(124 * 5 / 620 * 100%) 0;
  width: 124px;
  height: 124px;
}

#gleContents {
  font-feature-settings: "palt" 1;
  font-family: 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', Osaka, 'Meiryo', 'メイリオ', 'ＭＳ Ｐゴシック', "MS P Gothic" ,sans-serif;
  letter-spacing: 0.05em;
  color: #000;
  text-align: left;
}

#gleContents * {
  margin: 0;
  padding: 0;
  line-height: 1;
  box-sizing: border-box;
  font-weight: bold;
}

@media screen and (min-width: 641px) {
  #gleContents * {
    font-size: 16px;
  }
}

@media screen and (max-width: 640px) {
  #gleContents * {
    font-size: 4.26vw;
  }
}

#gleContents img {
  display: block;
  height: auto;
  max-width: 100%;
}

@media screen and (max-width: 640px) {
  #gleContents .pc {
    display: none;
  }
}

@media screen and (min-width: 641px) {
  #gleContents .sp {
    display: none;
  }
}

#gleContents .fontEn {
  font-family: 'Oswald', sans-serif;
  font-weight: normal;
}

#gleContents > section {
  position: relative;
}

@media screen and (min-width: 641px) {
  #gleContents > section {
    min-width: 1000px;
  }
}

@media screen and (min-width: 641px) {
  #gleContents > section > .inner {
    width: 1000px;
    margin: 0 auto;
  }
}

@media screen and (max-width: 640px) {
  #gleContents > section > .inner {
    padding: 0 5.33vw;
  }
}

@media screen and (min-width: 641px) {
  #gleContents .header {
    width: 250px;
  }
}

@media screen and (min-width: 641px) {
  #gleContents .header h2 {
    font-size: 30px;
  }
}

@media screen and (max-width: 640px) {
  #gleContents .header h2 {
    font-size: 6.4vw;
  }
}

@media screen and (min-width: 641px) {
  #gleContents .header p {
    margin-top: 10px;
    font-size: 11px;
  }
}

@media screen and (max-width: 640px) {
  #gleContents .header p {
    margin-top: 3.33vw;
    font-size: 2.66vw;
  }
}

@media screen and (min-width: 641px) {
  #gleContents .flex {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
    width: 1000px;
    margin: 0 auto;
  }
}

@media screen and (max-width: 640px) {
  #gleContents .flex {
    padding: 0 5.33vw;
  }
}

@media screen and (min-width: 641px) {
  #gleContents .flex .body {
    width: 750px;
  }
}

@media screen and (min-width: 641px) {
  #gleContents .flex .body > p {
    margin-top: -8px;
    font-size: 16px;
    line-height: 36px;
  }
}

@media screen and (max-width: 640px) {
  #gleContents .flex .body > p {
    margin-top: 8vw;
    font-size: 3.2vw;
    line-height: 6.4vw;
  }
}

#gleContents .fadeIn {
  opacity: 0;
}

#gleContents .maskLeftIn {
  opacity: 0;
  -webkit-clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);
          clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);
  -webkit-transition: opacity 0.3s, -webkit-clip-path 0.5s;
  transition: opacity 0.3s, -webkit-clip-path 0.5s;
  transition: opacity 0.3s, clip-path 0.5s;
  transition: opacity 0.3s, clip-path 0.5s, -webkit-clip-path 0.5s;
}

#gleContents .maskLeftIn.-active {
  opacity: 1;
  -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
          clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}

#gleContents .maskBottomIn {
  opacity: 0;
  -webkit-clip-path: polygon(0 100%, 100% 100%, 100% 100%, 0 100%);
          clip-path: polygon(0 100%, 100% 100%, 100% 100%, 0 100%);
  -webkit-transform: translateY(-20px);
      -ms-transform: translateY(-20px);
          transform: translateY(-20px);
  -webkit-transition: opacity 0.3s, -webkit-clip-path 1s, -webkit-transform 1.5s;
  transition: opacity 0.3s, -webkit-clip-path 1s, -webkit-transform 1.5s;
  transition: opacity 0.3s, clip-path 1s, transform 1.5s;
  transition: opacity 0.3s, clip-path 1s, transform 1.5s, -webkit-clip-path 1s, -webkit-transform 1.5s;
}

#gleContents .maskBottomIn.-active {
  opacity: 1;
  -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
          clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
  -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
          transform: translateY(0);
}

#gleContents .mask {
  background-position-y: 50px;
  -webkit-transition: background-position-y 1s ease;
  transition: background-position-y 1s ease;
}

#gleContents .mask::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -webkit-transition: height 1s cubic-bezier(0.34, 0.07, 0.095, 0.995);
  transition: height 1s cubic-bezier(0.34, 0.07, 0.095, 0.995);
}

#gleContents .mask.-active {
  background-position-y: 0;
}

#gleContents .mask.-active::before {
  height: 0;
}

#gleContents .arrow-btn {
  position: relative;
  display: block;
  background-color: #000;
  background-image: url("../img/2019/icon_arrow.svg");
  background-repeat: no-repeat;
  background-position: center right 1em;
  color: #fff;
}

@media screen and (min-width: 641px) {
  #gleContents .arrow-btn {
    width: 470px;
    font-size: 18px;
    padding: 25px;
    margin: 0 0 -40px 20px;
    -webkit-transition: 0.2s;
    transition: 0.2s;
  }
}

@media screen and (max-width: 640px) {
  #gleContents .arrow-btn {
    width: 78.66vw;
    font-size: 3.6vw;
    padding: 4vw;
    margin: 0 auto -5.34vw;
    background-size: 1em;
  }
}

#gleContents .arrow-btn:hover {
  text-decoration: none;
}

@media screen and (min-width: 641px) {
  #gleContents .arrow-btn:hover {
    color: #d60b24;
    background-color: #ffa0ac;
  }
}

#gleContents section#mainVisual img {
  width: 100%;
}

#gleContents section#mainVisual .heading {
  margin: 0 auto 0.5em;
}

@media screen and (min-width: 641px) {
  #gleContents section#mainVisual .heading {
    width: 97vw;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#mainVisual .heading {
    width: 97.33vw;
  }
}

#gleContents section#mainVisual .hero {
  background-color: #d60b24;
}

@media screen and (min-width: 641px) {
  #gleContents section#mainVisual .hero .hero-flex {
    padding: 4.2vw 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  #gleContents section#mainVisual .hero .hero-flex .hero-title {
    width: 50vw;
    margin-bottom: 3.5vw;
  }
  #gleContents section#mainVisual .hero .hero-flex .hero-info {
    width: 42vw;
  }
  #gleContents section#mainVisual .hero .hero-flex .hero-content {
    position: relative;
    left: 3.5vw;
    z-index: 1;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#mainVisual .hero .hero-flex {
    padding: 5.33vw;
  }
  #gleContents section#mainVisual .hero .hero-flex .hero-title {
    margin-bottom: 4vw;
  }
  #gleContents section#mainVisual .hero .hero-flex .hero-info {
    width: 78.26vw;
    margin-bottom: 4vw;
  }
}

#gleContents section#mainVisual .hero .hero-image {
  background-image: url("../img/2019/hero_image.jpg");
  background-size: 100% auto;
  background-repeat: no-repeat;
  -webkit-transition-delay: 0.7s;
          transition-delay: 0.7s;
}

#gleContents section#mainVisual .hero .hero-image::before {
  background-color: #d60b24;
  -webkit-transition-delay: 0.7s;
          transition-delay: 0.7s;
}

@media screen and (min-width: 641px) {
  #gleContents section#mainVisual .hero .hero-image {
    position: relative;
    width: 51vw;
    height: 34.272vw;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#mainVisual .hero .hero-image {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 67.2%;
  }
}

#gleContents section#about {
  background: url("../img/2019/about_bg.jpg") top center;
}

@media screen and (min-width: 641px) {
  #gleContents section#about {
    background-repeat: no-repeat;
    background-size: cover;
    padding: 80px 0;
    background-attachment: fixed;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#about {
    padding: 10.66vw 0;
  }
}

#gleContents section#about .about-container {
  background-color: #fff;
  border: #990700 solid 5px;
}

@media screen and (min-width: 641px) {
  #gleContents section#about .about-container {
    width: 940px;
    margin: auto;
    padding: 80px 60px;
    background-image: url("../img/2019/about_image1_pc.jpg");
    background-repeat: no-repeat;
    background-position: top left;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#about .about-container {
    width: 89.33vw;
    margin: auto;
    padding: 6.66vw 4vw 4vw;
  }
}

@media screen and (min-width: 641px) {
  #gleContents section#about .about-flex {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 1.5em;
  }
  #gleContents section#about .about-flex .about-image {
    width: 301px;
    margin-left: 3em;
  }
  #gleContents section#about .about-flex .about-image.hide-pc {
    margin-left: 0;
    width: 270px;
    height: 243px;
    visibility: hidden;
  }
  #gleContents section#about .about-flex .about-text {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
        -ms-flex: 1;
            flex: 1;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#about .about-image {
    margin-bottom: 0.5em;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#about .about-image > img {
    width: 64vw;
    margin: auto;
  }
}

#gleContents section#about .about-image > figcaption {
  padding: 1em 0;
  color: #797979;
}

@media screen and (min-width: 641px) {
  #gleContents section#about .about-image > figcaption {
    text-align: right;
    font-size: 11px;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#about .about-image > figcaption {
    text-align: center;
    font-size: 2.66vw;
  }
}

@media screen and (min-width: 641px) {
  #gleContents section#about .about-text {
    line-height: 1.87;
    font-size: 16px;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#about .about-text {
    line-height: 1.64;
    font-size: 3.73vw;
    margin-bottom: 1em;
  }
}

#gleContents section#products {
  background-color: #d60b24;
}

#gleContents section#products .heading {
  margin: auto;
}

@media screen and (min-width: 641px) {
  #gleContents section#products .heading {
    padding: 70px 0;
    width: 531px;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#products .heading {
    padding: 8vw 0;
    width: 57.2vw;
  }
}

@media screen and (min-width: 641px) {
  #gleContents section#products .products-flex {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 80px;
  }
}

@media screen and (min-width: 641px) {
  #gleContents section#products .products-slide {
    min-height: 0;
    min-width: 0;
    width: calc(100% - 680px);
    -webkit-box-flex: 1;
    -webkit-flex: 1;
        -ms-flex: 1;
            flex: 1;
    background-color: #000;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#products .products-slide {
    margin: 0 auto 8vw;
    width: 89.33vw;
  }
}

@media screen and (min-width: 641px) {
  #gleContents section#products .products-slick {
    max-width: 660px;
    margin-left: auto;
  }
}

#gleContents section#products .products-content {
  position: relative;
}

@media screen and (min-width: 641px) {
  #gleContents section#products .products-content {
    width: 53%;
    min-width: 680px;
  }
}

#gleContents section#products .products-title {
  background-color: #000;
  color: #fff;
  letter-spacing: 0.16em;
  padding: 0.5em 0;
  margin-bottom: 1.5em;
}

@media screen and (min-width: 641px) {
  #gleContents section#products .products-title > span {
    font-size: 20px;
    margin-left: 40px;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#products .products-title > span {
    font-size: 4vw;
    display: block;
    width: 89.33vw;
    margin: auto;
  }
}

@media screen and (min-width: 641px) {
  #gleContents section#products .products-text {
    line-height: 1.87;
    font-size: 16px;
    width: 640px;
    margin-left: 40px;
    margin-bottom: 2em;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#products .products-text {
    line-height: 1.64;
    font-size: 3.73vw;
    width: 89.33vw;
    margin: 0 auto 2em;
  }
}

#gleContents section#products .products-links {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
}

@media screen and (min-width: 641px) {
  #gleContents section#products .products-links {
    width: 640px;
    margin-left: 40px;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#products .products-links {
    width: 93.33vw;
    margin: auto;
  }
}

#gleContents section#products .products-links > li {
  position: relative;
}

@media screen and (min-width: 641px) {
  #gleContents section#products .products-links > li {
    width: 20%;
    margin: 0 2.5% 60px;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#products .products-links > li {
    width: 20%;
    margin: 0 2.5% 12vw;
  }
}

#gleContents section#products .products-links > li > a {
  color: #000;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

@media screen and (min-width: 641px) {
  #gleContents section#products .products-links > li > a:hover > .label {
    color: #fff;
    text-decoration: underline;
  }
  #gleContents section#products .products-links > li > a:hover .icon-thumb01 {
    background-position: calc(124 * 1 / 620 * 100%) 0;
  }
  #gleContents section#products .products-links > li > a:hover .icon-thumb02 {
    background-position: calc(124 * 1 / 620 * 100%) calc(124 * 3 / 496 * 100%);
  }
  #gleContents section#products .products-links > li > a:hover .icon-thumb03 {
    background-position: 0 calc(124 * 1 / 496 * 100%);
  }
  #gleContents section#products .products-links > li > a:hover .icon-thumb04 {
    background-position: calc(124 * 1 / 620 * 100%) calc(124 * 1 / 496 * 100%);
  }
  #gleContents section#products .products-links > li > a:hover .icon-thumb05 {
    background-position: calc(124 * 2 / 620 * 100%) 0;
  }
  #gleContents section#products .products-links > li > a:hover .icon-thumb06 {
    background-position: calc(124 * 2 / 620 * 100%) calc(124 * 1 / 496 * 100%);
  }
  #gleContents section#products .products-links > li > a:hover .icon-thumb07 {
    background-position: 0 calc(124 * 2 / 496 * 100%);
  }
  #gleContents section#products .products-links > li > a:hover .icon-thumb08 {
    background-position: calc(124 * 1 / 620 * 100%) calc(124 * 2 / 496 * 100%);
  }
  #gleContents section#products .products-links > li > a:hover .icon-thumb09 {
    background-position: calc(124 * 2 / 620 * 100%) calc(124 * 2 / 496 * 100%);
  }
  #gleContents section#products .products-links > li > a:hover .icon-thumb10 {
    background-position: calc(124 * 3 / 620 * 100%) 0;
  }
  #gleContents section#products .products-links > li > a:hover .icon-thumb11 {
    background-position: calc(124 * 3 / 620 * 100%) calc(124 * 1 / 496 * 100%);
  }
  #gleContents section#products .products-links > li > a:hover .icon-thumb12 {
    background-position: calc(124 * 3 / 620 * 100%) calc(124 * 2 / 496 * 100%);
  }
  #gleContents section#products .products-links > li > a:hover .icon-thumb13 {
    background-position: 0 calc(124 * 3 / 496 * 100%);
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#products .products-links .thumbnail {
    width: 100%;
    height: 0;
    padding-bottom: 100%;
    background-size: calc(744 / 124 * 100%);
    background-repeat: no-repeat;
  }
}

#gleContents section#products .products-links .label {
  position: absolute;
  text-align: center;
  top: 110%;
  left: 0;
  right: 0;
  white-space: nowrap;
}

@media screen and (min-width: 641px) {
  #gleContents section#products .products-links .label {
    font-size: 14px;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#products .products-links .label {
    font-size: 2.66vw;
  }
}

#gleContents section#products .products-banner {
  display: block;
}

@media screen and (min-width: 641px) {
  #gleContents section#products .products-banner {
    position: absolute;
    left: 220px;
    bottom: 15px;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#products .products-banner {
    width: 89.33vw;
    margin: 0 auto 2em;
  }
}

#gleContents section#products .products-note {
  font-size: 2.66vw;
  color: #fff;
  text-align: center;
  font-weight: normal;
  position: relative;
  margin-bottom: 2em;
  top: -1em;
}

#gleContents section#products .exhibition {
  background-color: #a90718;
}

#gleContents section#products .exhibition-title {
  background-color: #000;
  color: #fff;
  letter-spacing: 0.16em;
  padding: 0.5em 0;
  margin-bottom: 1em;
}

@media screen and (min-width: 641px) {
  #gleContents section#products .exhibition-title > span {
    display: block;
    width: 1000px;
    margin: auto;
    font-size: 20px;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#products .exhibition-title > span {
    display: block;
    width: 89.33vw;
    margin: auto;
    font-size: 4vw;
  }
}

@media screen and (min-width: 641px) {
  #gleContents section#products .exhibition-flex {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 1000px;
    margin: auto;
  }
}

@media screen and (min-width: 641px) {
  #gleContents section#products .exhibition-text {
    line-height: 1.87;
    font-size: 16px;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#products .exhibition-text {
    line-height: 1.64;
    font-size: 3.73vw;
    width: 89.33vw;
    margin: 0 auto 2em;
  }
}

@media screen and (min-width: 641px) {
  #gleContents section#products .exhibition-image {
    position: relative;
    margin-left: 50px;
    margin-top: -70px;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#products .exhibition-image {
    width: 66.93vw;
    margin: auto;
  }
}

#gleContents section#test {
  border-top: 12px solid #990700;
  border-bottom: 12px solid #990700;
  background: url("../img/2019/test_bg.jpg") top center;
}

@media screen and (min-width: 641px) {
  #gleContents section#test {
    background-repeat: no-repeat;
    background-size: cover;
    padding-bottom: 60px;
    background-attachment: fixed;
  }
}

@media screen and (min-width: 1200px) {
  #gleContents section#test {
    background-repeat: no-repeat;
    background-size: cover;
    padding-bottom: 200px;
    background-attachment: fixed;
  }
}

#gleContents section#test .heading {
  margin: auto;
}

@media screen and (min-width: 641px) {
  #gleContents section#test .heading {
    padding: 70px 0;
    width: 661px;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#test .heading {
    padding: 8vw 0;
    width: 71.06vw;
  }
}

#gleContents section#test .test-container {
  margin: auto;
}

@media screen and (min-width: 1200px) {
  #gleContents section#test .test-container {
    width: 1200px;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#test .test-container {
    width: 89.33vw;
  }
}

@media screen and (min-width: 1200px) {
  #gleContents section#test .test-flex {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
        -ms-flex-direction: row;
            flex-direction: row;
    width: auto;
  }
}

@media screen and (min-width: 641px) {
  #gleContents section#test .test-flex {
    position: relative;
  }
  #gleContents section#test .test-flex .arrow-btn {
    width: 515px;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#test .test-flex .arrow-btn {
    line-height: 1.4;
  }
}

#gleContents section#test .test-demo {
  background-color: #fff;
  border-left: 5px solid #000;
  border-right: 5px solid #000;
  border-bottom: 5px solid #000;
}

@media screen and (min-width: 641px) {
  #gleContents section#test .test-demo {
    width: 610px;
    margin: 0 auto 100px;
  }
}

@media screen and (min-width: 1200px) {
  #gleContents section#test .test-demo {
    width: 660px;
    margin: 0;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#test .test-demo {
    margin-bottom: 12.26vw;
  }
}

#gleContents section#test .test-demo-title {
  background-color: #000;
  color: #d60b24;
  letter-spacing: 0.16em;
  margin-bottom: 1em;
}

@media screen and (min-width: 641px) {
  #gleContents section#test .test-demo-title {
    font-size: 20px;
    padding: 0.5em 20px;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#test .test-demo-title {
    font-size: 4vw;
    padding: 0.5em 4vw;
  }
}

#gleContents section#test .test-demo-text {
  margin-bottom: 1em;
  line-height: 1.64;
}

#gleContents section#test .test-demo-text > a {
  text-decoration: underline;
  color: #0095bc;
}

#gleContents section#test .test-demo-text small {
  font-size: 0.8em;
}

@media screen and (min-width: 641px) {
  #gleContents section#test .test-demo-text {
    font-size: 16px;
    padding: 0.5em 0 0.5em 20px;
    width: 560px;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#test .test-demo-text {
    font-size: 3.73vw;
    padding: 0.5em 4vw;
  }
}

@media screen and (min-width: 641px) {
  #gleContents section#test .test-demo-flex {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 560px;
    padding-left: 20px;
  }
}

#gleContents section#test .test-demo-images {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 1em;
}

@media screen and (max-width: 640px) {
  #gleContents section#test .test-demo-images {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}

@media screen and (min-width: 641px) {
  #gleContents section#test .test-demo-images > li {
    width: 85px;
    margin: 0 5px;
  }
  #gleContents section#test .test-demo-images > li figcaption {
    padding: 0.5em 0;
    font-size: 13px;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#test .test-demo-images > li {
    width: 18.26vw;
    margin: 0 3.2vw;
  }
  #gleContents section#test .test-demo-images > li figcaption {
    padding: 0.5em 0;
    font-size: 2.93vw;
  }
}

@media screen and (min-width: 641px) {
  #gleContents section#test .test-demo-note {
    font-size: 12px;
    line-height: 1.87;
    margin-left: 1.5em;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
        -ms-flex: 1;
            flex: 1;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#test .test-demo-note {
    font-size: 2.93vw;
    padding: 0 4vw;
    margin-bottom: 2em;
    line-height: 1.64;
  }
}

@media screen and (min-width: 1200px) {
  #gleContents section#test .test-ecco {
    position: absolute;
    right: 0;
    top: 100px;
    width: 610px;
  }
}

@media screen and (min-width: 641px) {
  #gleContents section#test .test-ecco {
    width: 610px;
    margin: auto;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#test .test-ecco {
    margin-bottom: 3em;
  }
}

#gleContents section#test .test-ecco-note {
  background-color: #990700;
  margin-bottom: 3em;
}

@media screen and (min-width: 641px) {
  #gleContents section#test .test-ecco-note {
    font-size: 12px;
    line-height: 1.87;
    padding: 1em;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#test .test-ecco-note {
    font-size: 2.93vw;
    line-height: 1.64;
    padding: 4vw;
  }
}

#gleContents section#test .test-ecco-image {
  position: relative;
}

#gleContents section#test .ecco-image-hitarea > li {
  position: absolute;
}

#gleContents section#test .ecco-image-hitarea > li > a {
  display: inline-block;
  width: 100%;
  height: 100%;
  text-decoration: underline;
  color: #0095bc;
}

@media screen and (min-width: 641px) {
  #gleContents section#test .ecco-image-hitarea > li > a {
    font-size: 14px;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#test .ecco-image-hitarea > li > a {
    font-size: 3.73vw;
  }
}

@media screen and (min-width: 641px) {
  #gleContents section#test .ecco-image-hitarea > li:nth-of-type(1) {
    width: 140px;
    height: 67px;
    bottom: 0;
  }
  #gleContents section#test .ecco-image-hitarea > li:nth-of-type(2) {
    right: 150px;
    bottom: 15px;
  }
  #gleContents section#test .ecco-image-hitarea > li:nth-of-type(3) {
    right: 10px;
    bottom: 15px;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#test .ecco-image-hitarea > li:nth-of-type(1) {
    width: 29.33vw;
    height: 10.66vw;
    bottom: 20.4vw;
  }
  #gleContents section#test .ecco-image-hitarea > li:nth-of-type(2) {
    left: 4vw;
    bottom: 2.66vw;
  }
  #gleContents section#test .ecco-image-hitarea > li:nth-of-type(3) {
    left: 33.33vw;
    bottom: 2.66vw;
  }
}

#gleContents section#special .heading {
  margin: auto;
}

@media screen and (min-width: 641px) {
  #gleContents section#special .heading {
    padding: 70px 0;
    max-width: 1010px;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#special .heading {
    padding: 8vw 0;
    width: 62.13vw;
  }
}

#gleContents section#special .special-title {
  color: #d60b24;
  letter-spacing: 0.16em;
  margin-bottom: 1em;
  text-align: center;
}

@media screen and (min-width: 641px) {
  #gleContents section#special .special-title {
    font-size: 20px;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#special .special-title {
    font-size: 4vw;
  }
}

#gleContents section#special .special-text {
  line-height: 1.64;
  text-align: center;
  margin-bottom: 2em;
}

@media screen and (min-width: 641px) {
  #gleContents section#special .special-text {
    font-size: 16px;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#special .special-text {
    font-size: 3.73vw;
  }
}

#gleContents section#special .special-text small {
  font-size: 0.8em;
}

#gleContents section#special .special-note {
  line-height: 1.64;
  text-align: center;
  margin-bottom: 5em;
}

@media screen and (min-width: 641px) {
  #gleContents section#special .special-note {
    font-size: 14px;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#special .special-note {
    font-size: 3.2vw;
  }
}

@media screen and (min-width: 641px) {
  #gleContents section#special .special-image {
    max-width: 1084px;
    margin: 0 auto 20px;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#special .special-image {
    width: 69.46vw;
    margin: 0 auto 4vw;
  }
}

#gleContents section#present {
  border-top: 12px solid #000;
  border-bottom: 12px solid #d60b24;
  background-color: #990700;
}

#gleContents section#present .heading {
  margin: auto;
}

@media screen and (min-width: 641px) {
  #gleContents section#present .heading {
    padding: 70px 0;
    width: 443px;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#present .heading {
    padding: 8vw 0;
    width: 58.93vw;
  }
}

#gleContents section#present .present-container {
  background-color: #fff;
  border-left: 5px solid #000;
  border-right: 5px solid #000;
  border-bottom: 5px solid #000;
}

@media screen and (min-width: 641px) {
  #gleContents section#present .present-container {
    width: 1000px;
    margin: 0 auto 80px;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#present .present-container {
    width: 89.33vw;
    margin: 0 auto 8vw;
  }
}

@media screen and (min-width: 641px) {
  #gleContents section#present .present-flex {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  #gleContents section#present .present-flex .arrow-btn {
    position: absolute;
    bottom: 5px;
    left: 0;
  }
  #gleContents section#present .present-flex.reverse {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -webkit-flex-direction: row-reverse;
        -ms-flex-direction: row-reverse;
            flex-direction: row-reverse;
  }
}

#gleContents section#present .present-label {
  background-color: #000;
  color: #990700;
}

@media screen and (min-width: 641px) {
  #gleContents section#present .present-label {
    font-size: 20px;
    padding: 0.5em 20px;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#present .present-label {
    font-size: 4vw;
    padding: 0.5em 4vw;
    margin-bottom: 1em;
  }
}

@media screen and (min-width: 641px) {
  #gleContents section#present .present-content {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
        -ms-flex: 1;
            flex: 1;
  }
}

#gleContents section#present .present-title {
  color: #d60b24;
  margin-bottom: 0.5em;
  line-height: 1.64;
}

@media screen and (min-width: 641px) {
  #gleContents section#present .present-title {
    font-size: 20px;
    padding: 0 20px;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#present .present-title {
    font-size: 4vw;
    padding: 0 4vw;
  }
}

#gleContents section#present .present-text {
  margin-bottom: 1em;
  line-height: 1.64;
}

@media screen and (min-width: 641px) {
  #gleContents section#present .present-text {
    font-size: 16px;
    padding: 0.5em 0 0.5em 20px;
    width: 560px;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#present .present-text {
    font-size: 3.73vw;
    padding: 0.5em 4vw;
  }
}

@media screen and (min-width: 641px) {
  #gleContents section#present .present-image {
    width: 402px;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#present .present-image {
    width: 53.6vw;
    margin: 0 auto 8vw;
  }
}

#gleContents section#collabo .heading {
  margin: auto;
}

@media screen and (min-width: 641px) {
  #gleContents section#collabo .heading {
    padding: 70px 0;
    max-width: 1199px;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#collabo .heading {
    padding: 8vw 0;
    width: 88.8vw;
  }
}

#gleContents section#collabo .collabo-text {
  line-height: 1.64;
  text-align: center;
  margin-bottom: 2em;
}

@media screen and (min-width: 641px) {
  #gleContents section#collabo .collabo-text {
    font-size: 16px;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#collabo .collabo-text {
    font-size: 3.73vw;
  }
}

#gleContents section#collabo .collabo-text small {
  font-size: 0.8em;
}

@media screen and (max-width: 640px) {
  #gleContents section#collabo .collabo-image {
    width: 89.33vw;
    margin: 0 auto 4vw;
  }
}

@media screen and (min-width: 641px) {
  #gleContents section#collabo .collabo-content {
    position: relative;
    max-width: 1200px;
    margin: 0 auto 120px;
  }
  #gleContents section#collabo .collabo-content .arrow-btn {
    position: absolute;
    right: 30px;
    bottom: 10px;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#collabo .collabo-content .arrow-btn {
    margin: 0 auto 16vw;
  }
}

#gleContents section#collabo .collabo-banner {
  display: block;
}

#gleContents section#collabo .collabo-banner > img {
  margin-bottom: 0.5em;
}

#gleContents section#collabo .collabo-banner > p {
  color: #00653c;
  text-align: center;
  line-height: 1.4;
}

@media screen and (min-width: 641px) {
  #gleContents section#collabo .collabo-banner {
    width: 710px;
    margin: 0 auto;
  }
}

@media screen and (max-width: 640px) {
  #gleContents section#collabo .collabo-banner {
    width: 89.06vw;
    margin: 0 auto;
  }
}

#gleContents .delay01 {
  -webkit-transition-delay: 0.1s;
          transition-delay: 0.1s;
}

#gleContents .delay02 {
  -webkit-transition-delay: 0.2s;
          transition-delay: 0.2s;
}

#gleContents .delay03 {
  -webkit-transition-delay: 0.3s;
          transition-delay: 0.3s;
}

#gleContents .delay04 {
  -webkit-transition-delay: 0.4s;
          transition-delay: 0.4s;
}

#gleContents .delay05 {
  -webkit-transition-delay: 0.5s;
          transition-delay: 0.5s;
}

#gleContents .delay06 {
  -webkit-transition-delay: 0.6s;
          transition-delay: 0.6s;
}

#gleContents .delay07 {
  -webkit-transition-delay: 0.7s;
          transition-delay: 0.7s;
}

#gleContents .delay08 {
  -webkit-transition-delay: 0.8s;
          transition-delay: 0.8s;
}

#gleContents .delay09 {
  -webkit-transition-delay: 0.9s;
          transition-delay: 0.9s;
}

#gleContents .delay10 {
  -webkit-transition-delay: 1s;
          transition-delay: 1s;
}

#gleContents .delay11 {
  -webkit-transition-delay: 1.1s;
          transition-delay: 1.1s;
}

#gleContents .delay12 {
  -webkit-transition-delay: 1.2s;
          transition-delay: 1.2s;
}

#gleContents .delay13 {
  -webkit-transition-delay: 1.3s;
          transition-delay: 1.3s;
}

#gleContents .delay14 {
  -webkit-transition-delay: 1.4s;
          transition-delay: 1.4s;
}

#gleContents .delay15 {
  -webkit-transition-delay: 1.5s;
          transition-delay: 1.5s;
}

#gleContents .delay16 {
  -webkit-transition-delay: 1.6s;
          transition-delay: 1.6s;
}

#gleContents .delay17 {
  -webkit-transition-delay: 1.7s;
          transition-delay: 1.7s;
}

#gleContents .delay18 {
  -webkit-transition-delay: 1.8s;
          transition-delay: 1.8s;
}

#gleContents .delay19 {
  -webkit-transition-delay: 1.9s;
          transition-delay: 1.9s;
}

#gleContents .delay20 {
  -webkit-transition-delay: 2s;
          transition-delay: 2s;
}

#gleContents .delay21 {
  -webkit-transition-delay: 2.1s;
          transition-delay: 2.1s;
}

#gleContents .delay22 {
  -webkit-transition-delay: 2.2s;
          transition-delay: 2.2s;
}

#gleContents .delay23 {
  -webkit-transition-delay: 2.3s;
          transition-delay: 2.3s;
}

#gleContents .delay24 {
  -webkit-transition-delay: 2.4s;
          transition-delay: 2.4s;
}

#gleContents .delay25 {
  -webkit-transition-delay: 2.5s;
          transition-delay: 2.5s;
}

#gleContents .delay26 {
  -webkit-transition-delay: 2.6s;
          transition-delay: 2.6s;
}

#gleContents .delay27 {
  -webkit-transition-delay: 2.7s;
          transition-delay: 2.7s;
}

#gleContents .delay28 {
  -webkit-transition-delay: 2.8s;
          transition-delay: 2.8s;
}

#gleContents .delay29 {
  -webkit-transition-delay: 2.9s;
          transition-delay: 2.9s;
}

#gleContents .delay30 {
  -webkit-transition-delay: 3s;
          transition-delay: 3s;
}

#snsBtns {
  background: url("../img/talk_shadow.png") repeat-x left top;
}

@media screen and (min-width: 641px) {
  #snsBtns {
    background-size: auto 20px;
    padding: 100px 0 0;
  }
}

@media screen and (max-width: 640px) {
  #snsBtns {
    background-size: auto 2.66vw;
    padding: 21.33vw 0 0vw;
  }
}

/* Slider */
.slick-slider {
  position: relative;
  display: block;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent;
}

.slick-list {
  position: relative;
  overflow: hidden;
  display: block;
  margin: 0;
  padding: 0;
}

.slick-list:focus {
  outline: none;
}

.slick-list.dragging {
  cursor: pointer;
  cursor: hand;
}

.slick-slider .slick-track {
  -webkit-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

.slick-track {
  position: relative;
  left: 0;
  top: 0;
  display: block;
}

.slick-track:before, .slick-track:after {
  content: "";
  display: table;
}

.slick-track:after {
  clear: both;
}

.slick-loading .slick-track {
  visibility: hidden;
}

.slick-slide {
  float: left;
  height: 100%;
  min-height: 1px;
  display: none;
}

[dir="rtl"] .slick-slide {
  float: right;
}

.slick-slide img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  height: 100vh;
  width: auto;
}

.slick-slide.slick-loading img {
  display: none;
}

.slick-slide.dragging img {
  pointer-events: none;
}

.slick-initialized .slick-slide {
  display: block;
}

.slick-loading .slick-slide {
  visibility: hidden;
}

.slick-vertical .slick-slide {
  display: block;
  height: auto;
  border: 1px solid transparent;
}
