:root {
  --main-radius: 5rem;
}

html,
body {
    font-size: 3.125vw;
    letter-spacing: 0.01em;
    overflow-x: hidden;
}

button{
    background: transparent;
}

body {
    position: relative;
    overflow-x: hidden;
    width: 100%;
    font-family: "Roboto", "Microsoft JhengHei", "微軟正黑", sans-serif;
    font-weight: 400;
    line-height: 1.4;
    color: #000;
}

img {
    display: block;
    width: 100%;
    height: auto;
}

h2{
    font-size: 2rem;
    letter-spacing: 0;
}

h2 p.main_title{
    font-size: 1em;
}

h2 p.main_title2{
    font-size: 0.8em;
}

h2 p.sub_title{
    font-size: 0.6em;
    letter-spacing: 0.01em;
}

h3{
    font-size: 1rem;
    letter-spacing: 0.01em;
}


h3 p,h3 li{
    font-size: 1em;
}

h3 p.info{
    font-size: 1.5em;
    margin-bottom: 0.5rem;
}

h4 p.title,
h3.content_transition{
    font-size: 1.25em;
    font-weight: 600;
}

h3.content_transition span.bigger{
    display: inline-block;
    font-size: 1.6em;
    color: #0672CB;
    border-bottom: 0.2rem solid #0672CB;
}

h3.magic_name p{
    font-size:  2.05em;
}

h4 p.award_info{
    font-size: 0.9rem;
}

h4 p.award_tag{
    font-size: 1.175rem;
}

h4 p.award_name{
    font-size:  0.9rem;
}

h4 p.award_number{
    font-size:  0.75rem;
}

p{
    font-weight: 600;
}

a.btn_link{
    text-decoration: underline;
}

.row_btn{
    margin-top: 2rem;
}

a.btn_primary{
    position: relative;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    padding: 0.2rem 0 0.2rem 0.7rem;
    font-weight: 600;
    color: #fff;
    font-size:  0.9rem;
    background: linear-gradient(180deg, #0672CB 0%, #0C32A4 100%);
    border-radius: 0.275rem;
    box-shadow:  0.15rem 0.15rem 0.3rem rgba(20,42,99,0.3);
    transition: all ease .3s;
}

a.btn_primary img{
    width: 0.8rem;
    transform: translateX(50%);
    transition: all ease .3s;
}

a.btn_media{
    display: block;
    transition: all ease .3s;
}

ul.list_content{
    text-align: left;
}

ul.list_content li{
    position: relative;
    font-weight: 400;
    list-style: none;
    padding-left: 1.1em;
    margin-bottom: 0.3rem;
}

ul.list_content li::before{
    position: absolute;
    top: 0;
    left: 0;
    content:"◆";
    display: block;
}

ul.list_content  p.notice{
    font-size: 0.833rem;
    font-weight: 400;
    margin-top: 1rem;
}



.container_slide .simple-pagination{
    position: relative;
    z-index: 9;
    margin: 2rem 0 0 0;
}

.container_slide .simple-pagination > * ~ *{
    margin-left: 1.2rem;
}

.container_slide .simple-pagination{
    display: flex;
    display: -ms-flexbox;
    justify-content: center;
    align-items: center;
}

.container_slide .simple-pagination .pagination{
    display: flex;
    display: -ms-flexbox;
    align-items: center;
    width: auto;
}

.container_slide .simple-pagination .swiper-pagination-bullet{
    display: block;
    font-size: 0;
    color: #fff;
    border-radius: 100%;
    width: 0.575rem;
    height: 0.575rem;
    box-sizing: border-box;
    border: 0.1rem solid #CDCDCD;
    transition: all ease .3s;
    background: transparent;
    opacity: 1;
}

.container_slide .simple-pagination .swiper-pagination-bullet ~ .swiper-pagination-bullet{
    margin-left: 0.5rem;
}

.container_slide .simple-pagination .swiper-pagination-bullet-active{
    cursor: default;
    display: block;
    width: 1.5rem;
    height: 2rem;
    text-align: center;
    line-height: 2rem;
    font-size: 1rem;
    color: #fff;
    background: url("../images/dec_number.svg") no-repeat;
    background-size: 100%;
    background-position: center;
    border: none;
    border-radius: 0;
}

.container_slide .simple-pagination .pagination_arrow{
    position: relative;
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-radius: 0;
    background: transparent;
    margin-top: initial;
    transition: all ease .3s;
}

.container_slide .simple-pagination .pagination_arrow::after{
    display: none;
}

.container_slide .simple-pagination .swiper-button-prev{
    border-width: 0.5rem 0.8rem 0.5rem 0;
    border-color: transparent #0672CB  transparent transparent;
}

.container_slide .simple-pagination .swiper-button-next{
    border-width: 0.5rem 0 0.5rem 0.8rem;
    border-color: transparent   transparent transparent #0672CB;
}

header.header_nav.is-active{
    background: #fff;
}

section{
    position: relative;
}

section.section_magic ~ section.section_survey{
    padding: 7% 0 ;
}


section .row{ 
    justify-content: center;
}

section .section_bg{
    display: none;  
}

section .item_info{
    text-align: center;
}

.section_kv{
    position: relative;
    z-index: 1;
}

.section_transition .transition_container{
    margin-bottom: 2rem;
    padding: 2.5rem 2rem;
    text-align: center;
    background: #F1F5FF;
    border-radius: 0 0 3.75rem 3.75rem;
    box-shadow: 0px 0.2rem 1rem rgba(0, 0, 0, 0.20);
}

.section_transition .content_transition p ~ p{
    margin-top: 2.17rem;
}

.section_magic{
    padding-bottom: 4.5%;
    background: linear-gradient(180deg, #FFF 15%, rgba(255, 255, 255, 0.00) 40%) ,url("../images/bg_magic.jpg");
    background-repeat:  repeat-x ,no-repeat;
    background-position: center top,center bottom;
}


.section_magic .item_magic{
    position: relative;
}


.section_magic .item_magic .btn_magic{
    display: block;
    transition: all ease .3s;
}


.section_magic .item_magic .magic_close,
.section_magic .item_magic .magic_open{
    position: absolute;
    top: 0; 
    left: 0;    
    right: 0;   
    bottom: 0;  
    width:  100%;
    height: 100%;
    margin: auto;
    z-index: 1;
}

.section_magic .item_magic .magic_open{
    transition: all ease .3s;
}

.section_magic .item_magic .magic_front{
    position: relative;
    z-index:  3;
}

.section_magic .item_magic h3{
    position: absolute;
    margin: auto;
    width:  100%;
    top: 19.43%; 
    left: 0;    
    right: 0;
    text-align: center;
    z-index: 2;
    color: #0672CB;
    text-shadow: 0px 0px 0.5rem rgba(255, 255, 255,1) ,0px 0px 0.3rem rgba(255, 255, 255, 1);
    transition: all ease .3s;
}

.section_box {
    padding: 5% 0;
}

.section_box .item_title{
    position: relative;
    margin:  2rem auto 1.25rem auto;
    color: #fff;

}

.section_box .item_title .dec_title{
    position: absolute;
    left: 0.3rem; 
    bottom: 0.5rem;   
    width: 6.925rem;
    z-index: 3;
}

.section_box .item_title .sub_title{
    position: relative;
    border-radius: 0 0 var(--main-radius) 0;
    background: #0672CC;
    margin-bottom: -1.2rem;
    z-index: 2;
    width:  5rem;
    padding:  0 1rem 0 2.075rem;
    margin-left: 5.925rem;
    box-shadow: 0.15rem 0.15rem 0.17rem rgba(20, 42, 99, 0.30);
}

.section_box .item_title .main_title{
    padding:  1.3rem 3.85rem 0rem  8rem;
    padding-top:    ;
    border-radius: var(--main-radius) 0rem;
    background: #0C32A4;
    box-shadow: 0.225rem 0.225rem 0.4rem rgba(20, 42, 99, 0.30);
}

.section_box .item_info{
    margin-bottom:  1.5rem;
}

.section_box .contnet .title{
    color: #0C32A4;
    margin-bottom: 0.4rem;
}

.section_box .card_content{
    position: relative;
}

.section_box .card_content::before{
    position: absolute;
    content:"";
    display: block;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 100%;
    height: 100%;
    background: #80C7FB;
    opacity: 0.7;
    transform: skew(-10deg);
    z-index: 0;
}

.section_box .card_content .contnet,
.section_box .card_content .item_pic{
    position: relative;
    z-index: 2;
}

.section_box .section_dec img{
    position: absolute;
    width: 58.1%;
    height: auto;
    z-index: 0;
}

.section_box .container,.section_box .container-fluit{
    position: relative;
    z-index: 2;
}

/*.section_box .container_slide  .swiper-wrapper{
    overflow: hidden;
}
*/
.section_time{
    background: #E6E9EE;
}

.section_time .section_dec img:nth-of-type(1){
    top: 0;
    bottom: 0;
    left: -17.13%;
    margin: auto;
}

.section_time .section_dec img:nth-of-type(2){
    right: -35.4%;
    bottom: 0;
}

.section_time .row{
    flex-direction: column;
    align-items: center;
}

.section_time  .card_pic{
    transform: skew(-10deg);
    overflow: hidden;
    border: 0.45rem solid #80C7FB;
}


.section_time .col{
}

.section_time .card_pic img{
    transform: skew(10deg) scale(1.1);
}


.section_time .item_content{
    position: relative;
    text-align: center;
    margin-top: -1.3rem;
    z-index: 2;
}

.section_time .item_content:has(.title){
    padding: 1.5rem 2.5rem 1.8rem 2.5rem;
}

.section_time .item_content:has(.notice){
    padding: 1.8rem 2rem 1.5rem 2.5rem;
}

.section_time .item_content:has(.btn_primary){
    padding-bottom: 0;
    margin-bottom: 1rem;
}

.section_time .item_content .btn_primary{
    margin: auto;
    transform: translateY(50%);
}

.section_time .item_time1 .card_pic{
    border-radius: var(--main-radius) 0rem 0rem 0rem;
}

.section_time .item_time1 .item_content::before,
.section_time .item_time3 .item_content::before{
    border-radius: 0 0 var(--main-radius) 0;
}

.section_time .item_time2 .card_pic{
    border-radius: 0rem 0rem var(--main-radius)  0rem;
}

.section_time .item_time2 .item_content::before{
    border-radius: var(--main-radius)  0 0 0;
}

.section_time .item_time3  .item_pic {
    position: relative;
    z-index: 3;
}

.section_time .item_time4 .row_info{
    margin-bottom: 2rem;
}

.section_time .item_time4 .row_content{
    text-align: left;
    flex-direction: row;
    align-items: center;
}

.section_time .item_time4  .item_pic {
    position: relative;
    z-index: 3;
    transform: translateY(-12%);
}

.section_time .item_time4 .row_content:nth-of-type(2) {
    margin-bottom: 3rem;
}

.section_time .item_time4 .row_content:nth-of-type(2) .item_content::before{
    border-radius: 0 0 var(--main-radius) 0;
}

.section_time .item_time4 .row_content:nth-of-type(2) .item_content{
    margin-left: -18%;
    padding-left: 20%;
}

.section_time .item_time4 .row_content:nth-of-type(3) .item_content::before{
    border-radius: var(--main-radius)  0 0 0;
}

.section_time .item_time4 .row_content:nth-of-type(3) .item_content{
    margin-right: -18%;
    padding: 2rem 2rem 1.8rem 2.5rem;
    padding-right: 18%;
}



.section_power{
    background: #C6E6FD;
}

.section_power .section_dec img:nth-of-type(2){
    bottom: 0;
    left: -8.125%;
}

.section_power .item_power1 .item_content{
    display: flex;
    display: -ms-flexbox;
    justify-content: space-between;
}

.section_power  .title{
    color: #0C32A4;
}

.section_power .item_power2 .card_content{
    box-sizing: border-box;
}

.section_power .item_power2 .row_content:nth-of-type(2){
    align-items: stretch;
    margin-bottom: 1rem;
}

.section_power .item_power2 .row_content:nth-of-type(2) .item_pic,
.section_manage .item_manage1 .item_pic{
    position: relative;
    z-index: 2;
}

.section_power .item_power2 .row_content:nth-of-type(2) .card_content::before,
.section_manage .item_manage1 .row_content:nth-of-type(2) .card_content::before{
    border-radius: 0 0 var(--main-radius) 0;
}


.section_power .item_power2 .row_content:nth-of-type(3){
    justify-content: flex-start;
}

.section_power .item_power2 .row_content:nth-of-type(3) .card_content::before,
.section_manage .item_manage1 .row_content:nth-of-type(3) .card_content::before{
    border-radius: var(--main-radius)  0 0 0;
}

.section_power .item_power2 .row_content:nth-of-type(3) .card_content{
    align-items: center;
    justify-content: center;
}


.section_space .item_space1 .item_content{
    margin-top: 1rem;
}

.section_space{
    background: #E6E9EE;
}

.section_space .section_dec img:nth-of-type(2){
    bottom: 0;
    left: -8.125%;
    transform: translateY(26.9%);
}

.section_space .section_dec img:nth-of-type(1){
    right: -25.36%;
    top: 0;
    transform: translateY(-18.73%);
}

.section_manage{
    background: #C6E6FD;
}

.section_manage .section_dec img:nth-of-type(2){
    bottom: 0;
    left: -8.125%;
}

.section_manage .section_dec img:nth-of-type(1){
    right: -25.36%;
    top: 0;
    transform: translateY(92%);
}


.section_manage .item_manage1 .row_content{
    position: relative;
    align-items: center;
}


.section_manage .item_manage1 .row_content .col-pic{
    position: absolute;
}


.section_manage .item_manage1 .row_content:nth-of-type(2){
    margin-bottom: 3rem;
}

.section_manage .item_manage1 .row_content:nth-of-type(2) .card_content{
    padding: 1rem;
    padding-left: 30%;
}

.section_manage .item_manage1 .row_content:nth-of-type(2) .col-pic{
    left: 0;
}


.section_manage .item_manage1 .row_content:nth-of-type(3) .card_content{
    padding: 1rem;
    padding-left: 4rem;
    padding-right: 30%;
}

.section_manage .item_manage1 .row_content:nth-of-type(3) .col-pic{
    right: 0;
}

.section_more{
    background: #C6E6FD;
}

.section_more .item_title,.section_survey .item_title{
    margin-bottom: 1rem;
}

.section_more .row_content{
    align-items: center;
}

.section_more .item_pic{
    padding: 0.5rem;
}

.section_survey{
    background-image: linear-gradient(180deg, #C6E6FD 0%, rgba(198, 230, 253, 0.00) 20%) ,url("../images/bg_award.jpg");
    background-repeat: repeat-x ,no-repeat;
    background-size: 100% ,cover;
    background-position: center;
}

.section_survey .row_award{
    justify-content: space-between;
} 

.section_survey .item_info p{
    font-weight: 600;
}

.section_survey .item_info p:nth-of-type(3){
    margin-top: 0.5rem;
    font-weight: 400;
}

.section_survey .award_name{
    text-align: center;
    color: #0C32A4;
}

.section_survey .award_name .number{
    margin: auto;
    margin-top: 0.5rem;
    border-radius: 100px;
    width: 3em;
    color: #fff;
    background: #0C32A4;
}

.section_survey a.btn_survey{
    transition: all ease .3s;
}


.box_modal .container{
    width:  100%;
}

.box_modal .btn_close{
    width: 3em;
    min-width: 35px;
    height: 3em;
    min-height: 35px;
    background: #0C32A4;
}

.box_modal .title{
    text-align: center;
    color: #0C32A4;
    margin-bottom:  1rem;
}

.box_modal .modal_content{
    position: relative;
    padding: 1.66rem;
    width: 92%;
}

.box_modal .modal_content .dec{
    position: absolute;
    width: 10%;
    min-width: 5.5rem;
}

.box_modal .modal_content .dec:nth-of-type(1){
    top: 0;
    left: 0;
}

.box_modal .modal_content .dec:nth-of-type(2){
    bottom: 0;
    right: 0;
}

.box_modal .content_inner{
    position: relative;
    padding: 3rem;
    background: #fff;
}

.info_modal .content_inner{
    max-height: 75vh;
    color: #333;
}

.info_modal .row{
    justify-content: center;
    align-items: center;
}

.info_modal .content_inner ul.list{
    margin-left: 1.2em;
}

.info_modal .content_inner ul.list  li{
    line-height: 1.6;
    margin-bottom: 0.5em;
}

.box_modal.award_modal .modal_content{
    padding: 0;
}

.box_modal.award_modal .content_inner{
    padding: 0;
    background: transparent;
}

.box_modal.award_modal .btn_close{
    border-radius: 100%;
}

footer{
    background: linear-gradient(180deg, #00366F 0%, #07509D 100%);
}


@media screen and (max-width:767px) {
	html,
    body {
        overflow-x: hidden;
    }

    .container{
        width: 92%;
        margin: auto;
    }

    .b_br {
        display: none;
    }

    .pc_block{
        display: none;
    }

    a.btn_primary{
        transform: scale(1.4);
    }

    .section_time .item_content  a.btn_primary{
        transform: translateY(50%) scale(1.4);
    }

    .simple-pagination{
        transform: scale(1.8);
    }

    .section_magic{
        background-size: cover;
    }

    .section_magic .col-magic:nth-of-type(odd){
        margin-top: 2.4rem;
    }

    .section_magic .item_magic .magic_close{
        display: none;  
    }

    .section_box .item_title .main_title{
        padding: 1.6rem 2.5rem 0.7rem 8rem;
    }

    .section_box .section_dec img{
        width: 59.375%;
    }

    .section_time .item_content{
        margin-top: -1.3rem;
    }

    .section_time .section_dec img:nth-of-type(1){
        top: 15%;
        left: -18.59%;
        bottom: initial;
    }

    .section_time .item_time4 .row_content{
        flex-direction: column;
    }

    .section_time .item_time4 .row:nth-of-type(2) .col:nth-of-type(1){
        align-self: flex-start;
        margin-bottom: -1rem;
    }

    .section_time .item_time4 .row:nth-of-type(2) .col:nth-of-type(2){
        align-self: flex-end;
    }

    .section_time .item_time4 .row:nth-of-type(3) .col:nth-of-type(1){
        align-self: flex-start;
    }

    .section_time .item_time4 .row:nth-of-type(3) .col:nth-of-type(2){
        align-self: flex-end;
        margin-top: -4.5rem;
    }

    .section_power .section_dec img:nth-of-type(2){
        top: 0;
        bottom: initial;
        left: -8.125%;
        transform: translateY(29.94%);
    }

    .section_power .section_dec img:nth-of-type(1){
        bottom: 0;
        right: -27.34%;
        transform: translateY(14.17%);
    }

    .section_power .item_power1 .item_content{
        flex-direction: column;
        justify-content: space-around;
        padding-left: 0.5rem;
        margin-left: 1.5rem;
    }

    .section_time .item_time4 .row_content:nth-of-type(3) .item_content{
        margin-right: 0;
        padding-right: 1rem;
    }

    .section_power .item_power2 .row_content:nth-of-type(2){
        flex-direction: column;
        margin-bottom: 2rem;
    }

    .section_power .item_power2 .row_content:nth-of-type(2) .col{
        position: relative;
    }

    .section_power .item_power2 .row_content:nth-of-type(2) .item_pic{
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
    }

    .section_power .item_power2 .row_content:nth-of-type(2) .col:nth-of-type(2){
        align-self: flex-end;
    }

    .section_power .item_power2 .row_content:nth-of-type(2) .card_content{
        padding: 2rem 1.5rem 2rem 10.5rem;
        transform: translateX(-1rem);

    }

    .section_power .item_power2 .row_content:nth-of-type(3){
        justify-content: center;
    }

    .section_power .item_power2 .row_content:nth-of-type(3) .card_content{
        justify-content: center;
        padding: 0.5rem 1rem 0.5rem 1rem;
    }

    .section_space .section_dec img:nth-of-type(2){
        bottom: 0;
        left: -19%;
        transform: none;
    }

    .section_space .section_dec img:nth-of-type(1){
        right: -13.43%;
        top: 0;
        transform: translateY(11.84%);
    }

    .section_manage .section_dec img:nth-of-type(2){
        bottom: 0;
        left: -21.5%;
        transform: translateY(-10%);
    }

    .section_manage .section_dec img:nth-of-type(1){
        right: -22.9%;
        top: 0;
        transform: translateY(4.5%);
    }


    .section_manage .item_manage1 .row_content:nth-of-type(2){
        margin-bottom: 1.5rem;
    }

    .section_manage .item_manage1 .row_content:nth-of-type(2) .card_content{
        padding: 1.5rem;
        padding-left: 43%;
    }

    .section_manage .item_manage1 .row_content:nth-of-type(3) .card_content{
        padding: 1.5rem;
        padding-left: 2rem;
        padding-right: 40%;
    }

    .section_manage .item_manage2 .row_content .col-content{
        order: 2;
        margin-top: 1rem;
    }


    .section_manage .item_manage2 .row_content .col-pic{
        order: 1;
    }

    .section_manage .card_content .contnet{
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }

    .section_more .row_content .item_text{
        display: flex;
        display: -ms-flexbox;
        align-items: center;
    }

    .section_more .row_content .col_more ~ .col_more{
        margin-top: 1rem;
    }

    .section_more .row_content .item_text img{
        width: 7.5rem;
        margin-right: 0.8rem;
    }

    .section_survey .row_award{
        justify-content: space-between;
    }

    .section_survey .row_award .col-award:nth-of-type(1){
        display: flex;
        display: -ms-flexbox;
        justify-content: center;
    }

    .box_modal.award_modal .btn_close{
        width: 2em;
        height: 2em;
        top: 0rem;
        right: -0.5rem;
    }

}

@media screen and (min-width:768px) {
	html,
    body {
        font-size: 1.2vw;
        letter-spacing: 0.02em;
    }

    .s_br {
        display: none;
    }

    .m_block{
        display: none;
    }


    ul.list li{
        font-size: 0.8rem;
    }

    .container {
        width: 88%;
    }

    .simple-pagination{
        transform: scale(1.2);
    }

    .section_magic{
        background-size: 100%;
    }


    .section_magic .row{
        flex-wrap: nowrap;
    }


    .section_magic .col-magic:nth-of-type(even){
        margin-top: 4rem;
    }

    .section_magic .col-magic ~ .col-magic{
       margin-left: -3.2%;
    }

    .section_magic .item_magic .magic_open{
        opacity: 0;
        transform: translateY(0.5rem) scale(0.6);
        transform-origin: center bottom;
    }

    .section_magic .item_magic h3{
        opacity: 0;
        transform: translateY(1rem) scale(0.9);
        transform-origin: center bottom;
    }

    .section_power .section_dec img:nth-of-type(1){
        display: none;
    }

    .section_power .item_power1 .row_content{
        flex-direction: row;
    }

    .section_power .item_power1 .item_content{
        padding: 1rem 1rem 0 0.5rem;
    }

    .section_time .item_content{
        margin-top: -1.7rem;
    }

    .section_time .item_time1 .col:nth-of-type(1){
        align-self: flex-start;
        margin-left: 3.5%;
    }

    .section_time .item_time1 .col:nth-of-type(2){
        align-self: flex-end;
        margin-right: 3.5%;
    }

    .section_time .item_time2 .col:nth-of-type(1){
        align-self: flex-end;
        margin-right: 3.5%;
    }

    .section_time .item_time2 .col:nth-of-type(2){
        align-self: flex-start;
        margin-left: 3.5%;
    }

    .section_power .item_power2 .row_content:nth-of-type(2) .card_content{
        padding: 0.8rem 2.5rem 0.8rem 2rem;
        transform: translateX(-2rem);
        height: 80%;
    }

    .section_power .item_power2 .row_content:nth-of-type(3) .card_content{
        padding: 0.8rem 2.5rem 0.8rem 2.5rem;
    }

    .section_manage .item_manage2 .row_content{
        justify-content: space-around;
    }

    .section_more .row_content .col_more ~ .col_more{
        margin-left: 1rem;
    }

    .section_more .row_content .item_text img{
        width: 7.425rem;
        margin-bottom: 0.8rem;
    }

    .box_modal.award_modal .btn_close{
        width: 2.5em;
        height: 2.5em;
        top: 3.5rem;
        right: 1rem;
    } 
}

@media screen and (min-width:992px) {

    html,
    body {
        font-size: 1.45vw;
    }

    .container {
        width: 82%;
    }

    .box_modal.award_modal .btn_close{
        width: 2.2em;
        height: 2.2em;
        top: 2.6rem;
        right: 0.5rem;
    }

}


@media screen and (min-width:1366px) {

    html,
    body {
        font-size: 1.46vw;
    }

    h2{
        font-size: 2.5rem;
    }

    .container {
        width: 76%;
    }

}

@media screen and (min-width:1600px) {

    html,
    body {
        font-size: 1.5vw;
    }
    .container {
        width: 72%;
    }

    .section_box {
        padding: 3% 0 5% 0;
    }
    
}

@keyframes uptodown-play {
  0% {
    transform: translate(0, -20px);
  }

  100% {
    transform: translate(0, 0);
  }
}

@keyframes color-change {
  0%{
    filter: contrast(100%) brightness(1) grayscale(0);
  }
  33% {
    filter: contrast(125%) brightness(1.1) grayscale(25%);
  }
  66% {
    filter: contrast(120%) brightness(0.9) grayscale(10%);
  }
  100% {
    filter: contrast(100%) brightness(1) grayscale(0);
  }
}

@media (hover: hover) {
    a.btn_primary:hover{
        filter: contrast(120%) brightness(1.1);
        box-shadow:  0rem 0rem 0.4rem rgba(0,79,255,1);
    }

    a.btn_primary:hover img{
        transform: translateX(50%) scale(1.2);
    }

    a.btn_media:hover{
        filter: contrast(101%) brightness(1.1);
    }

    .section_magic .item_magic .btn_magic:hover{
        transform: translateY(-0.5rem) scale(1.1);
    }

    .section_magic .item_magic .btn_magic:hover .magic_open,
    .section_magic .item_magic .btn_magic:hover h3{
        opacity: 1;
        transform: translateY(0);
    }

    .simple-pagination .pagination_arrow[role=button]:hover,
    .simple-pagination .swiper-pagination-bullet:hover{
        transform: scale(1.2);
        filter: contrast(150%) brightness(1.1) drop-shadow(0 0 0.5rem #fff);
    }

    .simple-pagination .swiper-pagination-bullet-active:hover{
        transform: none;
        filter: none;
    }

    a.btn_survey:hover{
        filter: contrast(120%) brightness(1.1);
        box-shadow:  0rem 0rem 0.4rem rgba(0,79,255,1);
    }
}

