@charset "utf-8";
/* CSS Document */
/*----------
Banner
----------*/
#index-box{position:relative; padding-top:6rem;}
.banner{ position:relative; }
.banner a .indexbanner-img,.banner .indexsmallimg{width:100%; }
.indexsmallimg{ display:none;}
.bannet-content-1{ position:absolute; left:15%; top:45%; }
.bannet-content-2{ position:absolute; left:25%; top:25%; }
.bannet-content-3{ position:absolute; left:10%; top:15%; }
.banner a .bannet-small-title{  font-size:2.4rem; color:rgba(255,255,255,.6);}
.banner a .bannet-large-title{ width:min(80%,600px);  padding-top:1.4rem; font-size:8rem; font-weight:bold; line-height:1.2em; letter-spacing:5px; color:var(--web-theme-color);}
.bannet-large-title-white,.bannet-large-title-red{ font-size:12rem; font-weight:bold; letter-spacing:2rem;}
.bannet-large-title-white{text-align:left; color:var(--web-theme-color-white);} 
.bannet-large-title-red{ padding-top:12rem; margin-left:10vw;color:var(--web-theme-color-red);}
.banner a .bannet-content-2 .bannet-mid-title{ width:56rem; margin:0 auto;margin-left:10vw; background-color:var(--web-theme-color-red); padding:1rem 20px; margin-top:8rem; font-size:2.8rem; letter-spacing:1.2rem; color:var(--web-theme-color-white);}
.banner a .bannet-content-3 .bannet-large-title{ width:100%; padding:2rem 0;}
.banner a .bannet-content-3 .bannet-small-title{color:var(--web-theme-color-white);}
.banner a .bannet-content-3 .bannet-mid-title{font-size:2.4rem; color:rgba(255,255,255,.6);}
.banner a .bannet-content-3 .bannet-mid-title span{color:var(--web-theme-color-red);}
/*Entrance*/
.contact-link{ position:absolute; left:0; top:90%; right:0; bottom:0; width:100%; max-width:1000px; height:22%; border-radius:10px;  box-shadow: 0 0 10px rgba(80,80,80,0.4); background-color:var(--web-theme-color-white); z-index:5;  margin:0 auto; padding:4rem 2rem;}
.contact-link .grid{grid-template-columns:repeat(2,auto);justify-content: space-between;}
.contact-link-info-large-title{ font-size:2.4rem; font-weight:bold; color:var(--web-theme-color-black);}
.contact-link-info h4{ padding-top:4rem; color:var(--web-theme-color-gray);}
.contact-link-info-small-title{ padding-top:1.1rem;}
.contact-link-info-small-title,.contact-link-info-small-title a{font-size:2rem;color:var(--web-theme-color-black);}
.contact-link-info:last-child{display: -webkit-flex; display: flex;}
.contact-link-info:last-child a{  display:block; width:20rem; border-radius:10px;  padding: 4rem;  text-align:center; color:var(--web-theme-color-white);}
.contact-link-info:last-child a h3{ font-weight:bold;}
.contact-link-info:last-child a p{ font-size:1.5rem; font-weight:lighter; padding-top:0.6rem; white-space:nowrap; color:rgba(255,255,255,.6);}
.contact-link-info:last-child a:first-child{ background-color:var(--web-theme-color-black);}
.contact-link-info:last-child a:last-child{ background-color:#D60F0F; margin-left:3rem; }
/*----------
Activity planning
----------*/
#activity-planning{ border-bottom:#B3B3B3 solid 1px;} 
#activity-planning .page-title{ padding-top:9rem;}
#activity-planning .grid{grid-template-columns:1fr 2fr; margin-top:6rem; grid-gap:0 6rem;  }
.activity-planning-content:first-child{ padding-top:2rem;}
.activity-planning-content h2{ font-size:6rem; color:#E6E6E6;}
.activity-planning-content h3{ position:relative; z-index:5; margin-top:-0.2rem; font-size:3rem; font-weight:bold;}
.activity-planning-content:first-child p{ text-indent:1.6em;}
.planning-content-top{ padding-top:2rem;}
.activity-planning-content .more{ margin-top:4rem;}
.activity-planning-content .more i{ margin-left:1.4rem;}
.planning-content-img{ flex:1;}
.planning-content-img:last-child{ margin-left:2rem;}
.planning-content-img h3{ font-size:2rem; padding-top:3rem;}
.planning-content-img p{ padding-top:1rem;}
/*----------
Exhibition case
----------*/
#exhibition-case{ border-bottom:#B3B3B3 solid 1px;} 
#exhibition-case ul{display: -webkit-grid; display: grid; grid-template-columns:repeat(5,16rem);justify-content: center; align-items: center;  grid-gap:0 20px; margin-top:6rem;}
#exhibition-case ul li{ border-radius:20px; border:#333 solid 1px; text-align:center; }
#exhibition-case ul li a{ display:inline-block; padding:1rem 2rem; color:var(--web-theme-color-black);}
#exhibition-case ul li:hover{border:none; background-color:var(--web-theme-color-red);}
#exhibition-case ul li:hover a{color:var(--web-theme-color-white);}
#exhibition-case .grid{grid-template-columns:repeat(4,1fr); grid-gap:4rem 2rem; }   
.exhibition-case-info p{ padding-top:1.6rem; text-align:center;}
#exhibition-case .more{ margin:0 auto; margin-top:6rem;}
/*tab*/
.tab-container{ overflow:hidden;}
.tab-content{margin-top:6rem;}
.tab-buttons {display: -webkit-flex; display: flex;  justify-content: center;   margin-top:6rem;}
.tab-button{ width:12%;  border-radius:30px; border:var(--web-theme-color-black) solid 1px; background: none; padding:1.6rem 2rem; text-align:center; color:var(--web-theme-color-black); cursor: pointer;transition: all 0.5s;}  
.tab-button:nth-child(2),.tab-button:nth-child(3),.tab-button:nth-child(4),.tab-button:nth-child(5){ margin-left:2rem;}  
.tab-button:hover,.tab-button.active {border:none; background-color:var(--web-theme-color-black);  font-weight: bold; color:var(--web-theme-color-white);  }
.tab-panel {display: none;}
.tab-panel.active {display: block;}  
.case-info p{ padding-top:1.4rem; padding-right:2rem; text-align:center; }     
/*----------
News
----------*/
.news-top{ border-bottom:#b3b3b3 solid 1px;}
#news .grid{ max-width:1600px; margin:0 auto; grid-template-columns:repeat(2,auto); justify-content: space-between; margin-top:6rem; padding-bottom:4rem; }
#news h2 span{color:var(--web-theme-color-red);}
#news ul li{background-color:var(--web-theme-color-black-2);}
#news ul li a{ display:block; padding:1rem 2rem; color:var(--web-theme-color-white);}
#news ul li:nth-child(2){ margin:0 2rem;}
#news ul li:hover{ background-color:var(--web-theme-color-red);}
.indexnews-list{  display: -webkit-grid; display: grid;grid-template-columns:repeat(2,1fr);margin-top:6rem; grid-column-gap:6rem; grid-row-gap:2rem;}
.indexnews-list .news-cont{ width:100%;}
.indexnews-item{ width:100%;}
.indexnews-list .wrap-flex { background-color:var(--web-theme-color-white); padding:0 2rem 2rem 2rem;justify-content: space-between; align-items: center;}
.indexnews-list .news-cont a{display:block; overflow:hidden; box-shadow: 0 0 10px rgba(80,80,80,0.4);overflow:hidden;margin-top:2rem}
.indexnews-list .news-cont a .news-first{position:relative;z-index:1; background-color:var(--web-theme-color-white); padding:2rem;}
.indexnews-list .news-cont a .more{ width:14rem; padding:8px 1rem; background-color:var(--web-theme-color-gray);}
.indexnews-list .wrap-flex em{color:var(--web-theme-color-black);}
.indexnews-list .news-cont a .more:hover{ background-color:var(--web-theme-color);}
.news-first a:hover{color:var(--web-theme-color);}
.news-cont a img{width:100%; transition: all .5s ease-in-out;}
.news-cont a:hover img{-webkit-transform: scale3d(1.1, 1.1, 1);transform: scale3d(1.1, 1.1, 1);}	
.first-title{flex:1; font-size:2.2rem; font-weight:bold;color:var(--web-theme-color-black);}
.news-first p{ font-size:1.4rem; margin-top:1rem; }	
.indexnews-list p{width:100%; overflow:hidden; word-break: break-all;  }
.news-cont a:hover .first-title{color:var(--web-theme-color);}                                     	
.indexnews-box{display: -webkit-flex;  display: flex; align-items: center; padding:2rem; margin-top:4rem;}
.news-title{ padding-left:2rem; font-size:2.4rem; font-weight:bold;}
.indexnews-item a .news-title{color:var(--web-theme-color-black);}
.news-title p{ padding-top:10px; font-size:1.6rem; font-weight:lighter; color:var(--web-theme-color-gray);}
.indexnews-item a:hover .news-title{color:var(--web-theme-color);}
.bigday{font-size:1.4em;	color:#ccc; height:1.2em;line-height:1.3em;text-align:center; }
.smallday{border-bottom:#b3b3b3 solid 1px; font-size:1.6em; color:#ccc; height:2em;line-height:2em;text-align:center;}		
@media screen and (max-width: 1023px) {
/*banner*/	
.banner .swiper-button-next,.banner .swiper-button-prev{ width:35px; height:35px; padding:1.2rem 1rem; font-size:18px;}
.banner .swiper-button-prev:after{ width:35px; height:35px; padding:1.2rem 1.6rem;  font-size:18px;}
.banner .swiper-button-next:after { width:35px; height:35px; padding:1.2rem 1.6rem; font-size:18px;}
.banner.swiper-button-next:after{right:14.6%; top:50%; }
.banner .swiper-button-prev:after{left:80%;top:50%;}
.indexbanner-img{ display:none;}
.indexsmallimg{ display:block;}
.bannet-content-1{ position:absolute; left:8%; top:20%; }
.bannet-content-2{ position:absolute; left:25%; top:36%; }
.bannet-content-3{ position:absolute; left:12%; top:25%; }
.banner a .bannet-small-title{  font-size:1.5rem; }
.banner a .bannet-large-title{ width:100%;  padding-top:1.2rem; font-size:2.6rem;}
.bannet-large-title-white,.bannet-large-title-red{ font-size:3rem;}
.bannet-large-title-red{ padding-top:2rem; margin-left:8vw;}
.banner a .bannet-content-2 .bannet-mid-title{ display:none;}
.banner a .bannet-content-3 .bannet-large-title{ width:100%; padding:1rem 0;}
.banner a .bannet-content-3 .bannet-mid-title{font-size:1.8rem; color:rgba(255,255,255,.6);}
/*Entrance*/
.contact-link{ position:absolute; left:0; top:100%; right:0; bottom:0; width:100%; max-width:100%; height:85%; padding:3rem 1rem;}
.contact-link .grid{grid-template-columns:auto;}
.contact-link-info-large-title{ font-size:2.4rem;}
.contact-link-info h4{ padding-top:2rem;}
.contact-link-info-small-title{ padding-top:1.1rem;}
.contact-link-info-small-title,.contact-link-info-small-title a{font-size:2rem;}
.contact-link-info:last-child{display: -webkit-flex; display: flex; margin-top:2rem;}
.contact-link-info:last-child a{  display:block; width:16rem; padding:2rem; }
.contact-link-info:last-child a p{ padding-top:0.6rem; white-space:normal;word-break: normal;word-wrap:break-word;}
.contact-link-info:last-child a:last-child{ margin-left:2rem; }
/*Activity planning*/
#activity-planning .page-title{ padding-top:12rem;}
#activity-planning .grid{grid-template-columns:1fr; margin-top:6rem; grid-gap:2rem 0;  }
.activity-planning-content:first-child{ padding-top:2rem;}
.activity-planning-content h3{margin-top:-3rem; }
.activity-planning-content .wrap-flex{ flex-direction: column;}
#activity-planning .planning-content-img:last-child{ margin-top:2rem; margin-left:0;}
.activity-planning-content:first-child p{ text-indent:1.6em;}
.planning-content-top{ padding-top:2rem;}
.activity-planning-content .more{ margin-top:4rem;}
.planning-content-img:last-child{ margin-left:2rem;}
.planning-content-img h3{ margin-top:0;}
/*Exhibition case*/
#exhibition-case ul{display: -webkit-grid; display: grid; grid-template-columns:repeat(2,1fr);grid-gap:20px; margin-top:4rem;}
#exhibition-case ul li a{ display:inline-block; padding:1rem 2rem; color:var(--web-theme-color-black);}
#exhibition-case .grid{grid-template-columns:repeat(2,1fr);margin-top:4rem; grid-gap:4rem 10px;}
.exhibition-case-info p{ padding-top:1.2rem;}
#exhibition-case .more{margin-top:4rem;}
/*tab*/
.tab-content{margin-top:4rem;}
.tab-buttons {margin-top:4rem; overflow-x:auto;}
.tab-button{ width:auto;  padding:1.6rem 15px;  font-size: 12px;}  
.tab-button:nth-child(2),.tab-button:nth-child(3),.tab-button:nth-child(4),.tab-button:nth-child(5){ margin-left:1rem;}   
.case-info p{padding-right:0;} 
/*News*/
#news .grid{grid-template-columns:auto;  margin-top:2rem; padding:0 15px; padding-bottom:2rem; }
#news ul{ padding-top:2rem;}
.first-title{font-size:2rem; font-weight:600;color:var(--web-theme-color-black);}
.indexnews-list{grid-template-columns:1fr;}
.indexnews-box{display: -webkit-flex;  display: flex; flex-direction: column; align-items:flex-start ; padding:0; margin-top:4rem;}
.news-title{ padding-left:0; padding-top:2rem; font-size:2.2rem;}
.bigday{font-size:1.4em;	color:#ccc; height:1.2em;line-height:1.3em; text-align:left; }
.smallday{border-bottom:#b3b3b3 solid 1px; font-size:1.6em; color:#ccc; height:2em;line-height:2em;text-align:left; }	
}

