@charset "utf-8";

@font-face {
    font-family: "Onemobile";
    src: url("ONEMobileOTFRegular.eot");
    src: url("../fonts/ONEMobileOTFRegular.eot?#iefix") format("embedded-opentype"), url("../fonts/ONEMobileOTFRegular.woff2") format("woff2"), url("../fonts/ONEMobileOTFRegular.woff") format("woff"), url("../fonts/ONEMobileOTFRegular.ttf") format("truetype");
    font-weight: 400;
  }
  @font-face {
    font-family: "Onemobile";
    src: url("../fonts/ONEMobileOTFLight.eot");
    src: url("../fonts/ONEMobileOTFLight.eot?#iefix") format("embedded-opentype"), url("../fonts/ONEMobileOTFLight.woff2") format("woff2"), url("../fonts/ONEMobileOTFLight.woff") format("woff"), url("../fonts/ONEMobileOTFLight.ttf") format("truetype");
    font-weight: 300;
  }
  @font-face {
    font-family: "Onemobile";
    src: url("../fonts/ONEMobileOTFBold.eot");
    src: url("../fonts/ONEMobileOTFBold.eot?#iefix") format("embedded-opentype"), url("../fonts/ONEMobileOTFBold.woff2") format("woff2"), url("../fonts/ONEMobileOTFBold.woff") format("woff"), url("../fonts/ONEMobileOTFBold.ttf") format("truetype");
    font-weight: 700;
  }

.pc_only{ display: block;}
.mo_only{ display: none;}
body sup {font-size : 0.5em !important;}

/* explorer */
.explorer{
    width: 100%;
}
.text_wrap h2{
    font-size: 3.75vw;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: -0.02em;
    text-align: center;
    margin-bottom: 2.6042vw;
}
.text_wrap h2 sup{ font-size: 2.4896vw;}
.text_wrap p{
    font-size: 1.25vw;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: -0.02em;
    text-align: center;
}
.text_wrap span{
    display: block;
    font-size: 0.8333vw;
    line-height: 1.25;
    letter-spacing: -0.02em;
    padding-left: 9.375vw;
}
.explorer_kv{
    width: 100%;
    background: url(/content/dam/glo-jp/korea-images/brand-pages/images/2024/campaign/william_ex_kvbg.png) no-repeat center / cover;
    position: relative;
    color: #fff;
    padding: 6.6667vw 0 2.6042vw;
}
.explorer_kv p{
    margin-bottom: 5.4688vw;
}
.explorer_main{
    width: 100%;
    color: #fff;
    background-color: #000;
}
.explorer_main .text_wrap{
    width: 100%;
    padding: 11.4583vw 0 2.6042vw;
}
.explorer_main .text_wrap p{
    margin-bottom: 10.5729vw;
}

/* consider */
.consider{
    width: 100%;
    color: #fff;
}
.consider p{
    font-weight: 400;
}
.consider_kv{
    width: 100%;
    position: relative;
}
.consider_kv .text_wrap{
    position: absolute;
    top: 5.2083vw;
    left: 50%;
    transform: translate(-50%, 0);
}
.consider_main{
    width: 100%;
    position: relative;
}
.consider_main .text_wrap{
    position: absolute;
    top: 7.3958vw;
    left: 12.5vw;
}
.consider_main .text_wrap h2, 
.consider_main .text_wrap p{
    text-align: left;
}
.consider_main span{
    position: absolute;
    left: 9.3750vw;
    bottom: 4.3750vw;
    padding-left: 0;
    line-height: 1.25;
}




/* box */
.william_box{
    width: 100%;
    background: url(/content/dam/glo-jp/korea-images/brand-pages/images/2024/campaign/william_bg_black.png) no-repeat center / cover;
    position: relative;
    color: #fff;
    padding: 0 0 73.8125vw;
}
.william_box h2{
    padding: 7.8125vw 0 0;
    font-size: 3.75vw;
    line-height: 1.3;
    font-weight: 700;
    text-align: center;
    margin-bottom: 5.2083vw;
}
.william_device{
    width: 43.2292vw;
    height: 63.4375vw;
    margin: 0 auto;
}
.william_box .box__wrap{
    width: 100%;
    padding: 0 12.5vw 0;
    display: flex;
    gap: 0 1.25vw;
    flex-wrap: wrap;
    justify-content: space-between;
    position: absolute;
    bottom: 5.3333vw;
}
.william_box .box__wrap .box{
    width: calc(50% - 0.625vw);
    height: 26.0417vw;
    border-radius: 1.0417vw;
    position: relative;
    flex-shrink: 0;
    margin-bottom: 1.25vw;
    backdrop-filter: blur(12px);
}
.william_box .box__wrap .box .text{
    position: absolute;
    top: 50%;
    left: 6%;
    transform: translate(0 ,-50%);
}
.william_box .box__wrap .box .text p{
    font-size: 1.5625vw;
    line-height: 1.3;
    text-align: left;
}
.william_box .box__wrap .box.box_01{
    background-color: rgba(0,0,0,0.6);
}
.william_box .box__wrap .box.box_01 .text .top{
    font-size: 1.7708vw;
    color: #E5451C;
    margin-bottom: 1.5625vw;
    font-weight: 700;
}
.william_box .box__wrap .box.box_01 img{
    position: absolute;
    width: 14.4792vw;
    height: 100%;
    top: 0;
    right: 5%;
}
.william_box .box__wrap .box.box_02{
    background: rgba(0, 20, 123, 0.7);
    
}
.william_box .box__wrap .box.box_02 .text .top{
    font-size: 1.7708vw;
    font-weight: 700;
    margin-bottom: 1.5625vw;
}
.william_box .box__wrap .box.box_02 img{
    position: absolute;
    width: 13.2813vw;
    height: 90%;
    bottom: 0;
    right: 5%;
}
.william_box .box__wrap .box.box_03{
    background-color: rgba(177, 0, 0, 0.6);
}
.william_box .box__wrap .box.box_03 .text,
.william_box .box__wrap .box.box_04 .text{
    top: auto;
    bottom: 8%;
    transform: none;
    line-height: 1.3;
}
.william_box .box__wrap .box.box_03 img,
.william_box .box__wrap .box.box_04 img{
    width: 100%;
    height: 100%;
}
.william_box .box__wrap .box.box_04{
    background-color: rgba(0, 103, 84, 0.6);
}
.william_box .box__wrap .box.box_05{
    width: 100%;
    background-color:rgba(48, 14, 118, 0.6);
    font-size: 1.5625vw;
}
.william_box .box__wrap .box.box_05 .text{
    left: 50%;
    transform: translate(-50%, -50%);
    text-shadow: 0px 0px 4px #000, 0px 0px 4px #000;
}
.william_box .box__wrap .box.box_05 .text p{
    text-align: center;
    font-size: 1.7708vw;
}
.william_box .box__wrap .sub{
    font-size: 0.8333vw;
    font-weight: 500;
    line-height: 1.25;
    text-indent: -10px;
    padding-left: 10px;
}

/* link */
.section__link {
    background: rgba(42, 44, 44, 1);
    padding: 7.8125vw 0;
  }
  .section__link .inner {
    display: flex;
    flex-direction: column;
    gap: 1.0417vw 0;
    padding: 0 15vw;
  }
  .section__link__item {
    width: 100%;
    background: linear-gradient(94deg, #000 1.93%, #454545 100%);
    display: flex;
    color: #fff !important;
  }
  .section__link__con {
    display: flex;
    flex-direction: column;
    justify-content: center;
    flex: 1;
    padding: 3.2292vw 0 ;
  }
  .section__link .logo {
    align-items: center;
  }
  .section__link .logo__glo {
    width: 10.4167vw;
  }
  .section__link .logo__glotry {
    width: 20.8333vw;
  }
  .section__link .logo__kakao, .section__link .logo__insta {
    width: 9.3750vw;
  }
  .section__link__tit {
    font-size: 2.3958vw;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: -1.38px;
    margin-bottom: 0.8333vw;
  }
  .section__link__txt {
    margin: 0.8333vw 0 0;
    font-size: 1.25vw;
    font-weight: 400;
    line-height: 1.4;
    letter-spacing: -0.78px;
    text-align: left;
    margin-bottom: 1.875vw;
  }
  .section__link__btn {
    padding: 0.625vw 1.5625vw;
    width: 19.375vw;
    height: 2.8125vw;
    background: rgba(0, 0, 0, 0.30) url("/content/dam/glo-jp/korea-images/brand-pages/images/2024/campaign/ico_right.png") no-repeat center right 0.9vw; ;
    display: flex;
    align-items: center;
    color: #FFF !important;
    font-size: 1.1458vw;
    font-weight: 700;
    letter-spacing: -0.44px;
    border: 1px solid #fff;
  }




@media screen and (max-width: 786px) {
    .pc_only{ display: none;}
    .mo_only{ display: block;}

    .glo-contents{
        overflow: hidden;
    }
    .text_wrap h2{
        font-size: 8vw;
        margin-bottom: 4.2667vw;
    }
    .text_wrap p{
        font-size: 3.7333vw;
        margin-bottom: 13.3333vw !important;
        line-height: 1.5;
        font-weight: 400;
    }
    .text_wrap span{
        font-size: 1.8667vw;
        padding-left: 5.3333vw;
        line-height: 1.4;
    }
    .explorer_kv{
        padding: 16vw 0 5.3333vw;
        background: url(/content/dam/glo-jp/korea-images/brand-pages/images/2024/campaign/william_ex_kvbg_m.png) no-repeat center / cover;
    }
    .explorer_kv img{
        margin-bottom: 16vw;
    }

    .explorer_main .text_wrap {
        padding: 25.6vw 0 5.3333vw;
    }
    .explorer_main .text_wrap span{
        text-indent: -1.2vw;
    }




    .william_box{
        background: url(/content/dam/glo-jp/korea-images/brand-pages/images/2024/campaign/william_bg_black_m.png) no-repeat top center / cover;
        padding: 0 0 18.1333vw;
    }
    .william_box h2{
        padding: 16vw 0 0;
        font-size: 7.4667vw;
        letter-spacing: -0.03em;
    }
    .william_device{
        width: 78.4vw;
        height: 114.9333vw;
        margin: 10vw auto;
    }
    .william_box .box__wrap{
        width: 100%;
        padding: 0 12.5vw 3.125vw;
        display: flex;
        gap: 0 1.25vw;
        flex-wrap: wrap;
        justify-content: space-between;
        position: relative;
        top: -9.375vw;
        padding: 0;
        top: 0;
        margin-top: 8vw;
    }
    .william_box .box__wrap .box{
        width: 94%;
        height: 121.0667vw;
        margin-bottom: 5.3333vw;
    }
    .william_box .box__wrap .box .text > *,
    .william_box .box__wrap .box.box_01 .text .top,
    .william_box .box__wrap .box.box_02 .text .top,
    .william_box .box__wrap .box.box_04 .text{
        font-size: 5.8667vw !important;
        margin-bottom: 5.3333vw;
    }
    .william_box .box__wrap .box.box_01,
    .william_box .box__wrap .box.box_03{
        border-radius: 5.3333vw 0 0 5.3333vw;
        margin-left: 6%;
    }
    .william_box .box__wrap .box.box_01 .text,
    .william_box .box__wrap .box.box_03 .text{
        top: 9.0667vw;
        transform: none;
    }
    .william_box .box__wrap .box.box_01 .text p,
    .william_box .box__wrap .box.box_03 .text p{
        text-align: left;
    }
    .william_box .box__wrap .box.box_01 .text .top,
    .william_box .box__wrap .box.box_02 .text .top{
        margin-bottom: 5.3333vw !important;
    }
    
    .william_box .box__wrap .box.box_01 img{
        width: 89.3333vw;
        height: 91.7333vw;
        right: 0;
        top: auto;
        bottom: 0;
    }
    .william_box .box__wrap .box.box_02,
    .william_box .box__wrap .box.box_04{
        border-radius: 0 5.3333vw 5.3333vw 0;
        overflow: hidden;
    }
    .william_box .box__wrap .box.box_02 .text,
    .william_box .box__wrap .box.box_04 .text{
        top: 9.0667vw;
        left: auto;
        right: 6%;
        transform: none;
        text-align: right;
    }
    .william_box .box__wrap .box.box_02 .text p,
    .william_box .box__wrap .box.box_04 .text p{
        text-align: right;
    }
    .william_box .box__wrap .box.box_02 img{
        width: 83vw;
        height: 86.9333vw;
        top: auto;
        bottom: -1vw;
    }
    .william_box .box__wrap .box.box_05{
        width: 100%;
        height: 121.0667vw;
        border-radius: 0
    }
    .william_box .box__wrap .box.box_05 img{
        width: 100%;
        height: 100%;
    }
    .william_box .box__wrap .box.box_05 .text{
        width: 100%;
        text-align: center;
    }
    .william_box .box__wrap .btn_line{
        bottom: -18vw;
    }
    .william_box .box__wrap .sub{
        position: absolute;
        bottom: -5.3333vw;
        left: 6%;
        font-size: 1.8667vw !important;
        text-indent: -1.5vw;
        font-weight: 400;
    }


    .section__link {
        padding: 16vw 5.3333vw;
      }
      .section__link .inner {
        gap: 4vw;
        flex-direction: row;
        flex-wrap: wrap;
        padding: 0;
      }
      .section__link__item {
        display: flex;
        align-items: center;
        width: 100%;
        height: 44.5333333333vw;
        align-items: center;
      }
      .section__link__con {
        justify-content: flex-start;
        flex: none;
      }
      .section__link .logo {
        justify-content: center;
        width: 42vw;
        height: 100%;
      }
      .section__link .logo__glo {
        width: 21.3333333333vw;
      }
      .section__link .logo__glotry {
        width: 32vw;
      }
      .section__link .logo__kakao, .section__link .logo__insta {
        width: 18.6666666667vw;
      }
      .section__link__tit {
        font-size: 3.4666666667vw;
        margin-bottom: 1.3333vw;
      }
      .section__link__txt {
        margin-bottom: 4vw !important;
        font-size: 2.9333333333vw;

      }
      .section__link__btn {
        padding: 2.1333333333vw 0 1.6vw 3.2vw;
        width: 37.3333333333vw;
        height: 6.9333333333vw;
        font-size: 2.6666666667vw;
        background-size: 4.2667vw;
      }

    .consider_kv .text_wrap{
        position: absolute;
        width: 100%;
        top: 16vw;
        left: 0;
        transform: none;
        text-align: center;
    }
    .consider_main .text_wrap{
        position: absolute;
        top: 13.3333vw;
        left: 0;
        transform: none;
        width: 100%;
    }
    .consider_main .text_wrap h2, 
    .consider_main .text_wrap p{
        text-align: center;
    }
    .consider_main span{
        position: absolute;
        left: 5.3333vw;
        bottom: 5.3333vw;
        font-size: 1.8667vw;
        line-height: 1.4;
        text-indent: -1.2vw;
    }
}