@charset "utf-8";

#main-col ul li div.clearfix { background: #fff; }
#Wrapper { margin-bottom: 60px; }
#Wrapper .row { position: relative; }


/*----------slider----------*/
.owl-theme .owl-nav [class*=owl-] { padding: 6px 0 !important; }
#slider { margin-bottom: 20px; }
#slider .owl-dots, #slider .owl-nav { display: none; }
#slider .item .photo {
    height: 43vw;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    padding-top: 250px;
    padding-right: 10px;
}

@media only screen and (min-width: 768px) {
    #slider .item .photo { height: calc((100vw - 30px) * 0.43); }
}
@media only screen and (max-width: 1199px) and (min-width: 990px) {
    #slider .item .photo { height: 396px; border-radius: 17px !important; } /*width: 940px;*/
}
@media only screen and (min-width: 1199px) {
    #slider .item .photo { height: 520px; } /*1140px*/
}


/*----------列表----------*/
#part1 { padding: 0; }
#main-col { padding: 0; }

hgroup.subject { display: flex; justify-content: space-between; align-items: center; color: #fff; padding: 5px 0; border-radius: 3px; margin: 40px 15px 0; }
hgroup.subject h2 { font-weight: bold; margin: 0; font-size: 22px; }
hgroup.subject div { font-size: 16px; color: #fff; }

/*----------文章----------*/
.section-new-article { padding: 0; }
.section-new-article ul { padding: 0; margin: 0; }
.section-new-article li { padding: 0; }
.section-new-article li .item { display: grid; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; }

.section-new-article li img { position: relative; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; width: 100%; }
.section-new-article li .title { color: #432370; margin: 20px 20px 10px; font-size: 19px; line-height: 25px; font-weight: 400; }
.section-new-article li .summary { color: #000; margin: 0px 20px 10px; font-size: 15px; height: 72px; text-overflow: ellipsis; overflow: hidden; }
.section-new-article li .view_all { margin: 10px 20px 20px; }
.section-new-article li .view_all a { color: #A3A3A3; }

/*----------用戶----------*/
.section-new-user li img { position: relative; border-radius: 17px; width: 100%; height: 204.25px; }
.section-new-user li p { position: absolute; color: #fff; }
.section-new-user li p.name { bottom: 30px; left: 15px; background: linear-gradient(to right, #6928BB, #FF1474); border-radius: 30px; font-size: 16px; padding: 5px 10px 5px; max-width: calc(100% - 60px); white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
.section-new-user li p.greeting { bottom: 5px; left: 15px; max-width: calc(100% - 30px); white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }

ul.new-user-index { padding: 0; }
ul.new-user-index li { width: 20%; padding:0; float: left; display: block; }
@media only screen and (min-width: 1199px) {
    ul.new-user-index li:nth-child(6) { display: none; }
}
@media only screen and (max-width: 1199px) and (min-width: 990px) {
    ul.new-user-index li { width: 20%; }
    ul.new-user-index li .item .photo a > img { height: 167.47px; }
    ul.new-user-index li:nth-child(6) { display: none; }
}
@media only screen and (max-width: 990px) and (min-width: 768px) {
    ul.new-user-index li { width: 33.3%; }
    ul.new-user-index li .item .photo a > img { height: calc((90.5vw - 60px) * 0.333); }
}
@media only screen and (max-width: 768px) and (min-width: 640px) {
    ul.new-user-index li { width: 33.3%; }
    ul.new-user-index li .item .photo a > img { height: calc((90.5vw - 60px) * 0.333); }
}
@media only screen and (max-width: 640px) and (min-width: 500px) {
    ul.new-user-index li { width: 50%; /*float: none;*/ }
    ul.new-user-index li .item .photo a > img { width: 100%; height: 44.5vw; }
    hgroup.subject h2 { font-size: 24px; padding: 2px 0; }
    #Wrapper.container, #Wrapper #main-col { padding: 0 }
}

@media only screen and (max-width: 500px) and (min-width: 400px) {
    ul.new-user-index li { width: 50%; /*float: none;*/ }
    ul.new-user-index li .item .photo a > img { width: 100%; height: 44.5vw; }
    hgroup.subject h2 { font-size: 24px; padding: 2px 0; }
    #Wrapper.container, #Wrapper #main-col { padding: 0 }
}

@media only screen and (max-width: 400px) {
    ul.new-user-index li { width: 50%; /*float: none;*/ }
    ul.new-user-index li .item .photo a > img { width: 100%; height: 44.5vw; }
    hgroup.subject h2 { font-size: 24px; padding: 2px 0; }
    #Wrapper.container, #Wrapper #main-col { padding: 0 }
}


/*----------footer----------*/
footer { background: #e21882; }
footer .link { display: flex; flex-direction: row; align-items: center; justify-content: center; }
footer .left { margin-right: 20px; }
footer .right { margin-left: 20px; }
footer .right div { margin-bottom: 10px; }
footer .right .web { background: #a71e93; padding: 10px 5px; border-radius: 10px; }
footer img { width: 100px; }
