/*******************************************************
 * common
 *******************************************************/

.bg-image{background-position: center;background-repeat: no-repeat;background-size: cover;}
.content-body{padding:0 1rem;}

body .swiper-button-prev{width:60px;height:60px;background:#333;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all 0.3s ease;position: relative;left: 0;top: 0;margin-top: 0;}
body .swiper-button-next{width:60px;height:60px;background:#333;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all 0.3s ease;position: relative;right: 0;top: 0;margin-top: 0;}
body .swiper-button-prev:hover,body .swiper-button-next:hover{background:#ff6b35;}
body .swiper-button-prev i,body .swiper-button-next i{color:#fff;font-size:24px;}
body .swiper-button-prev:after,body .swiper-button-next:after{display:none;}
body .swiper-pagination-bullets{display:flex;gap:10px;}
body .swiper-pagination-bullet{width:12px;height:12px;opacity:1;border-radius:3px;background: var(--gray-200);}
body .swiper-pagination-bullet-active{background:var(--primary);}
body .swiper-nav{display: flex;align-items: center;gap: 10px;}

@media (max-width:1024px) {
    body .swiper-button-prev{width:40px;height:40px;}
    body .swiper-button-next{width:40px;height:40px;}
    body .swiper-button-prev i, body .swiper-button-next i{font-size: 1rem;}
}

/* main  */
.main-sec .container {z-index: 1;}
.sec-title{position: relative;z-index: 2;}
body .sec-title h2{font-weight:700;text-align:left;line-height:1.3;color:#2B2B2B;}

/* button  */
.btn.submit-btn {  position: relative; z-index: 1; transform: translateZ(0);width: 180px; height: 60px; background: var(--variant); border: 0; position: relative; border-radius: 100px; color: #fff; cursor: pointer; overflow: hidden; display: flex; justify-content: center; align-items: center; text-decoration: none; }
.btn.submit-btn .text { position: relative; z-index: 2; }
.btn.submit-btn .icon-container { position: relative; z-index: 2; width: 25px; height: 25px; margin-left: 10px; transition: transform 500ms ease; }
.btn.submit-btn .icon-container .icon { position: absolute; left: 0; top: 0; width: 25px; height: 25px; transition: transform 500ms ease, opacity 250ms ease; display: flex; justify-content: center; align-items: center; }
.btn.submit-btn .icon-container .icon i { color: #fff; font-size: 20px; }
/*.btn.submit-btn::after { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: var(--primary); border-radius: 100px; z-index: 1; transition: transform 500ms ease; }*/
.btn.submit-btn:hover::after { transform: translateX(65%); }
.btn.submit-btn:hover .icon-container { transform: translateX(125%); }

.btn.submit-btn.white-type{background: rgba(255, 255, 255, 0.6) !important;color:black;}
.btn.submit-btn.white-type .icon-container .icon i { color: #000;}
.btn.submit-btn.white-type::after{background: rgba(255, 255, 255, 0.7);}
.btn.submit-btn.white-type:hover::after{background: rgba(255, 255, 255, 1);}


/*******************************************************
 * sec 01
 *******************************************************/
#section1 {padding:0 !important; position: relative;width:100%;height:100vh;overflow:visible;}

#sec01_sli{height:100%;width:100%;margin: 0 auto;}
#sec01_sli .sec01_sli{min-height: 100vh; height:100%; background-position:70% 50%; background-size:cover; background-repeat:no-repeat;padding: 100px 20px 120px;display:flex; justify-content:center; align-items:center; }

#sec01_sli .sec01_sli:before {content: '';position: absolute;z-index: 1;top: 0;bottom: 0;left: 0;right: 0;background-position: center;background-repeat: no-repeat;width: 100%;height: 100%;background-size: cover !important;transform: scale(1.08, 1.08);transition: transform 7s ease-in-out;}
#sec01_sli .sec01_sli.swiper-slide-active:before{transform: scale(1.0,1.0) rotate(0.002deg);}

.sec01_sli.sli_01:before{background-image: url("../img/main/main01-01.jpg");}
.sec01_sli.sli_02:before{background-image: url("../img/main/main01-02.jpg");}
.sec01_sli.sli_03:before{background-image: url("../img/main/main01-03.jpg");}
.sec01_sli.sli_04:before{background-image: url("../img/main/main01-04.jpg");}

#sec01_page{display:flex;align-items:center;}
body #sec01_sli .swiper-pagination-bullet {width:5px;height:5px;background: rgba(255,255,255,0.8);border-radius:0;position: relative;overflow: hidden;transition: 0.2s;}
body #sec01_sli .swiper-pagination-bullet-active {width:150px;height:3px;border-radius: 0;background: rgba(255,255,255,0.6);}
.swiper-progress {position: absolute;left: 0;top: 0;height: 100%;background:#b21f3a;width: 0;}

#sec01_sli .text-box{width: 100%;text-align:left;position: absolute; z-index: 1; top: 0; bottom: 0; left: 0; right: 0;display: flex;justify-content: center;flex-flow: column;}
#sec01_sli .display-lg{font-weight:800;font-family:'El Messiri';line-height: 1;}
#sec01_sli .text-box h5{color:rgba(255,255,255,0.9);font-weight:400;}

.main-search { width: 100%; max-width: 1000px; }
.main-search input { color: #fff; font-size: 1.5rem; background: rgba(46, 49, 55, 0.4); border: 1px solid #BDBDBD; width: 100%; height: 80px; border-radius:var(--border-radius); padding: 1rem 5rem 1rem 2rem; display: flex; align-items: center; line-height: 80px; transition: background 0.3s ease, border-color 0.3s ease; box-sizing: border-box; }
.main-search input::placeholder { font-size: 1.5rem; color: rgba(255, 255, 255, 0.53); font-weight: 400; line-height: normal; vertical-align: middle; }
.main-search input:focus { background: rgba(0, 0, 0, 0.4); border-color: var(--primary); outline: none; }
.main-search input:focus::placeholder { color: rgba(255, 255, 255, 0.25); transition: color 0.3s ease; }
.main-search .search_container{ position: relative; width: 100%; }
.main-search .search-con {font-size:3rem;  position: absolute; right: 1.5rem; top: 50%; transform: translateY(-50%); background: none; border: none; cursor: pointer; color: #fff; display: flex; align-items: center; padding: 0.5rem; transition:0.3s ease;}
.main-search .search-con:hover { color: var(--primary); transition:0.3s ease; }

.scroll-line {position: absolute;left: 50%;bottom: 0;transform: translateX(-50%);display: flex;align-items: center;flex-direction: column;z-index:100;justify-content: center;transition: opacity 0.3s;opacity: 0;animation: scrollopc 0.9s 1s forwards;}
.scroll-line p {font-size:0.85rem;color: #fff;margin-bottom: 0.5rem;}
.scroll-line .line {position: relative;width: 0.1rem;height: clamp(4rem, calc(1.8vw + 3.5rem), 8rem);background-color: rgba(255, 255, 255, 0.7);overflow: hidden;z-index:100;}
.scroll-line .line::before {content: '';position: absolute;left: 0;top: 0;width: 0.2rem;height: clamp(1rem, 1.2944983819vw + 0.5145631068rem, 3rem);background-color: #fff;animation: scrolldown 2s ease-in infinite;}
@keyframes scrollopc { 0% {opacity: 0;} 100% {opacity: 1;} }
@keyframes scrolldown { 0% {top: -20%;} 100% {top: 120%;} }


/*******************************************************
 * sec 02
 *******************************************************/
#section2{background:var(--primary-hover);position: relative;}

.sec02-bg-text-wrap {position: absolute;bottom:-80px;left: 0;width: 100%;overflow: hidden;display: flex;line-height: 1;}
.sec02-bg-text-wrap span {font-size:18.75rem;color: rgba(255, 255, 255, 0.2);font-weight: 800;font-family: 'El Messiri';line-height: 1;white-space: nowrap;flex-shrink: 0;animation: marquee 60s linear infinite;}
@keyframes marquee { 0%   { transform: translateX(0%); } 100% { transform: translateX(-100%); } }


/* tab style */
.main-tab-wrap{display:inline-flex;gap:8px; }
.main-tab {background:var(--variant-hover); border-radius:4px;padding:6px 1rem; cursor: pointer;font-size:1rem; color:#6F6F6F;font-weight: 500; position: relative; text-align: center;text-transform: capitalize; transition:.15s ease; z-index: 50;flex: 0 0 auto; display: flex;align-items: center;justify-content: center;}
.main-tab a{ color:var(--text-color);padding:0.813rem 1.2rem; width:100%;height:100%;display: flex; align-items: center; justify-content: center;word-break: keep-all;}
.main-tab.active{pointer-events: none;}
.main-tab.active, .main-tab:hover {background:#2B2B2B; color:#fff; text-shadow: 1px 1px 12px hsla(0, 0%, 100%, .4); }
.main-tab:focus-visible {box-shadow:0 .3rem 1.2rem 0 #002d7d29;}
.main-tabcon_wrap {position: relative;}

/* col-thumbnail style */
.col-thumbnail .col-box{width:100%;height:100%;display: block;}

.col-thumbnail .col-item{transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;}

.col-thumbnail .col-image{height:200px;}
.col-thumbnail .col-image .image{width:100%;height:100%;display: flex;align-items: center;justify-content: center;}
.col-thumbnail .col-image img{width:100%;height:100%;object-fit: cover;}

.col-thumbnail .col-text{background: #fff;transition: 0.3s ease-in-out;}
.col-tag{font-size:0.875rem;padding:6px 11px; max-height:30px; font-weight: 600;color:var(--primary);background:var(--variant-hover);border-radius:var(--border-radius);display: inline-flex;align-items:center;justify-content:center;}
.col-thumbnail .col-text h5{font-weight:700;color:var(--variant-dark);overflow: hidden;text-overflow: ellipsis;height: 100px;word-wrap: break-word;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;}
.col-thumbnail .col-text p{font-size:0.813rem;color:var(--text-light);transition: color 0.3s ease-in-out;}

.col-thumbnail .col-item:hover{transform: translateY(-0.8rem);box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08);}
.col-thumbnail .col-item:hover .col-text{background:var(--primary);}
.col-thumbnail .col-item:hover .col-text h5{color:#fff;}
.col-thumbnail .col-item:hover .col-text p{color:rgba(255,255,255,0.7);}

/*******************************************************
 * sec 03
 *******************************************************/



/*******************************************************
 * sec 04
 *******************************************************/

.sec04-pt.pt-lf h4{margin-right:10px;font-size:1.75rem;}
.sec04-pt.pt-lf .copy-btn {position: relative;z-index: 10;cursor: pointer;}
.sec04-pt.pt-lf .copy-btn i{font-size:30px;}

.sec04-pt.pt-lf .col-tag{background:var(--primary);color:#fff;margin-right:12px;}

.sec04-pt.pt-lf ul li h6{font-weight:500;}
.sec04-pt.pt-rt ul li h4{color:var(--primary);line-height: 1;font-size:1.75rem;}

.sec04-map .map-btn a{display:inline-flex;align-items:center;background:#F9F8F7;border-radius:var(--border-radius);border:1px solid #ddd;}
.sec04-map .map-btn a p{display:inline-flex;align-items: center;justify-content: center;padding:10px 1.4rem;}
.sec04-map .map-btn a p img{margin-right:8px;}
.sec04-map .map-btn a:hover{background:#2B2B2B;color:#fff;}

@media (max-width: 768px) {
    .loc_map{height:400px;}
}

@media (max-width: 480px) {
    .loc_map { height: 360px; }
}

@media (max-width: 430px) {
    .loc_map { height: 300px; }
}

