@font-face {
    font-family: 'NanumSquareR';
    src: url('fonts/NanumSquareR.eot');
    src: url('fonts/NanumSquareR.eot?#iefix') format('embedded-opentype'),
         url('fonts/NanumSquareR.woff') format('woff'),
         url('fonts/NanumSquareR.ttf') format('truetype'),
         url('fonts/NanumSquareR.svg#NanumSquareR') format('svg');
    font-weight: normal;
    font-style: normal;
    }

@font-face {
    font-family: 'NanumSquareB';
    src: url('fonts/NanumSquareB.eot');
    src: url('fonts/NanumSquareB.eot?#iefix') format('embedded-opentype'),
         url('fonts/NanumSquareB.woff') format('woff'),
         url('fonts/NanumSquareB.ttf') format('truetype'),
         url('fonts/NanumSquareB.svg#NanumSquareB') format('svg');
    font-weight: normal;
    font-style: normal;
    }

body {
}

 .td-container{
            width:100%;
            overflow:auto;
        }
        .td-row{
            width:100%;
            overflow:auto;
            display:block;

        }
        .destination-info{
            width:100%;
        }
        .td-col{
            width:50%;
            display:block;
            float:left;
            margin:auto;

        }
        .spot-image-col{
            width:60%;
        }
        .spot-text-col{
             width:40%;
        }

        .destination-image, .destination-text{
            
            height:500px;
        }
        .spot-height{
            height:980px;
        }
        .destination-image{ 
            overflow:hidden;
            position:relative;
        }

        .destination-image img{
                 z-index: 0;
                margin: auto;
                position: absolute;
                top: 0;
                bottom: 0;
                left: -99999px;
                right: -99999px;
                width: 100%;
        }

        .spot-image img{
            height:100%;
            width:auto;
        }
        .destination-text {
            background:#19519f;
            padding:3vw;
            box-sizing:border-box;
            color:#fff;
        }
        .destination-text h1{
             font-family:'NanumSquareB';
             font-size:1.5vw;
             font-weight:normal;
             letter-spacing:0.3vw;
             text-transform:uppercase;
             margin:15px 0 30px;
             float:left;
        }
        .destination-text p{
             font-family:'NanumSquareR';
              font-size:0.9vw;
              line-height:1.4vw;
              clear:both;
              
        }

       
        .td-btn{
            padding:0.7vw;
            border:2px solid #fff;
            border-radius:50px;
            color:#fff;
            text-transform:uppercase;
        }
        .destination-btn{
            font-size:0.7vw;
            text-decoration:none;
            font-family:'NanumSquareB';
            float:right;
            transition:0.5s;
        }

        .destination-btn:hover{
            background:#fff;
            color:#19519f;
            
        }
       
        #placemark{
            fill:#fff;
            width:1.8vw;
            display:inline-block;
            vertical-align:middle;
        }
          #placemark-spot{
            fill:#fff;
            width:1vw;
            display:inline-block;
            vertical-align:middle;
        }
          .spot-info-icons{
                fill:#fff;
            width:1vw;
             display:inline-block;
            vertical-align:middle;

          }
        .destination-btn-icon{
            fill:#fff;
            width:1vw;
            display:inline-block;
            vertical-align:middle;
            transition:0.5s;
        }
        .td-theme-nav{
            display:flex;
            list-style:none;
            flex-flow:row wrap;
            justify-content:space-evenly;
            padding:0;
        }
        .td-theme-nav li{
           
            color:#fff;
            padding:1vw;
          
            flex-grow: 1;
            text-align:center;
              font-family:'NanumSquareB';
             color:#fff;
             font-size:1vw;
             text-decoration:none;
             text-transform:uppercase;
             cursor:pointer;
            transition:0.3s;
            
        }
        .td-theme-nav li:hover{
            border-bottom:5px solid #fff;
        }
        .active{
            border-bottom:5px solid #fff;
        }
       

        .related-destinations{
            width:100%;
            list-style:none;
            padding:0;
        }

         .related-destinations li{
            width:25%;
            height:25vw;
           float:left;
            overflow:hidden;
            padding:0;
            text-align:center;
            position:relative;
            cursor:pointer;
         }

         .related-destinations li p{
              font-family:'NanumSquareB';
              font-size:1.5vw;
              position:absolute;
              z-index:2;
              color:#fff;
              margin:auto;
              left:0;
              right:0;
              bottom:1.5vw;
               text-shadow: 0px 0px 12px #000000;
         }
         .related-destinations li img{
             height:100%;
             width:auto;
           position:absolute;
           margin:auto;
           left:-9999px;
           right:-9999px;
           transition:0.5s;
         }
         .green{
             background:#2d8216;
         }
         .orange{
             background:#c5740b;
         }
         .brown{
             background:#994d0a;
         }
         .red{
             background:#ff0000;
         }
         .blue{
             background:#1688a0;
         }
         .maroon{
             background:#9b1f2a;
             position:relative;
         }
         .maroon a{
             position:absolute; width:100%; height:100%; top:0; right:0;
         }
         .dot-blue{
             background:#19519f;
         }
          .dot-red{
             background:#f60000;
         }
         .nav-icon{
             fill:#fff;
             width:2vw;
             display:inline-block;
             vertical-align:middle;
         }
         .theme-slider{
             display:none;
             width:100%;
             overflow:auto;
         }

          .spot-slider{
             width:100%;
             overflow:auto;
         }

         #play-btn{
             fill:#fff;
             width:5vw;
             position:absolute;
             margin:auto;
             top:0;
             bottom:0;
             left:0;
             right:0;
             cursor:pointer;
             z-index:1;
             
         }
         .spot-overlay{
             background:rgba(32,92,16,0.7);
             position:absolute;
             width:100%;
             height:100%;
         }
         .owl-carousel .owl-item{
         }
         .spot-overlay{
            display:none;
         }
         .overlay-text{
             text-align:center;
            
             
         }
         .overlay-text p{
             margin:0;
             color:#fff;
             font-family:'NanumSquareB';
              font-size:0.8vw;
         }

         .know-more-btn{
             display:inline-block;
             padding:0.3vw 0.5vw;
             font-size:0.6vw;
             margin-top:0.3vw;
             font-family:'NanumSquareR';
             transition:0.5s;
         }
         .know-more-btn:hover{
             background:#fff;
             color:#000;
         }
         .valign {
            position: relative;
            top: 50%;
            transform: translateY(-50%);
            z-index:1;
        }
         .header-title {
             width:100%;
             padding:0 1%;
             box-sizing:border-box;
             display:inline-block;
         }
         .header-title h1{
             font-family:'NanumSquareB';
             font-size:1.3vw;
             text-align:center;
             color:#fff;
             padding:0;
             text-transform:uppercase;
         }
         .spot-breadcrumbs{
             padding:0;
         }
         .spot-breadcrumbs li{
             list-style:none;
             display:inline-block;
             font-family:'NanumSquareR';
             font-size:0.7vw;
              color:#bababa;
         }

         .spot-breadcrumbs li a{
             text-decoration:none;
             color:#bababa;
             transition:0.5s;
             
             
         }
         .spot-breadcrumbs li a:hover{
             color:#fff;
         }

         .text-center{
             text-align:center;
         }
         .spot-info-box{
             background:#3063a9;
             border-radius:1vw;
             width:20vw;
             margin:0 auto;
             height:auto;
             padding:0.8vw;
             box-sizing:border-box;
             clear:both;
         }

         .box-row{
             display:inline-block;
             width:100%;
              font-family:'NanumSquareR';
              font-size:0.8vw;
         }

         .box-row .col-1{
             width:15%;
             display:inline-block;
             vertical-align: top;
             padding-top: 5px;
         }
          .box-row .col-2{
             width:80%;
             display:inline-block;
             text-align:left;
         }

          .spot-text-col p{
              text-align:left;
          }

          #discover-icon{
              width:0.8vw;
              fill:#FFF;
              vertical-align:middle;
          }
           .spot-more-btn {
             font-size:0.7vw;
            text-decoration:none;
            font-family:'NanumSquareB';
            display:inline-block;
            border: 2px solid #f60000;
            background:#f60000;
            transition:0.5s;
            
        }
        .spot-more-btn p{
          margin:0;
        }

        .spot-more-btn:hover{
             border: 2px solid #fff;
             background:none;
        }

       .embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
       .close-icon{
           width:20px;
           position:absolute;
           top:-25px;
           right:-25px;
           cursor:pointer;
           fill:#fff;
       }
       .video-popup{
           position:fixed;
           background:rgba(0,0,0,0.5);
           top:0;
           width:100%;
           height:100%;
           z-index:9999;
           display:none;
       }
       .video-popup-cont{
           position:absolute;
           width:800px;
           height:50vh;
           top:0;
           left:0;
           right:0;
           bottom:0;
           margin:auto;
       }

       .spot-text-col h1{
           float:none;
           text-align:center;
       }

       .spot-label{
           position:absolute; width:100%; height:auto; margin:auto; bottom:0; z-index:2; text-align:center; padding:15px; box-sizing:border-box;
       }
       .spot-label p{
           color:#fff;
           text-shadow: 0px 0px 12px #000000;
           font-size:18px;
          font-family: 'NanumSquareB';
       }
       .mr-1{
           margin-right:1vw;
       }
       #ContentPlaceHolder1_divHotelComb > div{
           z-index:0;
       }
@media screen and (max-width:1615px) {
    .destination-image img{
        height:100%;
        width:auto;
    }
}
@media screen and (max-width:1400px) {
    .destination-text p{
        font-size: 1.1vw;
        line-height: 2vw;
    }
}
@media screen and (max-width:1280px) {
    .destination-text p{
               font-size: 14px;
               line-height:20px;
               text-align:left;
           }
}

       @media screen and (max-width:1000px){
           .td-col{
               width:100%;
           }
           .destination-image {
               height:400px;
           }
            .destination-image img{
        width:100%;
        height:auto;
    }
           .destination-text{
               padding:25px;
               height:auto;
               text-align:center;
           }
           .destination-text h1{
                   font-size: 20px;
                   margin:15px 0;
           }
           #placemark{
               width:25px;
           }
           #destination-btn-icon{
                width:14px;
           }
           .destination-btn{
               font-size: 14px;
               margin-bottom:15px;
           }
           .destination-text p{
               font-size: 14px;
               line-height:20px;
               text-align:left;
           }
           #play-btn{
               width:50px;
           }
           .td-btn{
               padding:8px;
           }

           .spot-image img{
               width:100%;
               height:auto;
           }

           .spot-breadcrumbs li{
               font-size:11px;
           }

           .spot-info-box{
               width:70%;
           }
           .box-row{
               font-size:14px;
           }
           .spot-info-icons{
               width:20px;
           }
           #discover-icon{
               width:14px;
           }
           .destination-btn-icon{
               width:16px;
           }
       }

           @media screen and (max-width:900px) {
            .td-theme-nav li{
                width:30%;
                padding: 15px;
                font-size: 16px;
            }
            .nav-icon{width:25px;}
            
            .header-title h1{
                font-size:20px;
            }
            .overlay-text p{
                font-size:14px;

            }
            .know-more-btn{
                font-size:12px;
            }
       }
           @media screen and (max-width:660px) {
            .destination-image img{
                width: unset;
                height: 100%;
            }
        }

        @media screen and (max-width:650px) {
             .spot-image img{
               width:auto;
               height:100%;
           }
             .spot-info-box{
               width:90%;
           }
        }
                @media screen and (max-width:800px) {
            .video-popup-cont {
                width:90%;
            }
            .related-destinations li{
                width:50%;
                height:110px;
            }
            .related-destinations li img{
                height: auto;
                width: 100%;
            }
            .related-destinations li p{
                font-size:16px;
                bottom: 20px;
            }
       }

        @media screen and (max-width:490px) {
            .td-theme-nav li{
                font-size:10px;
            }

        }

        @media screen and (max-width:440px) {
             .destination-text h1{
                 width:100%;
             }
            .destination-btn {
                float:none;
               display:inline-block;
               
            }

        }

       @media screen and (max-width:359px){
            .related-destinations li img{
                height: 100%;
                width: auto;
            }

        }