body{ font-family: 'Noto Sans TC', sans-serif;}
.custom-container-width{ max-width: 1200px;}
.navbar{ height: 60px; background: #fff;}
.navbar-brand{ width: 142px;}
.navbar-nav{ margin-left:100px;}
.nav-item{ margin:auto 2vw;}
.nav-item a{ color: #000; font-weight: normal; display: block;}
.cover{ height: 100vh; background: url(../images/cover_pic.jpg) center top no-repeat; margin-top:60px; background-size: cover;}
.cover2{ height: 100vh; background: url(../images/cover_pic2.jpg) center top no-repeat; background-size: cover;}
.cover_top img,.cover_top2 img{ max-width: 100%; min-width: 1280px;}
.dropdown-menu{ left:-45px; background: #000;}
.dropdown-item{ font-size: 0.9rem;}
.cover_top,.cover_top2{ height: 100%;}
.cover_top .cover_l{ background: url(../images/cover_top.png) left bottom no-repeat; background-size: cover;}
.cover_top .cover_r{ background: url(../images/cover_top.png) right bottom no-repeat; background-size: cover;}
.cover_top2 .cover_l{ background: url(../images/cover_top2.png) left top no-repeat; background-size: cover;}
.cover_top2 .cover_r{ background: url(../images/cover_top2.png) right top no-repeat; background-size: cover;}
.anigif{ position: absolute; width: 787px; left: calc(50% - 722px); top: 156px;}

/*article*/
article{ background: #00b5a6;}
.group{ margin-top: -150px;}
.title img{ max-width: 600px;}
.article_pic{ text-align: center;}
.article_pic img{ width: 518px; margin-left:calc(50% - 259px); padding-right:24px;}
h3{ font-weight: 900; color: #fff; font-size: 1.5rem; line-height: 2.6rem; text-align: center;}
.text_1{ margin-top:96px;}
.article_text p{ font-weight: 400; text-align: justify; line-height: 2rem; font-size:1.1rem; color:#fff;}
.more { padding: 8px 35px; font-weight: bolder; font-size: 1.5rem; line-height: 1rem; color:#feb4be; border:#b6c5cd 3px solid;}
.more:hover{ text-decoration: none; color: #b6c5cd; background: #e1f4fe;}

/*youtube*/
.youtube{ background:#029c9b url(../images/video_bg.jpg)center center no-repeat; position: relative; background-size:contain; height: 56vw;}
.youtube iframe{ max-width: 73vw; max-height: 41vw; margin-left:calc(50% - 36.5vw); margin-top:7.6vw; box-shadow: 6px 6px 10px rgba(0, 0, 0, 0.3);}

.center-vertical{ position: relative; top: 50%; transform: translateY(-50%);}
.gallery_text{ z-index: 10; bottom:0; width: 100%; background: #038390; padding-top:25px}
.gallery_pic{ margin-left: calc(50% - 35vw); width: 70vw; z-index: 20; bottom:2vw;}

/*footer*/
footer{ background: #231815; text-align: center;}
footer ul{ display: inline-block;}
.footer_text li{ float:left; color:#fff; list-style: none; padding:0 50px;}
.copyright{ color: #959595;}
footer a,footer a:hover{ color: #fff}

@media screen and (max-width: 992px){
    .navbar-nav{ display: none;}
}
@media screen and (max-width: 768px){
    .navbar{ height: 8vh;}
    .cover{ background: url(../images/cover_pic_m.jpg) center top no-repeat; background-size: cover; height: 176vw;}
    .cover2{ background: url(../images/cover_pic2_m.jpg) center top no-repeat; background-size: cover; height: 180vw;}
    .cover_top,.cover_top2{ display: none;}
    .navbar-brand{ width: 12vh;}
    .group{ margin-top:-51px; width: 100%;}
    article{ height: auto; background-size: cover;}
    .pic_1{ margin-top:-20px}
    .article_pic img{ margin-left:auto;  padding-right:0;}
    h3{ font-size: 0.85rem; letter-spacing: 0; line-height: 1.4rem; text-align: center;}
    .article_text{ padding:16px 19px;}
    .text_1{ margin-top:0;}
    .article_text p{ font-size:0.6rem; line-height: 1.5rem;}
    .more { padding: 2px 20px 3px; font-weight: bolder; font-size: 1.2rem; line-height: 1.1rem; color:#b6c5cd; border:#b6c5cd 2px solid; margin-top: -8px;}
    footer{ margin-top: 0;}
    .footer_text li{ padding:0; float:none; border-color:#231815!important;}
    .footer_text{ padding-left: 0;}
    .social_icon{ padding-left: 0 ; margin-left: -7vw;}
    .gallery{ position: relative;}
    .gallery_text{ z-index: 10; margin:0 auto; position: relative; left: auto; width: 100%; }
    .gallery_pic{ width: 30vw; margin-left: calc(50% - 15vw); position: relative;}
    .youtube{ background: url(../images/video_bg_m.jpg)center center no-repeat; background-size: cover; height: 64vw;}
    .youtube iframe{ max-width: 84vw; max-height: 49.5vw; margin-left:calc(50% - 42vw); margin-top:10.3vw; border:8px solid #fff!important; background: #fff;}
}