@charset "utf-8";
/* CSS Document */

.maintitle{ background-image:url(../images/page/maintitlebg.jpg); background-repeat:no-repeat; background-position:center; background-size:cover; -webkit-background-size:cover; -moz-background-size:cover; margin-top:150px; text-align:center; padding:40px 0 45px 0; background-attachment: fixed; }
.maintitle .ch{ font-size:3.125rem; color:#fc8738; font-weight:700; line-height:100%; font-family:'Noto Serif TC', serif; }
.maintitle .ch h1{ font-size:3.125rem; color:#fc8738; font-weight:700; line-height:100%; font-family:'Noto Serif TC', serif; }
.maintitle .en{ font-size:1.125rem; color:#777; margin:0 0 10px 0; font-weight:300; }

.navbox{ padding:30px 15px 50px 15px; }
.navbox .mar{ max-width:1280px; margin:auto; }
.navbox .mar a{ color:#333; font-size:1rem; margin-right:5px; }
.navbox .mar span{ color:#333; font-size:1rem; margin-right:5px; }
.navbox .mar span.tail{ color: #fc8738; }

.contentbox{ padding:0 15px; margin-bottom:100px; }
.contentbox .mar{ max-width:1280px; margin:auto; }

.filterbox{ background:#eee; padding:20px; margin-bottom:40px; display: flex; align-items: center; flex: 1; flex-wrap: wrap; justify-content: center; }
.filterbox .search_s{ display:flex; align-items: center; flex: 1; padding: 0 15px 0 0; }
.filterbox .search_s .sh1{ font-size:1rem; padding:0 10px 0 0; color:#333; }
.filterbox .search_s .sinput{ flex:1; }
.filterbox .search_s .sinput label{ display:none; }
.filterbox .search_s .sinput input{ width:100%; line-height:32px; background:#fff; border:none; padding:0 10px; font-size:1rem; color:#333; }
.filterbox .search_s .btns{ width:100px; }


.filterbox .slistbox{ padding:20px 0 40px 0; width:100%; }
.filterbox .s_list{ display:flex; margin-bottom:10px; align-items: baseline; padding: 0 0 15px 0; border-bottom: 1px solid #ccc; }
.filterbox .s_list:last-child{ margin:0; padding:0; border:none; }
.filterbox .s_list .s_k1{ font-size:0.875rem; padding-right:15px; position:relative; color:#777; }
.filterbox .s_list .s_k1:after{ content:""; display:block; position:absolute; top:5px; right:0; width:1px; height:12px; background:#ccc; }
.filterbox .s_list .s_k2{ padding-left:15px; flex:1; display:flex; flex-wrap:wrap; }
.filterbox .s_list .s_k2 .grids{ margin: 3px 20px 3px 0; display:flex; align-items: center; }
.filterbox .s_list .s_k2 .grids .txt{ font-size:1rem; color:#333; display:inline-block; vertical-align:middle; line-height: 100%; padding:0 0 0 3px; }

.filterbox .search_btns{ text-align:center; }
.filterbox .search_btns button{ display:inline-block; cursor:pointer; line-height:32px; border:none; background:#fc8738; color:#fff; font-size:1rem; padding:0 10px; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; padding:0 30px; }

.filterbox .slistbox .masks .sbtnbox{ display:none; }

.filterbox .mob_filbtn{ display: block; text-align: right; padding: 0 15px 0 0; }
.filterbox .mob_filbtn .btn { display: inline-block; color: #fc8738; border:1px solid #fc8738; font-size: 0.875rem; padding: 5px; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; cursor: pointer; }
.filterbox .mob_filbtn .fa { color: #fc8738; font-size: 0.875rem; }
.filterbox .mob_sort{ display:none; }

.filterend{ margin-bottom:20px; font-size:0.875rem; color:#999; }

/*news*/
.newsbox{ margin-left:-15px; display:flex; flex-wrap:wrap; }
.newsbox .grids{ padding:0 0 60px 15px; width:33.33334%; display:flex; }
.newsbox .grids .gs{ display:block; background:#fff; width:100%; box-shadow: 0 0 10px rgba(0,0,0,0.1); transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all; position:relative; padding-bottom:50px; }
.newsbox .grids .gs .imgs{ width:100%; padding-bottom:72%; background-size:cover; -webkit-background-size:cover; -moz-background-size:cover; }
.newsbox .grids .gs .text{ padding:15px; min-height:110px; }
.newsbox .grids .gs .text .date{ font-size:0.875rem; color:#333; margin:0 0 5px 0; font-weight:300; }
.newsbox .grids .gs .text .h1{ font-size:1.125rem; color:#333; font-weight:400; }
.newsbox .grids .gs .btn{ position:absolute; right:15px; bottom:15px; background: #fc8738; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; line-height:32px; padding: 0 15px; color: #fff; display: block; font-size:0.938rem; font-weight:300; }

.newdetitle{ padding-bottom:20px; margin-bottom:20px; border-bottom:1px solid #ccc; }
.newdetitle .h1{ font-size:2rem; color:#333;  }
.newdetitle .date{ font-size:1rem; color:#333; font-weight: 300; }

.newsText{ line-height:1.8; color:#333; font-weight:300; }
.newsText *{ font-weight:revert; font-size:inherit; color: revert; }
.newsText a{ color: #ef6565; text-decoration: underline; }
.newsText ul,.newsText ol{ margin:0 0 0 25px; }
.newsText img{ max-width:100%; width:auto !important; height:auto !important; }

.backbtn{ padding:60px 0 0 0; text-align:center; }
.backbtn .btns{ background: #fc8738; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; line-height: 40px; padding: 0 20px; color: #fff; display: inline-block; }
.backbtn .btns .fa{ color:#fff; margin-left:5px; font-size: 1.125rem; }


/*藝術家*/
.searchbox{ display:block; margin:0 0 40px 0; text-align:right; padding:20px; background:#eee; }
.searchbox .grids{ display:flex; align-items: center; }
.searchbox .grids .sh1{ font-size:1rem; padding:0 10px 0 0; }
.searchbox .grids .sinput{ padding:0 10px 0 0; flex:1; }
.searchbox .grids .sinput input{ line-height:32px; background:#fff; width:100%; border:none; padding:0 10px; font-size:1rem; color:#333; }
.searchbox .grids .sinput label{ display:none; }
.searchbox .grids .btns button{ cursor:pointer; line-height:32px; border:none; background:#fc8738; color:#fff; font-size:1rem; padding:0 30px; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; }

.airbox{ display:flex; flex-wrap:wrap; margin-left:-15px; }
.airbox .grids{ width:25%; padding:0 0 60px 15px; display:flex; }
.airbox .grids .gs{ display:flex; flex-direction: column; width:100%; box-shadow: 0 0 10px rgba(0,0,0,0.1); background:#fff; transition: .5s all; -webkit-transition: .5s all; -moz-transition: .5s all; }
.airbox .grids .gs .imgs{ width:100%; padding-bottom:100%; background-size:cover; background-position:center; background-repeat:no-repeat; position:relative; }
.airbox .grids .gs .imgs .more{ background: #fc8738; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; line-height: 32px; height:32px; width:100px; text-align:center; color: #fff; display: block; font-size: 0.938rem; font-weight: 300; position:absolute; margin:auto; left:0; right:0; top:20%; transform:translateY(-50%); -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); transition: .5s all; -webkit-transition: .5s all; -moz-transition: .5s all; opacity: 0; }
.airbox .grids .gs .text{ padding:15px; }
.airbox .grids .gs .text .title{ display:flex; align-items: center; }
.airbox .grids .gs .text .title .p_img{ width:50px; }
.airbox .grids .gs .text .title .p_img .p_line{ border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; background:#ccc; padding:3px; }
.airbox .grids .gs .text .title .p_img .phs{ width:100%; padding-bottom:100%; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; background-position:center; background-repeat:no-repeat; background-size:cover; -webkit-background-size:cover; -moz-background-size:cover; }
.airbox .grids .gs .text .title .p_h1{ font-size:1.125rem; color: #fc8738; flex:1; padding:0 0 0 10px; }
.airbox .grids .gs .text .nation{ text-align:right; color:#333; font-size:0.813rem; font-weight:300; }
.airbox .grids .gs .text .nation .line{ display:inline-block; vertical-align:middle; width:1px; height:12px; background:#ccc; margin:0 5px; }

.air_debox{ display:flex; background:#fff1e8; border-right: 10px solid #ffd15f; position:relative; }
.air_debox .imgbox{ width:380px; position:relative; }
.air_debox .imgbox .imgs{ width:100%; padding-bottom:100%; background-position:center; background-repeat:no-repeat; background-size:cover; -webkit-background-size:cover; -moz-background-size:cover; }
.air_debox .air_text{ flex:1; padding:40px;  }
.air_debox .air_text .topdata{ width:100%; }
.air_debox .air_text .topdata .left-s{ padding:0 0 0 50px; }
.air_debox .air_text .list{ display:flex; margin-bottom:10px; }
.air_debox .air_text .list .g1{ padding:0 10px 0 0; min-width:74px; position: relative; line-height:1.6; }
.air_debox .air_text .list .g1:after{ content:""; display:block; position:absolute; top:8px; right:0; width:1px; height:12px; background:#ccc; }
.air_debox .air_text .list .g2{ padding:0 0 0 10px; line-height:1.6; font-weight:300; }
.air_debox .right-s{ position: absolute; right:0; top: 28px; width: 120px; transform: translateX(50%); -webkit-transform: translateX(50%); -moz-transform: translateX(50%); }
.air_debox .right-s .img_s{ width:100%; padding-bottom:100%; background-position:center; background-repeat:no-repeat; background-size:cover; -webkit-background-size:cover; -moz-background-size:cover; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; }
.air_debox .right-s .lines{ background: #fff1e8; padding: 5px; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; }

.airText{ padding:40px 0 0 0; }
.airText .h1{ font-size:1rem; font-weight:bold; }
.airText .h2{ padding:20px 0 0 0; font-size:1rem; line-height:1.8; font-weight:300; }

.air_sort{ margin-top:60px; display:flex; margin-bottom:30px; }
.air_sort .grids{ background:#eee; line-height:48px; padding:0 20px; margin-right:10px; display:block; color:#333; transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all; }
.air_sort .grids.hold{ background:#14305b; color:#fff; }

.air_page .flexbox{ display:flex; flex-wrap:wrap; margin-left:-15px; }
.air_page .flexbox .grids{ width:25%; padding:0 0 60px 15px; }
.air_page .flexbox .grids .gs{ display:block; background:#fff; width:100%; }
.air_page .flexbox .grids .gs .imgs{ width:100%; padding-bottom:100%; background-position:center; background-size:cover; -webkit-background-size:cover; -moz-background-size:cover; position:relative; }
.air_page .flexbox .grids .gs .imgs .more{ background: #fc8738; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; line-height: 32px; height:32px; width:100px; text-align:center; color: #fff; display: block; font-size: 0.938rem; font-weight: 300; position:absolute; margin:auto; left:0; right:0; top:20%; transform:translateY(-50%); -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); transition: .5s all; -webkit-transition: .5s all; -moz-transition: .5s all; opacity: 0; z-index:2; }
.air_page .flexbox .grids .gs .imgs:after{ content:""; transition: .5s all; -webkit-transition: .5s all; -moz-transition: .5s all; }
.air_page .flexbox .grids .gs .text{ padding:15px 0 0 0; }
.air_page .flexbox .grids .gs .text .h1{ font-size:1.125rem; color:#333; margin:0 0 10px 0; }
.air_page .flexbox .grids .gs .text .h2{ font-size:0.875rem; color:#777; font-weight:300; }

.air_page *{ font-weight:revert; font-size:inherit; color: revert; }
.air_page ul,.air_page ol{ margin:0 0 0 25px; }
.air_page img{ max-width:100%; }

.air_experience .exlist{ margin:0 0 15px 0; padding:0 0 15px 0; border-bottom:1px solid #ccc; }
.air_experience .exlist:last-child{ margin:0; }
.air_experience .exlist .years{ color:#fc8738; font-weight:bold; font-size:1.125rem; margin:0 0 10px 0; }
.air_experience .exlist .addlis{ display:flex; width:100%; margin:0 0 5px 0; }
.air_experience .exlist .addlis:last-child{ margin:0; }
.air_experience .exlist .addlis .h1{ padding:0 15px 0 0; color:#333; }
.air_experience .exlist .addlis .h2{ flex:1; font-size:0.875rem; color:#777; text-align:right; font-weight:300; }

/*作品*/
.workdebox{ width:100%; display:flex; }
.workdebox .w1{ width:45%; }
.workdebox .w1 .imgs{ width:100%; display:block; position:relative; padding-bottom:100%; background:#eee; }
.workdebox .w1 .imgs img{ max-width:100%; max-height:100%; position:absolute; top:0; bottom:0; right:0; left:0; margin:auto; }
.workdebox .w1 .imgs img.zoom_pc{ display:block; }
.workdebox .w1 .imgs img.zoom_mb{ display:none; }
.workdebox .w1 .i_box{ padding:0 40px; position:relative; margin-top:10px; }
.workdebox .w1 .i_box .btn-left{ width:20px; height:20px; position:absolute; top:0; bottom:0; margin:auto; left:5px; cursor:pointer; }
.workdebox .w1 .i_box .btn-left:before{ content:""; display:block; width:50%; height:50%; transform:rotate(-45deg); -webkit-transform:rotate(-45deg); -moz-transform:rotate(-45deg); position:absolute; top:0; bottom:0; left:0; right:0; margin:auto; border-left:2px solid #777; border-top:2px solid #777; }
.workdebox .w1 .i_box .btn-right{ width:20px; height:20px; position:absolute; top:0; bottom:0; margin:auto; right:5px; cursor:pointer; }
.workdebox .w1 .i_box .btn-right:before{ content:""; display:block; width:50%; height:50%; transform:rotate(45deg); -webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); position:absolute; top:0; bottom:0; left:0; right:0; margin:auto; border-right:2px solid #777; border-top:2px solid #777; }
.workdebox .w1 .imgs_s{ display:flex; margin-left:-10px; }
.workdebox .w1 .imgs_s .grids{ width:20%; padding-left:10px; }
.workdebox .w1 .imgs_s .grids .gs{ display:block; cursor:pointer; width:100%; padding-bottom:100%; background-position:center; background-repeat:no-repeat; background-size:cover; -webkit-background-size:cover; -moz-background-size:cover; opacity: 0.3; transition: .5s all; -webkit-transition: .5s all; -moz-transition: .5s all; }
.workdebox .w1 .imgs_s .grids.hold .gs{ opacity: 1; }
.workdebox .w2{ width:55%; padding-left:40px; }
.workdebox .w2 .h1{ font-size:2rem; margin-bottom:10px; color:#333; }
.workdebox .w2 .h2{ font-size:1rem; color:#777; line-height:100%; margin-bottom:40px; font-weight:300; }
.workdebox .w2 .h2 span{ display: inline-block; vertical-align: baseline; width: 1px; height: 12px; background: #ccc; margin: 0 5px; }
.workdebox .w2 .h3list{ display:flex; margin:0 0 5px 0; }
.workdebox .w2 .h3list .k1{ padding:0 20px 0 0; color:#fc8738; }
.workdebox .w2 .h3list .k2{ color:#333; }
.workdebox .w2 .h4{ padding-top:20px; border-top:1px solid #ccc; margin-top:20px; font-weight:300; line-height:1.8; }
.workdebox .w2 .backbox{ text-align:right; margin-top:20px; }
.workdebox .w2 .backbox .btns{ background: #fc8738; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; line-height: 40px; padding: 0 20px; color: #fff; display: inline-block; }
.workdebox .w2 .backbox .btns .fa{ color: #fff; margin-left: 5px; font-size: 1.125rem; }

.workmore{ padding:80px 0 0 0; }
.workmore .titles{ padding-left:15px; position:relative; margin-bottom:30px; }
.workmore .titles span{ display:inline-block; padding:0 20px 0 5px; background:#fff; font-size:1.25rem; position:relative; z-index:2; }
.workmore .titles:before{ content:""; display:block; width:5px; height:20px; background:#fc8738; position:absolute; top:5px; left:0; }
.workmore .titles:after{ content:""; display:block; position:absolute; top:0; bottom:0; right:0; left:20px; margin:auto; height:1px; background:#ccc; }

/*聯絡我們*/
.contactbox{ width:100%; background-image:url(../images/page/bg.jpg); padding:25px; position:relative; min-height:400px; }
.contactbox .leftbox{ width:40%; position:relative; }
.contactbox .leftbox .h1{ color:#fc8738; font-weight:500; font-size:1.25rem; margin-bottom:20px; }
.contactbox .leftbox .list{ display:flex; margin:0 0 5px 0; }
.contactbox .leftbox .list .k_t1{ font-size:1rem; color:#fff; padding:0 20px 0 0; min-width:120px; line-height:1.8; position:relative; }
.contactbox .leftbox .list .k_t1:after{ content:""; display:block; position:absolute; top:6px; right:10px; height:18px; width:1px; background:#545e6e; }
.contactbox .leftbox .list .k_t2{ font-size:1rem; color:#fff; font-weight:300; line-height:1.8; }
.contactbox .leftbox .h2{ color:#fff; }
.contactbox .rightbox{ position:absolute; top:50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); right:3%; width:50%; background:#fff; padding:25px; box-shadow: 0 0 15px rgba(0,0,0,0.2); }
.contactbox .rightbox .h1{ color:#333; font-weight:500; font-size:1.25rem; margin-bottom:20px; text-align:center; }
.contactbox .rightbox .forms{ display:block; }
.contactbox .rightbox .forms .lists{ display:flex; align-items: center; width:100%; margin:0 0 10px 0; }
.contactbox .rightbox .forms .lists .f1{ width:80px; text-align:right; }
.contactbox .rightbox .forms .lists .f2{ flex:1; padding:0 0 0 15px; }
.contactbox .rightbox .forms .lists .f3{ width:80px; }

.contactbox .rightbox .forms .input{ line-height:36px; padding:0 10px; background:#eee; border:none; width:100%; font-size:1rem; }
.contactbox .rightbox .forms .textarea{ padding:10px; background:#eee; border:none; width:100%; font-size:1rem; resize:none; height:100px; }
.contactbox .rightbox .forms .btnbox{ text-align:center; padding:15px 0 10px 0; }
.contactbox .rightbox .forms .btnbox .btns{ display:inline-block; vertical-align:middle; margin:0 5px; line-height:36px; padding:0 20px; background:#fc8738; color:#fff; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; border:none; cursor:pointer; }
.contactbox .rightbox .forms .btnbox .btns.close{ background:#ccc; color:#333; }

.contact_map{ margin-top:60px; width:100%; }
.contact_map .maps{ width:100%; padding-bottom:25%; position:relative; }
.contact_map .maps iframe{ position:absolute; top:0; left:0; margin:auto; width:100%; height:100%; }

/*理念和價值*/
.aboutflex{  position:relative; }
.aboutflex .logos{ position:absolute; width:416px; height:292px; left:0; top:50px; background:#14305b; display: flex; justify-content: center; align-items: center; }
.aboutflex .logos .imgs{ width: 356px; height: 110px; background-image: url(../images/layout/logo.svg); background-repeat: no-repeat; background-position: center; background-size: cover; -webkit-background-size: cover; -moz-background-size: cover; }
.aboutflex .textbox{ color:#333; font-weight:300; line-height:1.8; padding:50px 50px 50px 260px; margin-left:208px; background:#fff1e8; }

/*網站地圖*/
.siteText{ line-height:1.8; font-size:1rem; color:#333; font-weight:300; }
.siteText ul,.siteText ol{ margin:0 0 0 25px; }
.siteText ul li,.siteText ol li{ color: #fc8738; }

.sitebox{ padding:20px; background:#14305b; margin-top:50px; display:flex; flex-wrap:wrap; }
.sitebox .sitlist{ margin:10px; }
.sitebox .sitlist .onelink{ display: block; font-size: 1.125rem; color:#fff; text-decoration: none; }
.sitebox .sitlist .twogrids{ display: inline-block; vertical-align: top; margin: 0 25px 10px 0; }
.sitebox .sitlist .threelist { margin-top: 5px; display: block; font-weight:300; }
.sitebox .sitlist .threelist a.title{ font-size: 1rem; font-weight:500; }


/*頁碼*/
.page_number{ position:relative; text-align:center; }
.page_number .btn{ display:inline-block; min-width:30px; padding:0; background-color: #fff; line-height:30px; height:30px; font-size:0.875rem; color:#555; border:1px solid #ccc; vertical-align:top; margin:0 2px; text-align:center; }
.page_number .btn.focus{ border:1px solid #fc8738; background-color:#fc8738; color:#fff; font-weight:bold;}
.page_number .btn .fa{ line-height:28px;}
.page_number .btn.looking{ color:#ccc; border-color:#ddd; cursor:not-allowed;}
.page_number .quantity{ font-size:12px; color:#555; position:absolute; top:0; right:6px; line-height:30px;}
.page_number .quantity .fa{ padding-right:5px;}
.page_number .btn.prev{ font-size:0; }
.page_number .btn.next{ font-size:0; }
.page_number .btn.prev .fa,.page_number .btn.next .fa{ font-size:0; }
.page_number .btn.prev .fa-arrow-left:before,.page_number .btn.next .fa-arrow-right:before{ font-size:1rem; }


/*================================●●●●●●●●●●●●Hover●●●●●●●●●●●●================================*/
@media screen and (min-width:1024px){
/*news*/
.newsbox .grids .gs:hover{ transform: translateY(-10px); -webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); animation:boxmove 0.7s; -webkit-animation:boxmove 0.7s; -moz-animation:boxmove 0.7s; }
@keyframes boxmove{
	0%{ opacity:1; }
	50%{ opacity:0.5; }
	100%{ opacity:1; }
}
@-webkit-keyframes boxmove{
	0%{ opacity:1; }
	50%{ opacity:0.5; }
	100%{ opacity:1; }
}
@-moz-keyframes boxmove{
	0%{ opacity:1; }
	50%{ opacity:0.5; }
	100%{ opacity:1; }
}

/*藝術家*/
.airbox .grids .gs:hover{ box-shadow: 0 0 20px rgba(0,0,0,0.2); }
.airbox .grids .gs:hover .imgs .more{ top:50%; opacity:1;  }


.air_sort .grids:hover{ background:#eee; }
.air_sort .grids.hold:hover{ background:#14305b; }

.air_page .flexbox .grids .gs:hover .imgs .more{ top:50%; opacity:1;  }
.air_page .flexbox .grids .gs:hover .imgs:after{ position: absolute; background: rgba(20,48,91,0.8); top: 0; left: 0; bottom: 0; right: 0; margin: auto; z-index: 1; }

/*作品*/
.workdebox .w1 .imgs_s .grids .gs:hover{ opacity:1; }

}

/*================================●●●●●●●●●●●●電腦●●●●●●●●●●●●================================*/
@media screen and (max-width:1280px){}

@media screen and (min-width:768px){
.filterbox .slistbox{ display:none; }
.filterbox .slistbox.open{ display:block; }
}
/*================================●●●●●●●●●●●●平板●●●●●●●●●●●●================================*/
@media screen and (max-width:1200px){
/*藝術家*/
.air_debox .air_text{ position:relative; }
.air_debox .air_text .topdata{ flex-wrap:wrap; }
.air_debox .air_text .topdata .left-s{ padding:0 0 0 7%; flex:none; width: 100%; }
.air_debox .air_text .topdata .right-s{ position: absolute; right: 40px; top: 20px; width:140px; }
.air_debox .air_text .list.wh_s{ padding:0 160px 0 0; }

.air_debox .imgbox{ width:30%; }
.air_debox .right-s{ top:20px; width: 38%; }


}

/*================================●●●●●●●●●●●●平板●●●●●●●●●●●●================================*/
@media screen and (min-width:768px) and (max-width:1023px){
.maintitle{ margin-top:100px; }

/*藝術家*/
.airbox .grids{ width:33.333334%; }

.air_page .flexbox .grids{ width:33.33334%; }

/*理念和價值*/
.aboutflex .logos{ width: 100%; height: 120px; position: static; }
.aboutflex .logos .imgs{ width:240px; height:74px; }
.aboutflex .textbox{ padding:30px; margin:0; }

/*聯絡我們*/
.contactbox .leftbox{ width:100%; padding:0 0 20px 0; }
.contactbox .rightbox{ width:auto; position:static; transform:none; -webkit-transform:none; -moz-transform:none; }

}

/*================================●●●●●●●●●●●●手機●●●●●●●●●●●●================================*/
@media screen and (max-width:767px){
.contentbox{ margin-bottom:60px; }

.maintitle{ margin-top:70px; }
.maintitle .ch{ font-size:2rem; }
.maintitle .ch h1{ font-size:2rem; }
.maintitle .en{ font-size:1rem; }

.navbox{ padding:20px 15px 30px 15px; }
.navbox .mar a{ font-size:0.875rem; }
.navbox .mar span{ font-size:0.875rem; }


.filterbox{ align-items: flex-end; }
.filterbox .slistbox{ position:fixed; top:0; left:0; bottom:0; right:0; margin:auto; z-index:101; background:rgba(0,0,0,0.7); display:flex; display:none; align-items: center; justify-content: center; padding:0; }
.filterbox .slistbox .masks{ background:#fff; width:100%; padding:20px 20px 20px 20px; height:100%; position:relative; }
.filterbox .slistbox .masks .sbtnbox{ display:block; position:absolute; bottom: 0; left: 0; right: 0; margin: auto; z-index: 1; padding:20px 10px; background: rgba(238,238,238,0.8); text-align: center; }
.filterbox .slistbox .masks .sbtnbox .s_btn{ display:inline-block; vertical-align:middle; padding:0 15px; color:#fff; font-size:0.875rem; line-height:30px; background:#fc8738; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; margin:0 5px; }
.filterbox .slistbox .masks .sbtnbox .s_btn.gray{ background:#ccc; color:#333; }

.filterbox .slistbox .masks .o_lt{ height:100%; overflow:auto; padding: 0 0 60px 0; }

.filterbox .mob_filbtn{ display:block; text-align:right; padding:0; }
.filterbox .mob_filbtn .btn{ display:inline-block; color:#fc8738; font-size:0.875rem; padding:5px; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; cursor:pointer; }
.filterbox .mob_filbtn .fa{ color:#fc8738; font-size:0.875rem; }

.filterbox .mob_sort{ display:flex; flex-wrap:wrap; padding: 20px 0 0 0; width:100%; }
.filterbox .mob_sort .sortgrids{ display:flex; align-items: center; color:#fff; line-height:24px; padding:0 10px; font-size:0.875rem; margin:3px; border-radius: 50px; -webkit-border-radius: 50px; -moz-border-radius: 50px; background:#14305b; }
.filterbox .mob_sort .sortgrids .closes{ width:12px; height:12px; margin-right:5px; transform:rotate(45deg); -webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); cursor:pointer; position:relative; }
.filterbox .mob_sort .sortgrids .closes:before{ content:""; display:block; width:12px; height:2px; background:#fc8738; position:absolute; top:0; left:0; bottom:0; right:0; margin:auto; }
.filterbox .mob_sort .sortgrids .closes:after{ content:""; display:block; width:2px; height:12px; background:#fc8738; position:absolute; top:0; left:0; bottom:0; right:0; margin:auto; }

.filterbox .search_s{ flex-wrap: wrap; }
.filterbox .search_s .sh1{ width:100%; padding:0 0 10px 0; font-size:0.875rem; }
.filterbox .search_s .sinput input{ font-size:0.875rem; }
.filterbox .search_btns{ padding:15px 0 0 0; width:100%; margin: 20px 0 0 0; border-top: 1px solid #ccc; }
.filterbox .search_btns button{ font-size:0.875rem; }


/*news*/
.newsbox .grids{ width:50%; padding: 0 0 40px 15px; }
.newsbox .grids .gs .text .h1{ font-size:1rem; }

.newdetitle .h1{ font-size:1.5rem; }
.newdetitle .date{ font-size:0.875rem; }

.newsbox .grids .gs .text .date{ font-size:0.75rem; margin:0; }
.newsbox .grids .gs .text{ min-height: auto; }
.newsbox .grids .gs .btn{ font-size:0.875rem; line-height:28px; padding:0; width:95px; left:0; right:0; margin:auto; text-align:center; }

/*藝術家*/
.searchbox{ text-align:left; }
.searchbox .grids{ width:100%; display:block; }
.searchbox .grids .sh1{ font-size:0.875rem; width:100%; padding:0 0 10px 0; }
.searchbox .grids .sinput{ flex:1; }
.searchbox .grids .sinput input{ width:100%; font-size:0.875rem; }
.searchbox .grids .btns{ padding: 15px 0 0 0; width: 100%; margin: 20px 0 0 0; border-top: 1px solid #ccc; text-align:center; }
.searchbox .grids .btns button{ font-size:0.875rem; }

.airbox .grids{ width:100%; padding: 0 0 40px 15px; }

.air_debox{ flex-wrap:wrap; border-top:5px solid #ffd15f; border-right:none; }
.air_debox .imgbox{ width:100%; position:relative; }
.air_debox .air_text{ padding:20px; }
.air_debox .air_text .topdata .left-s{ padding:0; }
.air_debox .right-s{ max-width: 120px; width: 25%; right:5%; top: auto; bottom: 0; transform: translateY(50%); -webkit-transform: translateY(50%); -moz-transform: translateY(50%); }
.air_debox .right-s .lines{ padding:3px; background:#fff; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; }
.air_debox .air_text .list.wh_s{ padding:0 25% 0 0; }
.air_debox .air_text .list.wh_a{ padding:0; }

.air_page.sty .flexbox{ margin-bottom:-40px; }
.air_page .flexbox .grids{ width:50%; padding: 0 0 40px 15px; }
.air_page .flexbox .grids .gs .text .h1{ margin-bottom:5px; }
.air_page .flexbox .grids .gs .text{ padding:10px 0 0 0; }

.air_page .tables{ display:block; }
.air_page .tables tbody{ display:block; }
.air_page .tables tr{ display:block; }
.air_page .tables td{ display:block; padding: 3px 0; text-align: left; }

.air_experience .exlist .addlis{ display:block; margin:0 0 15px 0; }
.air_experience .exlist .addlis .h1{ padding:0; }
.air_experience .exlist .addlis .h2{ text-align:left; }

/*作品*/
.workdebox{ display:block; }
.workdebox .w1{ width:100%; }
.workdebox .w2{ width:100%; padding:25px 0 0 0; }
.workdebox .w2 .h1{ font-size:1.5rem; }
.workdebox .w2 .h2{ font-size:0.875rem; margin-bottom:25px; }
.workdebox .w2 .h3list .k1{ font-size:0.875rem; }
.workdebox .w2 .h3list .k2{ font-size:0.875rem; }

.workdebox .w1 .imgs img.zoom_pc{ display:none; }
.workdebox .w1 .imgs img.zoom_mb{ display:block; }


.workmore .titles span{ font-size:1.125rem; }
.workmore .titles:before{ top:4px; }

/*聯絡我們*/
.contactbox .leftbox{ width:100%; padding-bottom:20px; }
.contactbox .leftbox .h1{ font-size:1.125rem; }
.contactbox .leftbox .list .k_t1{ font-size:0.875rem; min-width: 110px; }
.contactbox .leftbox .list .k_t2{ font-size:0.875rem; }

.contactbox .rightbox{ position:static; width:100%; transform:none; -webkit-transform:none; -moz-transform:none; padding: 15px; }
.contactbox .rightbox .h1{ font-size:1.125rem; }

.contactbox .rightbox .forms .lists{ flex-wrap:wrap }
.contactbox .rightbox .forms .lists .f1{ text-align:left; width:100%; font-size:0.913rem; }
.contactbox .rightbox .forms .lists .f2{ padding:5px 0 0 0; }

.contactbox .rightbox .forms .btnbox{ padding:20px 0 25px 0; }
.contactbox .rightbox .forms .btnbox .btns{ font-size:0.913rem; padding:0 15px; }

.contact_map{ margin-top:20px; }
.contact_map .maps{ padding-bottom: 36%; }

/*理念和價值*/
.aboutflex .logos{ width: 100%; height: 120px; position: static; }
.aboutflex .logos .imgs{ width:240px; height:74px; }
.aboutflex .textbox{ padding:30px; margin:0; }

/*頁碼*/
.page_number .btn{ font-size: 12px; min-width: 26px; line-height: 26px; height: 26px; }
.page_number .quantity{ position:static; text-align:center; }

}