﻿/* default */
body { background-color: #fff; cursor: default; font-family: Arial; font-size: 11px; margin: 0px; min-width: 1000px; width: 100%;}
a { text-decoration: none; outline: none; }
input:focus { outline: none; }
.aspNetDisabled { color: #999; }

/* textBox */
.textbox { border: solid 1px #d9d9d9; border-radius: 5px; box-shadow: inset 0px 0px 7px rgba(0, 0, 0, 0.1); color: #000; font-size: 14px; font-weight: bold; height: 30px; padding: 5px 7px; width: 334px; transition: border-color 0.5s linear 0s, box-shadow 0.5s linear 0s; }
.textbox:focus { border: solid 1px #fbcb09; box-shadow: inset 0px 0px 8px rgba(251, 203, 9, 0.25); }

/* button */
.button { border-radius: 5px; box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.15); color: #FFF; font-size: 14px; font-weight: bold; padding: 10px 20px; transition: box-shadow 0.3s; }

/* label */
.l_error { color: #F00; font-size: 11px; font-weight: bold; }
.l_title { color: #000; font-size: 14px; font-weight: bold; }
.l_text { color: #777; font-size: 11px; font-weight: normal; }

/* Checkbox */
.check_option { color: #777; font-size: 12px; font-weight: bold; }
.check_option input[type="checkbox"] { display: none; }
.check_option input[type="checkbox"] + label { background: url(../Images/check_inactive.png) no-repeat; cursor: pointer; transition: all 0.5s; }
.check_option input[type="checkbox"] + label span { padding: 0px 0px 0px 20px; }
.check_option input[type="checkbox"] + label div { color: #aaa; font-size: 10px; font-weight: normal; padding: 0px 0px 0px 20px; }
.check_option input[type="checkbox"]:checked + label { background: url(../Images/check_active.png) no-repeat; color: #00d1c1; }

/* Copy text */
.textbox-copy { background-color: #f9f9f9; border-radius: 4px; width: 340px; }
.textbox-copy .text { background-color: transparent; border: none !important; border-radius: 4px 0px 0px 4px; color: #000; font-size: 13px; font-weight: bold; height: 34px; padding: 0px 10px; width: 300px; }
.textbox-copy .btn-copy { background: #00e676 url(/images/copy.png) center no-repeat; border-radius: 0px 4px 4px 0px; cursor: pointer; height: 24px; padding: 5px 8px; width: 24px; }

/* Tooltip */
.tooltip { display: inline-block; position: relative; }
.tooltip .tooltiptext { visibility: hidden; width: 140px; background-color: #555; color: #fff; text-align: center; border-radius: 6px; padding: 5px; position: absolute; z-index: 1; bottom: 150%; left: 50%; margin-left: -75px; opacity: 0; transition: opacity 0.3s; }
.tooltip .tooltiptext::after { content: ""; position: absolute; top: 100%; left: 50%; margin-left: -5px; border-width: 5px; border-style: solid; border-color: #555 transparent transparent transparent; }
.tooltip:hover .tooltiptext { visibility: visible; opacity: 1; }

/* Background */
.bg-light:hover { background-color: #f9f9f9; }

/* Icon */
.icon-whatsapp { background: #00e676 url(../images/icon-whatsapp.png) center no-repeat; background-size: 24px 24px; border-radius: 7px; height: 36px; width: 36px; }

/* Header */
.header { background-color: #000; height: 65px; padding: 10px 0px; z-index: 10; }
.header .inner { margin: 0px auto; width: 100%; }
.header .inner .lang { float: left; padding: 0px 10px; }
.header .inner .lang .tx-title-b3 { color: #fff !important; }
.header .inner .name { background: url(../images/landbanc.jpg) no-repeat; background-size: contain; float: left; height: 50px; margin: 0px 0px 0px 10px; width: 140px; }
.header .inner .nav { float: right; padding: 10px 0px; }
.header .inner .nav .link { color: #fff; float: left; font-size: 14px; font-weight: bold; margin: 0px 5px; padding: 0px 5px; transition: all 0.5s; }
.header .inner .nav .link:hover { color: #fbcb09; }
.header .inner .nav .link.current { color: #fbcb09; }
.menu { background-color: #fff; border: solid 1px #e0e0e0; box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.25); display: none; position: absolute; top: 60px; right: 130px; width: 200px; z-index: 11; }
.menu .item { border-bottom: solid 1px #f5f5f5; color: #000; font-size: 12px; font-weight: bold; padding: 10px; transition: all 0.3s; }
.menu .item:hover { background-color: #fbcb09; }

/* content */
.content { }
.content .front .background { animation: kenBurns 10s ease; animation-iteration-count: 1; animation-fill-mode: forwards; background: url(../images/front00.jpg) no-repeat top; background-size: cover; bottom: 0; left: 0; max-height: 800px; overflow: hidden; position: absolute; right: 0; top: 0px; }
.content .front .detail { color: #fff; float: right; height: 360px; padding: 20px; position: absolute; top: 30px; width: 700px; }
.content .front .detail .title { border-bottom: solid 3px #fbcb09; font-size: 32px; font-weight: 600; line-height: 44px; margin: 50px 0px 20px 0px; padding: 0px 0px 20px 0px; text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5); }
.content .front .detail p { font-size: 16px; line-height: 20px; text-shadow: 2px 1px 1px #000; }
.content .front .detail ul li { font-size: 16px; line-height: 20px; text-shadow: 2px 1px 1px #000; }
.content .front .description { background-color: rgba(255, 255, 255, 0.99); color: #000; float: right; max-height: 800px; padding: 20px 20px 40px 20px; position: absolute; top: 0px; width: 350px; }
.content .front .description .title { border-bottom: solid 3px #fbcb09; font-size: 28px; font-weight: 600; line-height: 35px; margin: 10px 0px 20px 0px; padding: 0px 0px 20px 0px; }
.content .front .description p { font-size: 13px; line-height: 20px; }
.content .front .description .register { padding: 20px 0px 50px 0px; }
.content .front .description .register a { background-color: #000; border-radius: 5px; color: #fbcb09; font-size: 14px; font-weight: bold; padding: 10px 15px; }
.content .front .description .register a:hover { text-decoration: underline; }
.content .front .people { background-color: #fff; border-radius: 3px; bottom: 70px; left: 10%; min-width: 200px; padding: 5px 10px; position: absolute; }
.content .personal { background: #fff url(../images/bg-line.jpg) right no-repeat; background-size: cover; }
.content .personal .inner { margin: 0px auto; padding: 30px 0px 30px 0px; width: 95%; }
.content .view { box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.25); display: block; height: 400px; position: relative; overflow: hidden; z-index: 10; }
.content .view .view-background { animation: kenBurns 10s ease; animation-iteration-count: 1; animation-fill-mode: forwards; background: url(../images/front00.jpg) no-repeat top; background-size: cover; bottom: 0; left: 0; max-height: 800px; max-width: 100%; overflow: hidden; position: absolute; right: 0; top: 0px; }
.content .view-description { color: #000; margin: 0px auto; padding: 30px 0px; width: 95%; }
.content .view-description .desc-image { height: 350px; width: 350px; }
.content .view-description .title { border-bottom: solid 3px #fbcb09; font-size: 28px; font-weight: 600; line-height: 35px; margin: 10px 0px 20px 0px; padding: 0px 0px 20px 0px; }
.content .view-description .desc-text { font-size: 13px; line-height: 20px; }
.content .view-description .register { padding: 20px 0px 50px 0px; }
.content .view-description .register a { background-color: #000; border-radius: 5px; color: #fbcb09; font-size: 14px; font-weight: bold; padding: 10px 15px; }
.content .view-description .register a:hover { text-decoration: underline; }
.content .view-people { background-color: #fbcb09; border: solid 2px #000; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.15); min-height: 60px; min-width: 200px; padding: 10px 20px; position: absolute; left: 0px; top: 315px; }
.content .view-people div, .content .view-people span { color: #000; }
.content .extra-info { background-color: #f5f5f5; }
.content .extra-info .extra-info-inner { margin: 0px auto; padding: 50px 0px 30px 0px; width: 95%; }
.content .extra-info .extra-info-inner.more { padding: 30px 0px; }
.content .extra-info .extra-info-inner .dropdown { border: solid 1px #d9d9d9; border-radius: 5px; box-shadow: inset 0px 0px 7px rgba(0, 0, 0, 0.1); color: #000; font-size: 16px; font-weight: bold; height: 46px; padding: 10px 15px; transition: all 0.5s; width: calc(100% - 10px); }
.content .extra-info .extra-info-inner .dropdown:focus { border: solid 1px #fbcb09; box-shadow: inset 0px 0px 8px rgba(251, 203, 9, 0.25); }
.content .extra-info .extra-info-inner .dropdown-small { background-color: #ececec; border: 0px; border-radius: 5px; color: #000; font-size: 13px; font-weight: bold; height: 40px; padding: 10px 15px; width: 200px; }
.content .extra-info .extra-info-inner .dropdown-tiny { background-color: #ececec; border: 0px; border-radius: 5px; color: #000; font-size: 13px; font-weight: bold; height: 40px; padding: 10px 15px; width: 150px; }
.content .extra-info .extra-info-inner .textbox { border: solid 1px #d9d9d9; border-radius: 5px; box-shadow: inset 0px 0px 7px rgba(0, 0, 0, 0.1); color: #000; font-size: 16px; font-weight: bold; height: 24px; padding: 10px 15px; width: calc(100% - 40px); transition: border-color 0.5s linear 0s, box-shadow 0.5s linear 0s; }
.content .extra-info .extra-info-inner .textbox:focus { border: solid 1px #fbcb09; box-shadow: inset 0px 0px 8px rgba(251, 203, 9, 0.25); }
.content .extra-info .extra-info-inner .button { background-color: #fbcb09; border: solid 2px #fbcb09; color: #000; font-size: 18px; font-weight: bold; text-align: center; transition: all 0.3s; }
.content .category { background-color: #fff; margin: 0px auto; }
.content .category.fixed { position: fixed; left: 0px; top: -500px; right: 0px; }
.content .category .cat-header { color: #000; font-size: 28px; font-weight: bold; padding: 50px 0px; text-align: center; }
.content .category .cat-header .round { background-color: #fbcb09; border: solid 2px #000; border-radius: 3px; color: #000; font-size: 28px; font-weight: bold; padding: 15px 30px; text-align: center; }
.content .category .cat-header .color { color: #fbcb09; }
.content .category .cat-box { cursor: pointer; height: 450px; transition: all 0.3s; }
.content .category .cat-box:hover { box-shadow: inset 0px 0px 100px rgba(251, 203, 9, 0.9); }
.content .category .cat-box:hover .cat-title-box .cat-title { background-color: rgba(0, 0, 0, 0.85); color: #fbcb09; }
.content .category .cat-box.selected .cat-title-box .cat-title { background-color: #fbcb09; color: #000; }
.content .category .cat-box.cat-01 { background: url(../images/side01.jpg) no-repeat center; background-size: cover; }
.content .category .cat-box.cat-02 { background: url(../images/side02.jpg) no-repeat center; background-size: cover; }
.content .category .cat-box.cat-03 { background: url(../images/side03.jpg) no-repeat center; background-size: cover; }
.content .category .cat-box.cat-04 { background: url(../images/side04.jpg) no-repeat center; background-size: cover; }
.content .category .cat-box.cat-05 { background: url(../images/side05.jpg) no-repeat center; background-size: cover; }
.content .category .cat-box .cat-title-box { padding: 368px 0px 0px 0px; transition: all 0.3s; }
.content .category .cat-box .cat-title-box .cat-title { background-color: rgba(0, 0, 0, 0.25); color: #fff; font-size: 18px; font-weight: bold; padding: 20px; text-align: center; transition: all 0.3s; }
.content .offer { background-color: #f9f9f9; margin: 0px auto; }
.content .offer .offer-desc { }
.content .offer .offer-image { background: url(../images/site01.jpg) no-repeat center; background-size: cover; height: 400px; }
.content .info { }
.content .info.gap { padding-top: 580px; }
.content .info.color { background-color: #f9f9f9; }
.content .info .inner { margin: 0px auto; width: 95%; }
.content .info .container { margin: 20px; }
.content .info .container .title { color: #000; font-size: 28px; font-weight: bold; margin-bottom: 5px; }
.content .info .container .text { color: #777; font-size: 18px; line-height: 22px; }
.content .info .itembox { padding: 10px 0px 30px 0px; }
.content .info .itembox .container { margin: 20px 20px 30px 0px; }
.content .info .itembox .container .title { color: #000; font-size: 24px; font-weight: bold; margin-bottom: 5px; }
.content .info .itembox .padding { width: 30px; }
.content .info .itembox .item-header { color: #000; font-size: 28px; font-weight: bold; padding: 50px 0px; transition: all 0.3s; }
.content .info .itembox .item-header:hover { color: #fbcb09; }
.content .info .itembox .item { border-bottom: solid 1px #d9d9d9; border-radius: 3px; margin: 4px 4px 30px 4px; transition: all 0.3s; }
.content .info .itembox .item .item-banner { background-color: #fbcb09; color: #000; font-size: 13px; font-weight: bold; padding: 5px; text-align: center; }
.content .info .itembox .item .item_image { height: 200px; }
.content .info .itembox .item .item_image img { height: 180px; object-fit: cover; width: 300px; }
.content .info .itembox .item .item_title { color: #000; font-size: 15px; padding: 0px 5px; transition: all 0.3s; }
.content .info .itembox .item .item_desc { color: #515151; font-size: 13px; line-height: 18px; }
.content .info .itembox .item .item_title a b { color: #000; text-decoration: underline; }
.content .info .itembox .item .item_title a:hover b { color: #fbcb09; }
.content .info .itembox .view-all { background-color: #f9f9f9; color: #000; font-size: 18px; font-weight: bold; padding: 20px; transition: all 0.3s; }
.content .info .itembox .view-all:hover { color: #fbcb09; }
.content .more-info { background-color: #fff; margin: 0px auto; }
.content .more-info .more-info-desc { color: #000; font-size: 24px; font-weight: bold; padding: 50px 0px; text-align: center; }
.content .more-info .more-info-desc .button { background-color: #fbcb09; border: solid 2px #fbcb09; color: #000; font-size: 18px; font-weight: bold; text-align: center; width: 100px; transition: all 0.3s; }
.content .choose { margin: 20px auto; }
.content .choose .choose-item { margin: 0px auto; }
.content .choose .choose-item .title { background-color: #fbcb09; border: solid 3px #000; border-radius: 3px; color: #000; cursor: pointer; font-size: 28px; font-weight: bold; height: 130px; text-align: center; transition: all 0.5s; width: 350px; }
.content .choose .choose-item .title .title-inner { padding: 30px; transition: all 0.3s; }

.content .info .itembox .gallery-item { background-color: #f5f5f5; border-radius: 3px; float: left; margin: 4px 4px 30px 4px; max-width: 350px; transition: all 0.3s; width: calc((100% - 60px) / 4); }
.content .info .itembox .gallery-item .item_image { height: 200px; }
.content .info .itembox .gallery-item .item_image img { height: 200px; object-fit: contain; width: 100%; }

.all { margin: 0px auto; min-height: 550px; width: 95%; }
.all .navigation { height: 100px; margin-top: 50px; }
.all .box { float: left; height: 230px; margin: 0px 20px 20px 0px; width: 230px; }
.all .box.box-01 { background: url(../images/site01.jpg) no-repeat center; background-size: cover; }
.all .box.box-02 { background: url(../images/site02.jpg) no-repeat center; background-size: cover; }
.all .box.box-03 { background: url(../images/site03.jpg) no-repeat center; background-size: cover; }
.all .box.box-04 { background: url(../images/site04.jpg) no-repeat center; background-size: cover; }
.all .box.box-05 { background: url(../images/site05.jpg) no-repeat center; background-size: cover; }
.all .box.box-06 { background: url(../images/site06.jpg) no-repeat center; background-size: cover; }
.all .box.box-07 { background: url(../images/side03.jpg) no-repeat center; background-size: cover; }
.all .box .title { background-color: rgba(0, 0, 0, 0.3); color: #fff; cursor: pointer; font-size: 18px; font-weight: bold; height: 170px; padding: 30px 25px; transition: all 0.5s; }
.all .box .title:hover { background-color: #fbcb09; }
.find-me { position: fixed; right: 0px; top: calc(50% - 250px); width: 80px; z-index: 99; }
.find-me .register { background-color: #fbcb09; color: #000; font-size: 20px; font-weight: bold; height: 80px; padding: 15px 30px;; text-orientation: mixed; writing-mode: vertical-lr; width: 50px; }
.find-me .email { background: #cb0c13 url(../images/icon-email.png) center no-repeat; height: 80px; width: 80px; }
.find-me .phone { background: #178bf4 url(../images/icon-phone.png) center no-repeat; height: 80px; width: 80px; }
.find-me .wechat { background: #2dc100 url(../images/icon-wechat.png) center no-repeat; height: 80px; width: 80px; }
.find-me .whatsapp { background: #00e676 url(../images/icon-whatsapp.png) center no-repeat; height: 80px; width: 80px; }
.find-me .lang-cn { background: url(../images/cn.png) center no-repeat; background-size: cover; height: 53px; width: 80px; }
.find-me .lang-en { background: url(../images/en.png) center no-repeat; background-size: cover; height: 53px; width: 80px; }
.find-me .lang-jp { background: url(../images/jp.png) center no-repeat; background-size: cover; height: 53px; width: 80px; }
.find-me .lang-kr { background: url(../images/kr.png) center no-repeat; background-size: cover; height: 53px; width: 80px; }
.content .front { box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.25); display: block; height: 500px; position: relative; overflow: hidden; z-index: 10; }
.maps { }
.maps .contact { background-color: rgba(255, 255, 255, 0.98); border-radius: 5px; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.25); color: #777; float: right; font-size: 12px; line-height: 18px; padding: 20px; position: absolute; top: 150px; width: 300px; z-index: 10; }
.maps .contact .title { color: #fbcb09; font-size: 18px; font-weight: bold; margin-bottom: 5px; }
.maps .contact .desc { color: #515151; font-size: 12px; font-weight: normal; }
.maps .contact b { color: #000; }
.maps .contact a { color: #777; transition: all 0.3s; }
.maps .contact td { padding: 0px 10px 5px 0px; }
.maps .contact a:hover { color: #006da7; text-decoration: underline; }
.pager { background-color: #f5f5f5; border-radius: 3px; bottom: 20px; color: #777; font-size: 12px; padding: 7px 10px; position: fixed; right: 30px; transition: all 0.3s; }

/* Footer */
.footer { background-color: #f3f3f3; color: #000; font-size: 13px; }
.footer.blank { background-color: #fff; }
.footer .inner { margin: 0px auto; width: 95%; }
.footer .container { padding: 25px; }
.footer .container .left { float: left; }
.footer .container .right { float: right; }

/* Modal Popup */
.modalBackground { background-color: #fff; filter: alpha(opacity=90); opacity: 0.9; box-shadow: inset 0px 0px 200px rgba(0, 0, 0, 0.25); }
.modal { width: 500px; }
.modalset { width: 600px; }
.modallist { width: 700px; }
.modalview { width: 900px; }
.modaledit { width: 650px; }
.modalBorder { background-color: #fff; box-shadow: 0px 7px 25px rgba(0, 0, 0, 0.3) !important; min-width: 550px; padding: 0px 10px; }
.modalBorder.mobile { min-width: 90%; width: 90%; }
.modalBanner { color: #000; font-size: 18px; font-weight: bold; margin-bottom: 10px; padding: 18px 25px; }
.modalContent { color: #777; font-size: 12px; max-height: 450px; overflow: auto; padding: 10px 30px 40px 30px; }

/* others */
.clear:after { clear: both; content: "."; display: block; font-size: 0; height: 0; line-height: 0; visibility: hidden; }
.fleft { float: left; }
.fright { float: right; }
.hidden { display: none; }
.invisible { opacity: 0; }
.mg-auto { margin: 0px auto; }
.textleft { text-align: left; }
.textcenter { text-align: center; }
.textright { text-align: right; }
.textupper { text-transform: uppercase; }

@keyframes kenBurns { from { transform: scale(1); } to { transform: scale(1.1); } }