/*首頁右上角每頁呈現按鈕*/
@media screen and (min-width: 980px) {
    #showPerPageDiv {
        display: flex;
    }
}

@media screen and (max-width: 1600px) {
    .ChartMain {
        width: 1200px;
    }

        .ChartMain .chart {
            width: 46.7%;
        }
}

@media screen and (max-width: 1500px) {
    /*------------------------------------------------------------------
  	[login.cshtml]
------------------------------------------------------------------*/
    .login-content {
        width: 60%;
    }
    /*------------------------------------------------------------------
      	[advanced  2]
    ------------------------------------------------------------------*/
    .advanced2 {
        width: 1280px;
    }
    /*------------------------------------------------------------------
      	[advanced  3]
    ------------------------------------------------------------------*/
    .advanced3 {
        width: 1280px;
    }
}
/*------------------------------------------------------------------
      	[JS Responsive  150%] start
    ------------------------------------------------------------------*/
.Rwd150 .login-content {
    width: 55%;
}

.Rwd150 .login-form .form-control {
    height: 35px;
}

.Rwd150 #Logo {
    width: 40px;
}

.Rwd150 #LogoTitle {
    font-size: 16px;
    margin-left: 5px;
}

.Rwd150 #menuB ul > li a {
    font-size: 12px;
    padding-bottom: 0;
}

.Rwd150 .navbar.navbar-white .navbar-toggler {
    margin-left: 0;
}

.Rwd150 .NHeader .navbar-toggler {
    padding: 0 6px;
}

.Rwd150 .navbar .side-collapse .nav-link {
    padding: 10px 8px;
    font-size:10px;
}

.Rwd150 .navbar .side-collapse.side-collapse-left {
    width: 220px;
}

.Rwd150 .navbar .side-collapse.side-collapse-left.in {
    width: 0;
}

.Rwd150 .MainDiv {
    top: 100px;
}

.Rwd150 .form-control {
    padding: 6px 15px;
    font-size: 10px;
}

.Rwd150 .map-title .btn-title {
    font-size: 10px;
}

.Rwd150 .table_title h4 {
    font-size: 12px;
    padding: 10px;
}
.Rwd150 .noteDiv {
    font-size:10px;
}
.Rwd150 .ChartMain, .Rwd150 .detailMain, .Rwd150 .map-title, .Rwd150 .noteDiv {
    width: 1000px;
}
.Rwd150 .chartBtn {
    font-size: 14px;
}

.Rwd150 .GuideSwitch img {
    width: 40px;
}

.Rwd150 .pulse {
    width: 20px;
    height: 20px;
    left: 10px;
    top: 8px;
}

.Rwd150 .switch {
    width: 50px;
}

.Rwd150 .switch_label {
    font-size: 12px;
}

.Rwd150 .switch_indicator {
    width: 17px;
    height: 17px;
    left: -15px;
}

.Rwd150 .showPerPageDiv .col-auto {
    font-size: 12px;
}

.Rwd150 .map-chart .highcharts-container {
    width: 700px !important;
}
/*index*/
.Rwd150 .index .chart {
    width: 460px;
    height: 290px;
}

.Rwd150 .index .highcharts-root {
    width: 460px;
    height: 250px;
}

.Rwd150 .index .highcharts-container {
    width: 460px !important;
    height: 250px !important;
}

.Rwd150 .index .chartContent {
    height: auto;
}
/*index End*/

/*SingleDisease*/
.Rwd150 .SingleDisease .MainCont {
    padding: 2em 0;
    padding-bottom:0;
}

.Rwd150 .SingleDisease .table-chart {
    height: 315px;
}

.Rwd150 .SingleDisease .highcharts-root {
    width: 970px !important;
    height: 315px !important;
}

.Rwd150 .SingleDisease .highcharts-container {
    width: 970px !important;
    height: 315px !important;
}

.Rwd150 .SingleDisease .highcharts-title {
    left: 25px !important;
    font-size: 14px !important;
}

.Rwd150 .SingleDisease .detailMain{
    margin-bottom:0;
}

.Rwd150 .SingleDisease .table td, .Rwd150 .SingleDisease .table th{
    font-size: 10px;
}
/*SingleDisease End*/

/*Diagram*/
.Rwd150 .Diagram .MainCont {
    padding: 2em 0;
    padding-bottom: 0;
}

.Rwd150 .Diagram .table-chart {
    height: 315px;
}

.Rwd150 .Diagram .highcharts-title {
    left: 25px !important;
    font-size: 14px !important;
}

.Rwd150 .Diagram .highcharts-container {
    width: 970px !important;
    height: 315px !important;
}

.Rwd150 .Diagram .highcharts-root {
    width: 970px !important;
    height: 315px !important;
}

.Rwd150 .Diagram .detailMain {
    margin-bottom: 0;
}
/*Diagram End*/

/*NewSouth*/
.Rwd150 .NewSouth .detail_area{
    padding:1em 15px;
}
.Rwd150 .NewSouth .xinnanChart{
    width:625px;
}
.Rwd150 .NewSouth .highcharts-container {
    position:relative!important;
    width: 625px!important;
}
.Rwd150 .NewSouth .highcharts-root {
    width: 625px!important;
}
/*NewSouth End*/

/*Cdcwnh07*/
.Rwd150 .Cdcwnh07 .table-chart {
    height: 315px;
}

.Rwd150 .Cdcwnh07 .highcharts-title {
    left: 25px !important;
    font-size: 14px !important;
}

.Rwd150 .Cdcwnh07 .highcharts-container {
    width: 970px !important;
    height: 315px !important;
}

.Rwd150 .Cdcwnh07 .highcharts-root {
    width: 970px !important;
    height: 315px !important;
}
/*Cdcwnh07 End*/
/*------------------------------------------------------------------
      	[JS Responsive  150%] End
 ------------------------------------------------------------------*/
@media screen and (max-width: 1300px) {
    /*------------------------------------------------------------------
  	[login.cshtml]
------------------------------------------------------------------*/
    .login-content {
        width: 70%;
    }
    .noteDiv, .detailMain, .map-title {
        width: 100%;
    }  
}

@media screen and (max-width: 1280px) {
    /*------------------------------------------------------------------
      	[advanced  2]
    ------------------------------------------------------------------*/
    .advanced2 {
        width: 1024px;
    }
    /*------------------------------------------------------------------
      	[advanced  3]
    ------------------------------------------------------------------*/
    .advanced3 {
        width: 1024px;
    }
}

@media screen and (max-width: 1220px) {
    .ChartMain {
        width: 1000px;
    }

        .ChartMain .chart {
            width: 46%;
        }
    /*------------------------------------------------------------------
  	[login.cshtml]
------------------------------------------------------------------*/
    .login-content {
        width: 80%;
    }
}

@media screen and (max-width: 1024px) {
    .MainDivWork {
        padding: 0 1em;
        min-height: 635px;
    }
    /*------------------------------------------------------------------
  	[login.cshtml]
------------------------------------------------------------------*/
    .login-content {
        width: 90%;
    }
    /*------------------------------------------------------------------
      	[advanced  2]
    ------------------------------------------------------------------*/
    .advanced2 {
        width: 768px;
        height: 500px;
    }
    /*------------------------------------------------------------------
      	[advanced  3]
    ------------------------------------------------------------------*/
    .advanced3 {
        width: 768px;
    }

    .advanced3-year {
        float: left;
        width: 182px;
        height: 290px;
    }
    /*------------------------------------------------------------------
  	[NOTE]
------------------------------------------------------------------*/
    .noteDiv {
        width: 100%;
    }

        .noteDiv ol {
            padding: 0 30px;
        }

        .noteDiv li {
            margin-bottom: 5px;
        }
}

@media screen and (max-width: 980px) {
    #showPerPageDiv {
        display: none;
    }

    .ChartMain, .AbutMain {
        width: 100%;
    }

        .ChartMain .chart {
            width: 90%;
            display: block;
            margin: auto;
            margin-bottom: 2em;
            float: none;
        }

            .ChartMain .chart:nth-child(even) {
                margin-right: auto;
            }
    /*------------------------------------------------------------------
  	[Question]
------------------------------------------------------------------*/
    .QuesMain {
        width: 100%;
        padding: 0 1em;
    }
}

@media screen and (max-width: 900px) {
    /*------------------------------------------------------------------
      	[advanced]
    ------------------------------------------------------------------*/
    .advanced {
        width: 768px;
    }

    .advanced-left {
        width: 590px;
    }



    .advanced-right {
        width: 138px;
    }
}

@media screen and (max-width: 1200px) {
    .MapChartContent {
        display: block;
    }
    .MainCont {
        padding: 3.5em 0;
    }

   /* .AbutMain {
        margin: 2.8em 0;
    }*/

    .QuesMain {
        margin-top: 3em
    }
    .GlobalTreeMap .table-chart{
        width:100%;
    }
    /*------------------------------------------------------------------
  	[login.cshtml]
------------------------------------------------------------------*/
    .login-content {
        width: 95%;
    }
    /*------------------------------------------------------------------
  	[Highmaps]
------------------------------------------------------------------*/
    .detail_area {
        padding: 10px;
    }

    .map-chart .highcharts-container {
        position: relative !important;
        width: auto !important;
        height: auto !important;
    }

    .map-chart .highcharts-root {
        width: 100%
    }

    .map-chart {
        display: block;
    }
    /*------------------------------------------------------------------
  	[advanced]
------------------------------------------------------------------*/
    .advanced {
        width: 640px;
        height: 600px;
    }

    .advanced-left {
        width: 475px;
    }

        .advanced-left h5 {
            font-size: 15px;
        }

    .tableMenu {
        display: none;
    }

    .advanced-right {
        width: 100%;
        margin-top: 1em;
    }

    .advanced-table {
        width: 100%;
        height: 100%;
        box-shadow:none;
    }

    .advanced-right td, .advanced-right th {
        font-size: 12px;
    }

    .advanced-left .download {
        width: 25px;
        right: 25px;
    }
    /*------------------------------------------------------------------
      	[advanced  2]
    ------------------------------------------------------------------*/
    .advanced2 {
        width: 100%;
        height: 100%;
    }

    .advanced2-left, .advanced2-right {
        width: 100%;
    }
    /*------------------------------------------------------------------
      	[advanced  3]
    ------------------------------------------------------------------*/
    .advanced3 {
        width: 640px;
    }

    .advanced3-year {
        float: left;
        width: 180px;
        height: 320px;
    }
    /*------------------------------------------------------------------
  	[COOKIE]
------------------------------------------------------------------*/
    .cookieCont {
        width: 80%;
    }
    .diseaseMapChart {
        width: 100%;
    }
}

@media screen and (max-width: 640px) {
    /*------------------------------------------------------------------
  	[Highmaps]
------------------------------------------------------------------*/
    .detail_area {
        padding: 0;
    }

    .map-tab .nav-tabs li a {
        padding: 8px 35px;
        font-size: 12px;
    }
    /*------------------------------------------------------------------
      	[advanced]
    ------------------------------------------------------------------*/
    .advanced {
        width: 560px;
    }

    .advanced-left {
        width: 395px;
    }

        .advanced-left h5 {
            font-size: 14px;
        }



    .advanced-right {
        width: 125px;
    }

    .advanced-left .download {
        width: 25px;
        right: 25px;
    }
    /*------------------------------------------------------------------
      	[advanced  3]
    ------------------------------------------------------------------*/
    .advanced3 {
        width: 100%;
    }

    .advanced3-year {
        float: left;
        width: 100%;
        height: 100%;
    }
}

@media screen and (max-width: 1200px) {
    /*------------------------------------------------------------------
  	[header]
------------------------------------------------------------------*/
    #menuSearch {
        width: 70%;
    }

    #menuB {
        margin: auto;
    }

    /*------------------------------------------------------------------
  	[chart]
------------------------------------------------------------------*/
    .chartContent {
        width: 100%;
        height: 245px;
    }

    /*------------------------------------------------------------------
  	[advanced]
------------------------------------------------------------------*/
    .advanced {
        width: 100%;
        height: 100%;
    }

    .advanced-left {
        width: 100%;
        margin-bottom: 2em;
    }

        .advanced-left h5 {
            font-size: 14px;
        }


    .advanced-right {
        width: 100%;
    }

    .advanced-left .download {
        width: 25px;
        right: 25px;
    }
}

@media (max-width: 512px) {
    .row.row-map .btn-region {
        width: 80px;
        margin-bottom: 5px;
        margin-right: 0.5rem;
    }

        .row.row-map .btn-region + .btn-region {
            margin-left: 0;
        }
}

/*@media screen and (max-width: 480px) {
    .ChartMsg {
        top:412px;
        right: 45px;
    }
    .MenuLeftSildeLeft {
        top: 300px;
        left: 30%;
    }
    .TbGuide{
        top:250px;
        right:40px;
    }
    .GuideBox1 {
        left:60px;
    }
    #menuRight{
        z-index:9;
    }
    .GuideBox2 {
        right: 60px;
    }
    .GuideBox3 {
        top: 80px;
        right: 100px;
    }
    .GuideBox4 {
        top: 410px;
        right: 100px;
    }*/
    /*------------------------------------------------------------------
  	[navbar]
------------------------------------------------------------------*/
    /*.navbar.navbarA {
        max-height: 136px;
    }*/
    /*------------------------------------------------------------------
  	[Xinnan.html]
------------------------------------------------------------------*/
    /*.chartDiv {
        display: inline;
    }
    .NewSouth .xinnanChart, .chartTb {
        width: 100%;
    }
    .chartMinor {
        display: inline-block;
    }
    .chartMinor .Minor1 {
        width: 100%;
        margin-right: auto;
    }

    .chartMinor .Minor2 {
        width: 100%;
    }*/
    /*------------------------------------------------------------------
  	[login.cshtml]
------------------------------------------------------------------*/
    /*.login-content {
        margin-top: 0 !important;
    }

    .content-wrap {
        min-height: 600px;
    }*/
    /*------------------------------------------------------------------
  	[ul滑動表格]
------------------------------------------------------------------*/
    /*.table-td, .table-th{
        width: 70px;
        font-size: 12px;
    }*/
    /*------------------------------------------------------------------
  	[Highmaps]
------------------------------------------------------------------*/
    /*.map-chart .highcharts-container {
        position: relative !important;
        width: 330px !important;
        height: auto !important;
    }

    .map-chart .highcharts-root {
        width: 330px;
        height: 500px;
        padding-top:4em;
    }

    .highcharts-title {
        width: 100% !important;
        left: 0 !important;
        top: 0 !important;
        white-space: normal !important;
    }

    .blameChart .highcharts-root {
        padding-top:4em;
    }
    .table-chart .highcharts-root {
        padding-top: 4em;
    }*/
    /*------------------------------------------------------------------
  	[Highcharts]
------------------------------------------------------------------*/
    /*.chartContent .highcharts-container {
        width: 100% !important;
        height: 260px !important;
    }*/

    /*------------------------------------------------------------------
  	[HEADER]
------------------------------------------------------------------*/
    /*#Logo {
        width: 45px;
    }

    #LogoTitle {
        font-size: 17px;
    }

    .navbar.navbarA {
        padding: 5px;
    }

    #menuB ul > li a {
        font-size: 15px;
    }*/

    /*------------------------------------------------------------------
  	[MainDiv]
------------------------------------------------------------------*/
    /*.MainDiv {
        top: 100px;
        box-shadow: none;
    }

    .MainDivWork {
        min-height: 650px;
    }

    .MainCont {
        padding-top: 0;
        padding-bottom: 0;
    }*/

    /*------------------------------------------------------------------
  	[Char]
------------------------------------------------------------------*/
    /*.ChartMain {
        padding: 0 15px;
    }

        .ChartMain .chart {
            width: 100%;
            box-shadow: 0 2px 3px rgba(0,0,0,0.19), 0 1px 3px rgba(0,0,0,0.23);
        }

    .chartBtn {
        font-size: 15px;
        padding-left: 12px;
    }

    .chartContent {
        height: 275px;
        padding-bottom: 4px;
    }*/

    
    /*------------------------------------------------------------------
  	[advanced]
------------------------------------------------------------------*/
    /*.advanced-left .download {
        width: 20px;
        right: 10px;
    }

    .advanced2-form .owl-table-outer .item-fix .chartTitle {
        padding: 0 15px;
    }*/

    /*------------------------------------------------------------------
  	[Question]
------------------------------------------------------------------*/
    /*.QuesMain {
        padding: 0;
    }*/
    /*------------------------------------------------------------------
  	[NOTE]
------------------------------------------------------------------*/
    /*.noteDiv li {
        font-size: 12px;
    }*/

    /*------------------------------------------------------------------
  	[COOKIE]
------------------------------------------------------------------*/

    /*#cookie h2 {
        font-size: 15px;
    }

    .cookieCont p {
        font-size: 12px
    }

    #cookie .cookieBtn {
        width: 80px;
        height: 30px;
        font-size: 13px;
        margin-left: 1.5em;
        letter-spacing: 1px;
        line-height: 0;
    }

    #cookie .cookieImg img {
        width: 10px;
    }
}*/

@media screen and (max-width: 375px) {
    /*------------------------------------------------------------------
  	[Highmaps]
------------------------------------------------------------------*/
    .map-chart .highcharts-container {
        width: 291px !important;
        height: auto !important;
    }

    .map-chart .highcharts-root {
        width: 291px;
        height: 465px;
    }
}

@media screen and (max-width: 360px) {
    /*------------------------------------------------------------------
  	[Highmaps]
------------------------------------------------------------------*/
    .map-chart .highcharts-container {
        width: 276px !important;
        height: auto !important;
    }

    .map-chart .highcharts-root {
        width: 276px;
        height: 495px;
    }
}

@media (max-width: 500px) {
    .highcharts-subtitle {
        padding-top:40px;
    }
}
