@charset "UTF-8";
/* CSS Document */

section p{line-height: 1vw; font-size: 0.84vw;}
section h1{/*font-size: 1.93vw;*/ font-size:1.3vw; text-align: center; color:#004274; margin-bottom: 1vw;}
section h1 span{color:#669835;}

.sec1{position:relative; top:0px; left:0px; width:100%; height:69vw; overflow:hidden;}
.sec1 h1{margin-bottom:1.1vw;}
.sec1 ul li{position:absolute;}

.sec1 .hdr1{top: 22.2vw; left: 5.4vw; width: auto; display: block;}
.sec1 .hdr1 p{width:27vw;}
.sec1 .patrn1{top: 16vw; left: 0vw; width: 2.6vw; height: auto;}
.sec1 .img1{top: 10.1vw; right: 0vw; width: 63.55vw;}
.sec1 .img2{bottom: 8.2vw; left: 21.3vw; width: 17.75vw;}
.sec1 .img2 .lbl{position:absolute; bottom:-1.5vw; left:0vw; font-size:0.85vw;}
.sec1 .img3{bottom: 19.5vw; left: 12.4vw; width: 13.7vw;}

.sec2{position:relative; top:0px; left:0px; width:100%; height:63.4vw; overflow:hidden;}
.sec2 .mstrsld{position:absolute; top:0px; left:0px; width:200%; height:100%; overflow: hidden; -ms-transform: translateX(0%); -webkit-transform: translateX(0%); transform: translateX(0%);
    -webkit-transition-duration: 1s; transition-duration: 1s; 
}

.sec2 h1{margin-bottom:1.1vw;}
.sec2 ul li{position:absolute;}
.sec2 .box{top: 4.35vw; left: 5.2vw; background:url(../img/page_theresidences/gradient1.jpg) top left no-repeat; background-size:100% 100%; width: 189.6vw; height: 42.7vw; display: block; padding: 0vw;}
.sec2 .box span{position:relative; width:100%; height:100%; display: block; background-color:#fff;}

.sec2 .box{-webkit-transition-duration: 0.3s; transition-duration: 0.3s;}
.sec2.on .box{-webkit-transition-duration: 1s; transition-duration: 1s; padding: 2.1vw;}

.sec2 .hdr1{top: 13.2vw; left: 62.1vw; width: auto; display: block; -ms-transform: translateX(0vw); -webkit-transform: translateX(0vw); transform: translateX(0vw);}
.sec2 .hdr1 h1{color:#333;}
.sec2 .hdr1 p{width:27vw;}

.sec2 .img1{top: 0vw; left: 64.9vw; width: 22.55vw;}
.sec2 .img2{bottom: 11.6vw; left: 87.5vw; width: 25.85vw; -ms-transform: translateX(0vw); -webkit-transform: translateX(0vw); transform: translateX(0vw);}


.sec2 .tlte1{top: 8.45vw; left: 7.3vw; padding-left:5.1vw;}
.sec2 .tlte1 h2{font-family: 'Seravek'; font-weight:bold; font-size:1.3vw; color:#004274;}
.sec2 .tlte1 i{display: block; height: 3px; background-color: #004274; width: 2.7vw; position: absolute; top: 50%; left: 0px; -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%);}

.sec2 .tlte2{top: 8.45vw; right: 5.8vw; padding-right:5.1vw;}
.sec2 .tlte2 h2{font-family: 'Seravek'; font-weight:bold; font-size:1.3vw; color:#669835;}
.sec2 .tlte2 i{display: block; height: 3px; background-color: #669835; width: 2.7vw; position: absolute; top: 50%; right: 0px; -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%);}


.sec2 .itm{width: auto; display: block; text-align: left;}
.sec2 .itm img{width:5vw; height:auto; display: block; margin-bottom: 0.8vw;}
.sec2 .itm h3{font-size:1.07vw; font-family: 'Seravek'; font-weight:bold; color:#004274; text-transform: none;}

.sec2 .btn_1{top: 25.6vw; left: 69vw; width: auto; display: block; cursor:pointer;}
.sec2 .btn_1 p{font-size: 1.29vw; font-family: 'Seravek'; font-weight: bold; text-transform: uppercase; color: #669835; padding-right: 5.3vw;}
.sec2 .btn_1 img{position: absolute; width:3.3vw; top: 50%; right: 0px; -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%);}

.sec2 .btn_2{top: 25.6vw; right: 73vw; width: auto; display: block; cursor:pointer;}
.sec2 .btn_2 p{font-size: 1.29vw; font-family: 'Seravek'; font-weight: bold; text-transform: uppercase; color: #004274; padding-left: 5.3vw;}
.sec2 .btn_2 img{position: absolute; width:3.3vw; top: 50%; left: 0px; -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%);}

.sec2 .wires1{top:0vw; left:0vw; width:100%; height:100%; overflow: hidden;}
.sec2 .wires1 .path1{position: absolute; top: -1.64vw; left: -22.3vw; width: 122.3vw; height: auto; display: block;}

.sec2 .wires2{top:0vw; right:0vw; width:100%; height:100%; overflow: hidden;}
.sec2 .wires2 .path2{position: absolute; top: -5.5vw; right: -22.3vw; width: 122.3vw; height: auto; display: block;}

.sec2 .path1{width:50%; height:auto; float:left; display: block; padding-top:2.45vw;}
.sec2 .path2{width:50%; height:auto; float:left; display: block;}

.sec2 .path1,
.sec2 .path2{opacity:0; -webkit-transition-duration: 0.3s; transition-duration: 0.3s;}

.sec2.on .path1,
.sec2.on .path2{opacity:1; -webkit-transition-duration: 1s; transition-duration: 1s;}

.sec2 .path1 path,
.sec2 .path2 path{
    stroke-dasharray:200%; stroke-dashoffset:-140%;
}
.sec2 .path1 rect,
.sec2 .path2 rect{opacity:0;}

.sec2 .path1 line,
.sec2 .path2 line{opacity:0; -webkit-transition-duration: 0.1s; transition-duration: 0.1s;}

.sec2.on .path1 path,
.sec2.on .path2 path{stroke-dashoffset:0%; animation: lnmove1 linear infinite; animation-direction: alternate;}

.sec2.on .path1 line,
.sec2.on .path2 line{opacity:1; -webkit-transition-duration: 1s; transition-duration: 1s;}

.sec2.on .path1 rect,
.sec2.on .path2 rect{animation: lnmove0 ease-in-out infinite; animation-direction: alternate;}

.lbox{position:fixed; top:0px; left:0px;  display: block; width:100%; height:100%; z-index:99999; overflow: hidden;}
.lbox .lbx_container{position:absolute; top:50%; left:50%; width:auto; height:auto; -ms-transform: translate(-50%,-60%); -webkit-transform: translate(-50%,-60%); transform: translate(-50%,-60%); -webkit-transition-duration: 0.6s; transition-duration: 0.6s; opacity:0; background-color:#fff; padding:3.5vh 2.5vh;}
.lbox .lbx_container img{display: block; width:auto; height:80vh;}
.lbox .lbox_ovrly{position:absolute; display: block; top:0px; left:0px; width:100%; height:100%; background-color:#000; opacity:0; -webkit-transition-duration: 0.6s; transition-duration: 0.6s;}

.lbox.on .lbox_ovrly{opacity:0.7; /*transition-delay: 0.8s;*/}
.lbox.on .lbx_container{opacity:1; transition-delay: 0.4s; -ms-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%);}

.lbox .lbx_container h3{color: #669835; position: relative; font-family: 'Seravek'; font-weight: bold; font-size: 2.12vw; text-align: left; margin-bottom: 0vw;}
.lbox .lbx_container h3 span{position:absolute; top:-1vw; left:0px; font-family: 'Seravek'; font-size: 1.1vw; font-weight: normal; text-align: left;}

@keyframes lnmove0{
	0%{-ms-transform: translateY(-2%); -webkit-transform: translateY(-2%); transform: translateY(-2%);opacity:0;}
	20%{opacity:1;}
	80%{opacity:1;}
	100% {-ms-transform: translateY(2%); -webkit-transform: translateY(2%); transform: translateY(2%);opacity:0;}
  }

@keyframes lnmove1{
	0%{stroke-dashoffset:-140%;}
	100% {stroke-dashoffset:200%}
  }

  @keyframes lnmove2{
	0%{stroke-dashoffset:200%;}
	100% {stroke-dashoffset:-140%}
  }

  .sec2 .btn_1 img,
  .sec2 .btn_2 img{animation: arrowAni 0.4s ease-in-out infinite; animation-direction: alternate;}
  
  @keyframes arrowAni{
	0%{-ms-transform: translate(-8%,-50%); -webkit-transform: translate(-8%,-50%); transform: translate(-8%,-50%);}
	100% {-ms-transform: translate(8%,-50%); -webkit-transform: translate(8%,-50%); transform: translate(8%,-50%);}
  }


.sec2 .itm_3 h3,
.sec2 .itm_4 h3,
.sec2 .itm_5 h3{color:#669835;}

.sec2 .itm_1{top: 15.9vw; left: 14.43vw;}
.sec2 .itm_2{top: 30.1vw; left: 28.85vw;}
.sec2 .itm_3{top: 12.3vw; right: 30.3vw;}
.sec2 .itm_4{top: 17.3vw; right: 12.6vw;}
.sec2 .itm_5{top: 30.4vw; right: 19.6vw;}




.sec2 .mstrsld,
.sec2 .img2,
.sec2 .hdr1{-webkit-transition-duration: 1s; transition-duration: 1s;}

.sec2 .mstrsld.on{-ms-transform: translateX(-50%); -webkit-transform: translateX(-50%); transform: translateX(-50%);}
.sec2 .mstrsld.on .img2{-ms-transform: translateX(24.8vw); -webkit-transform: translateX(24.8vw); transform: translateX(24.8vw);}
.sec2 .mstrsld.on .hdr1{-ms-transform: translateX(49.5vw); -webkit-transform: translateX(49.5vw); transform: translateX(49.5vw);}



.sec3{position:relative; top:0px; left:0px; width:100%; height:56.3vw; overflow:hidden; background-color:#fff; -webkit-transition-duration: 0.4s; transition-duration: 0.4s;}
.sec3.on{background-color:#fafafa;}
.sec3 ul li{position:absolute;}
.sec3 .ptrn1{top: 0vw; left: 50%; width: 30vw; -ms-transform: translateX(-50%); -webkit-transform: translateX(-50%); transform: translateX(-50%);}
.sec3 .ptrn2{bottom: 0vw; left: 50%; width: 30vw; -ms-transform: translateX(-50%); -webkit-transform: translateX(-50%); transform: translateX(-50%);}

.sec3 .hdr1{top:10.5vw; left:0vw; width:100%; text-align: center;}
.sec3 .hdr1 h1{margin-bottom:0.6vw; color:#333;}

.sec3 .l_slider{top:15.7vw; left:0vw; width:100%;}
.sec3 .l_slider .clickb{font-size: 0.85vw; margin-top: 2vw;}
.sec3 .l_slider .clickb strong{text-decoration:underline;}

.sec3 .mod_slider{overflow: hidden;}
.sec3 .mod_slider .s-pacer{padding:20px 10px; position:relative;}
.sec3 .mod_slider div{position:relative;}
.sec3 .mod_slider p{text-align: center; opacity:0; font-weight:500; -webkit-transition-duration: 0.4s; transition-duration: 0.4s; text-transform: uppercase; font-size:1.25vw; position:absolute; top:0px; left:0px; width:100%; height:100%; color:#fff; text-transform: uppercase; display: grid; place-content:center;}
.sec3 .mod_slider p img{width:100px; height:auto ; display: block; margin:0 auto; position:relative; z-index:2; margin-top:1vw;}
.sec3 .mod_slider p .m360{width:5vw; -webkit-transition-duration: 0.4s; transition-duration: 0.4s; -ms-transform: scale(1,1); -webkit-transform: scale(1,1); transform: scale(1,1);}
.sec3 .mod_slider a:hover .m360{-ms-transform: scale(1.15,1.15); -webkit-transform: scale(1.15,1.15); transform: scale(1.15,1.15);}
.sec3 .mod_slider p .mateport{width:7.4vw;}
.sec3 .mod_slider p i{display: none!important;}
.sec3 .mod_slider .s-pacer span{position:relative; display: block;}
.sec3 .mod_slider .s-pacer i{position:absolute; top:0px; left:0px; width:100%; height:100%; background-color:#fff; opacity:0.7; -webkit-transition-duration: 0.4s; transition-duration: 0.4s;}
.sec3 .mod_slider b{font-size:1vw; font-weight:normal; font-size:1.2vw; opacity:0; -webkit-transition-duration: 0.6s; transition-duration: 0.6s;}
.sec3 .mod_slider .slick-current b{opacity:1;}

.sec3 .mod_slider .slick-current .s-pacer i{opacity:0.25; background-color:#000; transition-delay: 0.8s;}
.sec3 .mod_slider .slick-current p{opacity:1; transition-delay: 0.8s;}



.sec3 .mod_slider .sbtn{position:absolute; top:0px; display: inline-block; width:auto; height:100%; display: grid; place-content:center;}
.sec3 .mod_slider .sbtn span{display: block; width:4vw; height:4vw; cursor:pointer;}
.sec3 .mod_slider .b_left{left:1vw;}
.sec3 .mod_slider .b_right{right:1vw;}
.sec3 .mod_slider .b_left span{background:url(../img/page_theresidences/vtour/slider_bluebtn_left.png) center no-repeat; background-size:100%;}
.sec3 .mod_slider .b_right span{background:url(../img/page_theresidences/vtour/slider_bluebtn_right.png) center no-repeat; background-size:100%;}

.sec4{position:relative; top:0px; left:0px; width:100%; height:57.2vw; overflow:hidden;}
.sec4 ul li{position:absolute;}
.sec4 .hdr1{top: 5.3vw; left: 12.3vw; width: auto; text-align: left; display: block;}
.sec4 .hdr1 h1{margin-bottom:0.1vw; text-align:left; color:#004274;}
.sec4 .hdr1 p{text-align: left; font-weight: bold; text-transform: uppercase; font-size: 1.06vw; color:#595959;}

.sec4 .l_tabs{top: 5.2vw; left: 50vw; width:auto; display: block;}
.sec4 .l_tabs h2{position: relative; font-size: 1.74vw; float:left; margin-right:4.15vw; cursor: pointer; color:#b3b3b3;}
.sec4 .l_tabs h2 span{position:absolute; left:0vw; font-family: 'Seravek'; font-size: 0.9vw; font-weight: normal;color:#b3b3b3;}

.sec4 .l_tabs h2:nth-child(1) span{top:-1vw;}
.sec4 .l_tabs h2:nth-child(2) span,
.sec4 .l_tabs h2:nth-child(3) span{bottom:-1vw;}

.sec4 .l_tabs h2.on{color:#669835;}
.sec4 .l_tabs h2.on span{color:#333;}

.sec4 .l_tabs h2:hover{color:#669835;}
.sec4 .l_tabs h2:hover span{color:#333;}

.sec4 .l_tabs .h2_1:hover,
.sec4 .l_tabs .h2_1.on{color:#004274;}

.sec4 .elm1{top: 9vw; left: 0vw; width: 2.6vw;}
.sec4 .elm2{top: 9vw; right: 0vw; width: 2.6vw;}

.sec4 .l_glry{position: absolute; top: 14.3vw; left: 12.5vw; text-align: left; padding-bottom: 3.7vw; width:75vw; padding-top:1vw; text-align: center;
    overflow:hidden;
    overflow-x: scroll; /* has to be scroll, not auto */
    -webkit-overflow-scrolling: touch; /* momentum scrolling, iOS Safari only*/
}
.sec4 .l_glry ul{text-align: left; white-space: nowrap; position:relative; display:none;}
.sec4 .l_glry ul.on{display: inline-block;}

.sec4 .l_glry ul li{position: relative; display: inline-block; margin-right: 5vw;}
.sec4 .l_glry ul li:last-child{margin-right:0vw;}
.sec4 .l_glry h3{color: #669835; position: relative; font-family: 'Seravek'; font-weight: bold; font-size: 2.12vw; text-align: left; margin-bottom: 1.5vw;}
.sec4 .l_glry h3 span{position:absolute; top:-1vw; left:0px; font-family: 'Seravek'; font-size: 1.1vw; font-weight: normal; text-align: left;}
.sec4 .l_glry img{width:auto; height:25vw; display: block; margin-bottom:1.55vw;}
.sec4 .l_glry .btn2{float:left; width:auto;}
.sec4 .l_glry .btn2 p{line-height: 1vw; font-size:0.7vw; padding: 0.23vw 1vw; padding-right: 1.5vw;}

.sec4 .l_glry .pnthse h3,
.sec4 .l_glry .pnthse h3 span{color:#004274!important;}

.sec4 .l_glry .pnthse .btn2{border:1px solid #004274!important;}
.sec4 .l_glry .pnthse .btn2 span{background-color:#004274!important;}
.sec4 .l_glry .pnthse .btn2 i{border-color: #004274!important;}
.sec4 .l_glry .pnthse .btn2:hover p{color:#004274!important;}

.sec4 .l_glry::-webkit-scrollbar {
     width: 12px;
     height:15px;
 }
 
 .sec4 .l_glry::-webkit-scrollbar-track {
     -webkit-box-shadow: inset 0 0 0px rgba(0,0,0,0.3); 
     border-radius: 0px;
     background:url(../img/common/scroll_tile.jpg) center left repeat-x;
 }
 
 .sec4 .l_glry::-webkit-scrollbar-thumb {
     border-radius: 0px;
     background-color:#004274;
     -webkit-box-shadow: inset 0 0 0px rgba(0,0,0,0.5); 
 }

 .sec4 .l_glry .scrlr{position:absolute; top:0vw; left:0vw; width:100%; height:30vw; z-index:4;}



 /*xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx MOBILE*/

 .mobile .prlx_2{height:130%!important;}

 .dmyscroll{display: none; position:relative; width:85%; margin:0 auto; height:5px; background:url(../img/common/scroll_tile.jpg) center left repeat-x;}
 .dmyscroll b{display:none; position:absolute; top:0px; left:0px; width:100%; height:100%; background-color:#004274;}
 .mobile .dmyscroll{display: block;}
 .mobile .dmyscroll b{display:block;}

.mobile .slick-dots{display:block!important; bottom:2vw;}
.mobile .slick-arrow{display: block!important; z-index:2; width: 6vw; height: 7vw;}
.mobile .slick-arrow:before{content:''; display: block; width:100%; height:100%;}
.mobile .slick-prev{left:2vw;}
.mobile .slick-next{right:2vw;}
.mobile .s_label{position:absolute; bottom:0px; left:0px; width:100%; display: block; text-align: center; font-weight:bold; color:#004274;
    -ms-transform: translateY(100%); -webkit-transform: translateY(100%); transform: translateY(100%); font-size: 3.1vw; padding:2vw 0vw;
}

.mobile .slick-dots li.slick-active{background-color:#669835;}
.mobile .slick-dots li.slick-active button:before{color:#669835; opacity:1;}
.mobile .slick-dots li button:before{opacity:1; color:#fff; font-size:1vw; width:100%; height:100%; line-height: 1.5vw;}
.mobile .slick-dots li{margin:0 1.8vw; width:1.5vw; height:1.5vw; background-color:#fff;}
.mobile .slick-next:before{background:url(../img/common/mob_sld_arrow_right.png) center no-repeat; background-size:100% auto;}
.mobile .slick-prev:before{background:url(../img/common/mob_sld_arrow_left.png) center no-repeat; background-size:100% auto;}

.mobile .scrlr{display: none!important;}

.mob_sec{display: none!important; overflow: hidden;}
.mobile .mob_sec{display: block!important;}

.mob_sec{display: none!important; position:relative;}

.mob_sec .pnthse h3,
.mob_sec .pnthse h3 span{color:#004274!important;}

.mob_sec .pnthse .btn2{border:1px solid #004274!important;}
.mob_sec .pnthse .btn2 span{background-color:#004274!important;}
.mob_sec .pnthse .btn2 i{border-color: #004274!important;}
.mob_sec .pnthse .btn2:hover p{color:#004274!important;}
.mob_sec .m_sec4 .m_tabs .h2_1{color:#004274!important;}

.mobile .mob_sec{display: block!important;}
.mobile .mob_sec h1{font-size: 3.75vw; color:#004274; text-align: center; width:100%; margin-bottom:3.2vw;}
.mobile .mob_sec p{width:86.5vw; margin:0 auto; line-height: 3.7vw!important; font-size: 3vw; text-align: center;}

.mobile h1 span,
.mobile h1 span{color:#669835;}

.mobile section{display: none!important;}
.mobile .f_kv{height:134.2vw;}
.mobile .f_kv{display: block!important;}

.mob_sec .h1_1{padding-top:25.6vw; position:relative; padding-bottom:16.4vw;}
.mob_sec .h1_1 .mob_pattern1{margin-top:9.1vw;}

.mob_sec .mob_img1_prlx{position: absolute; top: 49.8vw; left: 0vw; width: 100%; height: auto; display: block; z-index: -1;}
.mob_sec .mob_img1_prlx ._anote{right: auto; left: 1%; bottom: 2%;}

.mob_sec .h1_1 p{position: absolute; bottom: 11vw; left: 0vw; text-align: left; padding-left: 7.5vw; width: 55vw;}

.mob_sec .m_sec2{background:url(../img/page_theresidences/mob_wire.png) top left no-repeat; background-size:100% auto; height:251.4vw; position:relative; margin-bottom:10.4vw;}
.mob_sec .m_sec2  h3{font-family: 'Seravek'; font-weight:bold; color:#004274; font-size:3.07vw; text-transform: none; width:auto; display: block;}

.mob_sec .m_sec2 .h1_2{padding-top: 26vw;}
.mob_sec .m_sec2 .h1_2 h1{margin-bottom:0.7vw;}
.mob_sec .m_sec2 .h1_2 p{width:63vw; margin:0 auto;}

.mob_sec .m_sec2 .h3_1{position: absolute; top: 115.6vw; left: 15.4vw; text-transform: uppercase;}
.mob_sec .m_sec2 .h3_2{position: absolute; top: 131vw; right: 14vw; text-transform: uppercase; text-align: right; color:#669835;}

.mob_sec .m_sec2 .m_img1{position: absolute; top: 94.3vw; right: 0vw; width: 36.4vw;}
.mob_sec .m_sec2 .m_img2{position: absolute; bottom: 9.1vw; left: 27.2vw; width: 45.6vw;}

.mob_sec .m_sec2 .itms img{width:11.2vw; height:auto; display: inline-block; margin-bottom:1.3vw;}
.mob_sec .m_sec2 .itms  p{display: none!important;}
.mob_sec .m_sec2 .itms h3{text-decoration: underline;}

.mobile .show_Box{position:fixed; top:0vw; left:0vw; width:100%; height:100%; z-index: 99999;}
.mobile .show_Box .e_1{position:absolute; display: block; top:0vw; left:0vw; width:100%; height:100%; background-color:#000; opacity:0; -webkit-transition-duration: 0.4s; transition-duration: 0.4s;}
.mobile .show_Box.on .e_1{opacity:0.6;}
.mobile .show_Box .e_2{position:absolute; display: block; width:90%; height:auto; top:50%; left:50%; padding:8vw; -webkit-transition-duration: 0.6s; transition-duration: 0.6s;
  -ms-transform: translate(-50%,-60%); -webkit-transform: translate(-50%,-60%); transform: translate(-50%,-60%); background-color:#fff; opacity:0;
}
.mobile .show_Box.on .e_2{ -ms-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); opacity:1;}

.mobile .show_Box .e_2 img{width:20vw; margin:0 auto; margin-bottom:4vw;}
.mobile .show_Box .e_2 h3{text-align: center; margin-bottom:2.5vw; color:#004274; font-size:5vw;}
.mobile .show_Box.grn .e_2 h3{color:#669835;}
.mobile .show_Box .e_2 p{text-align: center; font-size: 3.2vw; line-height: 4.5vw;}
.mobile .show_Box .e_2 p br{display: none!important;}

.mob_sec .m_sec2 .itms li{position:absolute;}
.mob_sec .m_sec2 .itms .l1{text-align: right; top: 51.1vw; right: 14.9vw; width:33vw;}
.mob_sec .m_sec2 .itms .l2{text-align: left; top: 68.1vw; left: 25vw; width: auto;}
.mob_sec .m_sec2 .itms .l3{text-align: left; top: 158.2vw; left: 20vw; width: 33vw;}
.mob_sec .m_sec2 .itms .l3 h3{color:#669835;}

.mob_sec .m_sec2 .itms .l4{text-align: left; top: 170vw; left: 65.7vw; width: 33vw;}
.mob_sec .m_sec2 .itms .l4 h3{color:#669835;}

.mob_sec .m_sec2 .itms .l5{text-align: left; top: 189vw; left: 41.4vw; width: 33vw;}
.mob_sec .m_sec2 .itms .l5 h3{color:#669835;}

.mob_sec .m_sec3{background-color:#fafafa;}
.mob_sec .m_ptrn2{margin-bottom: 12.2vw;}

.mob_sec .m_sec3 .h1_3{margin-bottom:4.3vw;}
.mob_sec .m_sec3 .h1_3 h1{margin-bottom:2.2vw;}

.mob_sec .m_sec3 .m_sld1 p{position:absolute; top:50%; left:50%; width: 44vw; font-size: 5vw; line-height:5vw!important; height:auto; display: block; -ms-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%);}
.mob_sec .m_sec3 .m_sld1 p br{display: none!important;}
.mob_sec .m_sec3 .m_sld1 p .m360{width:14.1vw; margin:0 auto; margin-bottom:5vw; margin-top:4vw;}
.mob_sec .m_sec3 .m_sld1 p .mateport{width:20.5vw; margin:0 auto;}

.mob_sec .m_sec3 .m_sld1 .slick-slide{position:relative;}
.mob_sec .m_sec3 .m_sld1 img:nth-child(1){height:auto;}
.mob_sec .m_sec3 .m_sld1 .s_label{display: none!important;}

.mob_sec .m_sld1 b{font-size:3vw; font-weight:normal; display: block; width:100%; line-height:8vw; text-align:center; opacity:0; -webkit-transition-duration: 0.6s; transition-duration: 0.6s;}
.mob_sec .m_sld1 .slick-current b{opacity:1;}
.mob_sec .m_sld1 .slick-dots{display:none!important;}
.mob_sec .m_sld1 a{display: block;}
.mob_sec .m_sld1 img{opacity:0.7;}
.mob_sec .m_sld1 u{background-color:#000; display: block;}

.mob_sec .m_sld1 .slick-prev, 
.mob_sec .m_sld1 .slick-next{top:41%;}

.mob_sec .m_sec3 .instr{text-align: center; font-size: 3vw; padding-top: 8vw; padding-bottom: 13.2vw;}

.mob_sec .m_sec4{position:relative;}
.mob_sec .m_sec4 i{display: block; width:85%; margin:0 auto; height:1px; background-color:#e5e5e5;}
.mob_sec .m_sec4 .h1_4{padding-top:8.4vw;}
.mob_sec .m_sec4 .h1_4 h1{margin-bottom:1vw;}
.mob_sec .m_sec4 .h1_4 p{text-transform: uppercase; font-weight: bold; font-size: 3.1vw;}
.mob_sec .m_sec4 .h1_4 br{display: none!important;}

.mob_sec .m_sec4 .m_tabs{text-align: center; padding-top: 5vw; padding-bottom: 5vw; position:relative;}

.mob_sec .m_sec4 .m_tabs .slick-initialized .slick-slide{padding:3.4vw 0vw;}

.mob_sec .m_sec4 .m_tabs i{position:absolute; bottom:0vw; left:50%; display: block; width:85%; height:1px; background-color:#e5e5e5;
  -ms-transform: translateX(-50%); -webkit-transform: translateX(-50%); transform: translateX(-50%);
}
.mob_sec .m_sec4 .m_tabs h2{position: relative; font-size: 6.2vw; cursor: pointer; color:#669835; width:auto; display: inline-block;}
.mob_sec .m_sec4 .m_tabs h2 span{position:absolute; left:0vw; font-family: 'Seravek'; font-size: 3.1vw; font-weight: normal;color:#b3b3b3;}

.mob_sec .m_sec4 .m_tabs .h2_1 span{top:-3.8vw;}
.mob_sec .m_sec4 .m_tabs .h2_2 span,
.mob_sec .m_sec4 .m_tabs .h2_3 span{bottom:-3.8vw;}

.mob_sec .m_sec4 .m_tabs .arws{position:absolute; top:0vw; width:6vw; cursor:pointer; top:10.3vw; z-index:4;}
.mob_sec .m_sec4 .m_tabs .arw_l{left:7.5vw;}
.mob_sec .m_sec4 .m_tabs .arw_r{right:7.5vw;}

.mob_sec .m_sec4 .m_tabs .slick-dots{display:none!important;}
.mob_sec .m_sec4 .m_tabs .slick-arrow{display: none!important;}

.mob_sec .m_sec4 .m_glry .btn2{display: inline-block; width:auto; margin-top:8vw; padding:0vw 2vw;}
.mob_sec .m_sec4 .m_glry .btn2 i{width:41%;}
.mob_sec .m_sec4 .m_glry .btn2 p{width:auto;}

.mob_sec .m_sec4 .m_glry{width:85%; margin:0 auto; overflow: hidden; overflow-x:scroll; padding-bottom:14vw;}
.mob_sec .m_sec4 .m_glry ul{text-align: left; white-space: nowrap; display: inline-block;}
.mob_sec .m_sec4 .m_glry ul li{position: relative; display: inline-block; width:auto; text-align: center; margin: 0vw 12vw;}
.mob_sec .m_sec4 .m_glry ul li img{width:auto; height:100vw; margin:0 auto;}
.mob_sec .m_sec4 .m_glry h3{color: #669835; position: relative; font-family: 'Seravek'; font-weight: bold; font-size: 6.2vw; text-align: left; margin-top: 8vw; margin-bottom:4vw; text-align: center;}
.mob_sec .m_sec4 .m_glry h3 span{position:absolute; top:-2.5vw; left:50%; font-family: 'Seravek'; font-size: 3.1vw; font-weight: normal; text-align: left;
  -ms-transform: translateX(-50%); -webkit-transform: translateX(-50%); transform: translateX(-50%);
}

.mob_sec .m_sec4 .m_glry ul{display:none;}
.mob_sec .m_sec4 .m_glry ul.on{display: inline-block;}

.mob_sec .m_sec4 .m_glry{
  overflow:hidden;
  overflow-x: scroll; /* has to be scroll, not auto */
  -webkit-overflow-scrolling: touch; /* momentum scrolling, iOS Safari only*/
}

.mob_sec .m_sec4 .m_glry::-webkit-scrollbar {
   width: 12px;
   height:5px;
}

.mob_sec .m_sec4 .m_glry::-webkit-scrollbar-track {
   -webkit-box-shadow: inset 0 0 0px rgba(0,0,0,0.3); 
   border-radius: 0px;
   background:url(../img/common/scroll_tile.jpg) center left repeat-x;
}

.mob_sec .m_sec4 .m_glry::-webkit-scrollbar-thumb {
   border-radius: 0px;
   background-color:#004274;
   -webkit-box-shadow: inset 0 0 0px rgba(0,0,0,0.5); 
}

.mob_sec .m_sec4 .m_ptrn4{margin-top:14vw; display: block;}






/* Mediaqueries */

@media (max-width:1366px){

    section p{line-height: 1.25vw!important; font-size: 1vw;}
    .sec1 .img2 .lbl{font-size: 1vw; bottom: -1.8vw;}
    .sec2 .itm_5{top: 28.4vw;}
    .sec3 .l_slider .clickb{font-size: 1vw;}
 
 }



@media (max-width:1024px){


}

@media (max-width:550px){
}