@import url(/assets/fonts/paperlogy/Paperlogy.css);
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Noto+Sans:ital,wght@0,100..900;1,100..900&display=swap');
@import url(/assets/libs/remixicon/remixicon.css);

:root {
  --text-weight-normal : 400;
  --text-weight-semibold : 600;
  --text-weight-bold : 700;
  --text-weight-black : 900;

  --White: #ffffff;
  --Gray_01 : #E0E0E0;

  --text-shadow_black: 2px 2px 10px #111111; 
  --text-shadow_white: 2px 2px 10px #f1f1f1; 

  --signature-svg : url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="none" viewBox="0 0 1000 100" ><g fill="%23FFFFFF"><rect fill="%23f8f8f8" width="100%" height="100%"/><path d="M 0 0 v 100 S 0 4 500 4 s 500 96 500 96 V 0 H 0 Z"></path></g></svg>');
}
a, a:link, a:visited, a:hover, a:active, .uk-link {text-decoration: none; color: #333;}

.only-mobile, .ui-disabled {display: none;}
.ui-designkorea-signature {background-image:var(--signature-svg);  background-size: 100% 100%; font-size: 32px; font-weight: 700;text-align: center; transition-duration: .15s;}
.ui-designkorea-signature.ui-reverse {transform: rotateX(180deg);}
.ui-footer.ui-designkorea-signature {background-image: var(--signature-svg-black);padding-left: 0}

.ui-border-radius {border-radius: 0 0 50px 50px; overflow: hidden;}
.ui-border-radius.ui-small {border-radius: 20px;}
.ui-glass {border : 2px solid rgba(255, 255, 255, 0.3); background: rgba(255, 255, 255, 0.1); backdrop-filter: blur(2px); box-sizing: border-box; height: auto;}
.ui-fade-out-edge-bottom {-webkit-mask-image: linear-gradient(to bottom, black 70%, transparent 100%); mask-image: linear-gradient(to bottom, black 70%, transparent 100%);}
.ui-fade-out-edge-top {-webkit-mask-image: linear-gradient(to top, black 70%, transparent 100%); mask-image: linear-gradient(to top, black 70%, transparent 100%);}


.ui-main .ui-dot.ui-pop {border-radius: 0; z-index:0;}
.ui-jumbo {position:absolute; top:40%; left: 50%; transform: translate(-50%, 0); margin: 0;}
.ui-jumbo {font-size: 60px; font-weight: var(--text-weight-black); color: #fff;z-index:2}
.ui-head_medium {font-size: 32px; color: #fff; font-weight: var(--text-weight-black);z-index:1; text-align: center;cursor: pointer;}
.ui-head_medium small {font-size: 60%;}
.ui-nation {display: flex; justify-content: center; align-items: center; }
.ui-nation .ui-glass {padding: 30px;border-radius: 20px;}
.ui-nation .ui-glass i {font-weight: var(--text-weight-normal);}

.ui-hero .ui-header {position:relative;}
.ui-hero .ui-body {padding: 20px 25px; background-color: var(--Gray_01);}
.ui-body p {margin: 0;}
.ui-hero .ui-title {position: absolute; top: 300px; left: 40px; transform: translateY(-70%); margin:0; }
.ui-hero .ui-title {font-size: 54px; font-weight: var(--text-weight-black); color: var(--White); text-shadow: var(--text-shadow_black);transition:  all .1s ease-out; }
.ui-hero .ui-subtitle {font-size: 14px; line-height: 1.6;display: block;margin-bottom: 10px; font-weight: var(--text-weight-semibold);}
.ui-info {position: absolute; bottom: 0;width: 100%; color: var(--White); line-height: 1.3;}
.ui-hero .ui-info {border-top-left-radius:0; border-top-right-radius:0;}
.ui-hero .ui-info dl {text-shadow: var(--text-shadow-black);font-size: 1.4rem}
.ui-hero .ui-info dt {font-size: 1.3rem; margin-top: 7px; font-weight: var(--text-weight-normal); }
.ui-hero .ui-info dd {font-weight: var(--text-weight-semibold);}
.ui-hero .ui-info .ui-glass {border:0; padding: 50px 40px 30px;}

.ui-hero .ui-glass {position: absolute; width: 100%; height: 100%; border-radius: 30px; overflow: hidden; backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(3px); top:0; left:0; }

.ui-hero .ui-glass  {display: flex; justify-content: center; align-items: center; font-size: 36px; color: #fff; font-weight: 900;text-shadow: 1px 1px 3px rgba(0,0,0,0.5);}

.ui-hero h1 {font-weight: var(--text-weight-black);font-size: 40px; }

.ui-key {font-size: 15px;}
.ui-key-img img {border-radius: 10px; overflow: hidden;}

.ui-card {position:relative;margin-bottom: 80px; }
.ui-card-body {position: relative;border-radius: 50px;border: 1px solid #f2f2f2;padding: 5px; background-color: #fff; box-shadow: 3px 3px 10px rgba(0,0,0,0.1), -3px -3px 10px rgba(255,255,255,0.5);}
.ui-card .ui-card-body .ui-card-logo {box-sizing: border-box; border: 2px solid #fff; border-radius: 50px; background: #fff;}
.ui-card .ui-card-body .ui-card-logo {position: absolute; top: -30px; left: 50%; transform: translateX(-50%); padding: 10px 20px;transition: transform .2s ease-in-out;}
.ui-card .ui-brand_cover {border-radius: 45px;transition: all .1s ease;box-shadow: 0 1px 10px rgba(0,0,0,0.25); }
.ui-card .ui-card-content {position: relative; border-radius: 45px; background-color: #f5f5f5;}

.ui-card .ui-card-body .ui-card-sns {padding: 30px 20px 20px ;transition: transform .2s ease-in-out;}
.ui-card-sns {display:flex; justify-content: center; align-items: center; border-radius: 50px; gap: 12px;}
.ui-card-sns i {font-size: 32px;color: #333;}
.ui-card-sns i {filter: drop-shadow(3px 3px 9px rgba(0,0,0,0.3))}

.ui-brand-wrap {overflow:hidden;position: relative;box-shadow:  1px 1px 20px rgba(0,0,0,0.1);}
.ui-brand-main {transition: all .3s ease;}
.ui-brand {position: absolute; display: flex; justify-content: center;align-items: center; top: 50%; left: 50%; transform: translate(-50%, -50%) ;padding: 20px 40px;text-shadow: 1px 2px 7px #000;}
.ui-brand.ui-glass {border-radius: 100px; font-size: 30px; color: #fff;font-weight: var(--text-weight-black); backdrop-filter: blur(3px); min-width: 200px;}
.ui-dot {position: absolute; top: 0; left:0; right: 0; bottom: 0; transition: all .2s ease-in-out; display: none;}

.ui-brand-wrap:hover .ui-dot {display: block; background-image: url(/assets/images/common/bg_dot.png);}
.ui-brand-wrap:hover .ui-brand-main {transform: scale(1.05) rotate(.5deg);}

.ui-hosted small {font-size: 11px;}
.ui-hosted .ui-title {font-size: 16px; font-weight: 700;margin-top:0;}
.ui-hosted .ui-title::after {content:''; display: block;width: 120px;height:3px;background-color: #333;margin: 10px 0;}
.ui-hosted .ui-desc {font-size: 13px;}

.ui-footer {color: #fcfcfc;font-size: 14px; ;}
.ui-footer-header {font-size: 16px; font-weight: var(--text-weight-semibold);}

.ui-parallax {background-image: url('/assets/images/common/bg_jp.jpg');}
.ui-parallax p {color: #fff; }
.ui-parallax p:last-child {font-size: 18px;}
.ui-parallax .ui-dot, .ui-dot.ui-cover {background-image: url('/assets/images/common/bg_dot.png');display: block;}


.ui-header .ui-info2.ui-glass {width: auto; border-radius: 20px;}
.ui-header .ui-info2 img   {filter: drop-shadow(6px 6px 18px rgba(255,255,255,0.5)); width: 50%;}
.ui-header .ui-info2 .ui-sns {display: flex; justify-content: flex-end; align-items: center; gap:12px; }
.ui-header .ui-info2 .ui-sns i {font-size: 28px; font-weight: 500; color: #fff;}

.ui-text-container {border-radius: 20px;}

.ui-cover-container {padding-bottom: 50px;}
.ui-cover {position: relative;max-width: 1600px; max-height: 900px; padding-bottom: 56.25%;border-radius: 20px; transition: all .15s;}
.ui-dot.ui-pop {background-image: url(/assets/images/common/bg_dot.png);display: block;border-radius:20px;}

.ui-cover-container .ui-info2 {position: absolute; bottom: 3vw; left: 3vw; padding: 30px; border-radius: 18px; width: 40vw; max-width: 500px;transition: all .15s ease;}
.ui-cover-container .ui-info2 {backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px);background-color: rgba(255, 255, 255, 0.4); box-shadow: 2px 5px 15px rgba(0, 0, 0, 0.2);}
.ui-cover-container .ui-info2 .ui-title {color: #111; margin: 0 0 10px 0; font-size: 30px; font-weight:900;}
.ui-cover-container .ui-info2 .ui-sns {display: flex; justify-content: flex-start; align-items: center; gap: 12px; font-size: 28px; }
.ui-cover-container .ui-info2 .ui-title, .ui-cover-container .ui-info2 .ui-sns a {color: #000;}

.ui-item .ui-title {font-weight: var(--text-weight-black);font-size:40px;}
.ui-item .ui-option {color: #999;}

.ui-item .ui-title, .ui-item .ui-option, .ui-item .ui-picture {text-align: center;}
.btn-list {font-weight:var(--text-weight-black); padding: 12px 40px;letter-spacing: 1.2px;font-size: 16px;}


.ui-hosted-logo {margin-bottom: 12px;}
.ui-flag-top {display: flex; gap: 12px; justify-content: flex-end; color:#303030;}
.ui-flag-top > a {display: flex; justify-content: center; align-items: center;gap:16px;}
.ui-flag-top > a:hover {color:#8d8f95;}
.ui-flag-top i {font-size: 25px;}
.ui-flag-top .uk-dropdown {box-shadow: none;padding:0;}
.ui-flag-top .uk-dropdown li {border: 1px solid #dcdddf;margin:0;padding: 10px 15px; display: block; position: relative;}
.ui-flag-top .uk-dropdown li:last-child {border-top: 0;}
.ui-flag-top .uk-dropdown li:not(.ui-active):hover {background-color:#dcdddf ;}

.ui-flag-top .uk-dropdown li.ui-active::after {position: absolute; right: 10px; top: 50%; transform: translateY(-50%); font-size: 24px;}
.ui-flag-top .uk-dropdown li.ui-active::after {content: "\eb7b" ;font-family: 'remixicon'; font-weight: 400; line-height: 1; text-transform: none;}

.ui-lang {cursor: pointer; color: #303030;}
.ui-lang.ui-active {cursor: default;color:#8d8f95;}

.ui-main .ui-flag img {width: 48px;border-radius: 20px;}

.ui-footer-header {font-size: 20px;}
.ui-footer .ui-sns a {color: #222; display: block;font-size: 16px;line-height: 1.6; display: flex; align-items: center;}
.ui-footer .ui-sns a i {font-size: 24px; margin-right: 16px;}
.ui-footer .ui-logo {max-width: 400px;}

.ui-fr .ui-dot.ui-pop { backdrop-filter: blur(1.5px); box-sizing: border-box; height: auto;}
.ui-fr .ui-nation .ui-glass {backdrop-filter: blur(1px);}
.ui-fr .ui-head_medium, .ui-fr .ui-flag img {opacity: 0.5;}
.ui-nation .ui-fr {text-shadow: 0px 0px 6px rgba(255,255,255,0.5); cursor:default;}
@media (max-width: 1650px) {
  .ui-brand.ui-glass {font-size: 24px;}
  .ui-brand {padding: 15px 30px}
}
@media (max-width: 1200px) {
  .ui-hero .ui-title {top: 20vw;font-size: 3.4722vw;left:2.7778vw;}
  .ui-hero .ui-info dl {font-size: 24px;}
  .ui-hero .ui-info dt {font-size: 18px;}
  .ui-hero .ui-info .ui-glass {border:0; padding: 2.7778vw;}
  .ui-brand {padding: 12px 32px;}
  .ui-brand.ui-glass {font-size: 22px;}
  
}
@media (max-width: 960px) {
  .ui-hero .ui-info dl {font-size: 20px;}
  .ui-hero .ui-info dt {font-size: 14px;}
  .ui-designkorea-signature>div {font-size: 2.7083vw;}
  .ui-brand {padding: 6px 12px;}
  .ui-brand.ui-glass {font-size: 20px;}
  .ui-header .ui-info2 .ui-sns {justify-content: flex-start; }
  
.ui-footer .ui-logo {width:50vw;}
.ui-hosted-logo {margin-bottom: 6px;}
.ui-hero .ui-glass  {font-size: 3.3333vw;align-items: start; padding-top: 25vw;}
.ui-key {margin-bottom: 50px;}

}

@media (max-width: 640px) {
  .only-mobile {display: block;}
  .ui-hero .ui-header > img {content: url(/assets/images/common/m_bg_jp.jpg);}
  .ui-hero p {font-size: 14px;}
  .ui-hero .ui-title {top: 35vw;font-size: 7.5vw;left:20px;}
  .ui-hero .ui-info dl {font-size: 4.1vw;}
  .ui-hero .ui-info dt {font-size: 3.8889vw;}
  .ui-hero .ui-info .ui-glass {border:0; padding: 40px 0 40px 20px;}
  .ui-key {font-size: 13px;}
  
  .ui-designkorea-signature {padding-top: 30px; padding-bottom: 30px;}
  .ui-card-sns i {font-size: 9.6667vw;}
  .ui-designkorea-signature>div {font-size: 4.2875vw;}

  .ui-footer {font-size: 12px;line-height: 1.5;}
  .ui-hosted .ui-title {letter-spacing: -0.4px;}
  .ui-hosted .ui-desc {font-size: 12px;}
  .ui-parallax {background-image: url('/assets/images/common/bg_jp_3.jpg');background-position: center center;}

  .ui-cover {padding-bottom: 70%;}
  
.ui-cover-container {padding-bottom: 25vw;}
.ui-cover-container .ui-info2 {bottom: -15vw; width: 40vw; padding: 12px 21px;}
.ui-cover-container .ui-info2 .ui-title {font-size: 24px;margin-bottom: 5px;}
.ui-cover-container .ui-info2 .ui-sns {font-size: 20px;margin-top: 5px !important;}

.ui-hosted-logo {margin-bottom: 3px;}

*+.uk-grid-margin, .uk-grid+.uk-grid, .uk-grid>.uk-grid-margin {margin-top:0;}
.ui-item .ui-title {font-size:30px; letter-spacing: -0.4px;}
.ui-head_medium {font-size: 26px;}
.ui-main .uk-grid>div {min-height: 50vh !important}
.ui-main .ui-jumbo {font-size: 30px;}
.ui-nation .ui-glass {padding: 16px;}

.ui-main .uk-grid > div:first-child {margin:0;}
/* .uk-grid > div:first-child {margin-bottom: 50px;} */
.ui-flag img {width: 28px; cursor: pointer;}

.ui-main .ui-nation > div:last-child { width: 97%;}
.ui-text-container {font-size: 14px;line-height: 1.6;}

.ui-hero .ui-glass  {font-size: 7vw;align-items: center; padding-top:0;}
}

@media (max-width: 360px) {  
  .ui-hero h1 {font-size: 36px;}
  .ui-hero dl {font-size: 14px}
}