@charset "utf-8";
/* CSS Document */
.banner {position: relative; z-index: 10; line-height: 0;}
.banner img {width: 100%;}
.banner a, .banner picture {display: block;}
.banner figure {width: 100%; margin: 0; padding: 0;}
.bg_01 {position: absolute; top: 0; left: 0; z-index: -1; width: 1352px; padding-bottom: 1002px; background: url("../images/bg_01.png") no-repeat top left;}


.ind_A {background: url("../images/bg_01.png") no-repeat top left; padding: 95px 0 3.8361% 0; position: relative; z-index: 1;}
#ind_ALS {position: absolute; top: -50vh; left: 0; z-index: -99;}
.ind_AL {display: flex; flex-wrap: wrap; justify-content: space-around; padding: 23px 0 0px 0;}
.ind_AL > div {width: calc(100% / 5); max-width: 170px; text-align: center; padding-bottom: 55px;}
.ind_AL > div > div.photo {line-height: 0; position: relative; z-index: 1; width: 132px; padding-bottom: 130px; overflow: hidden; border: 1px solid #d4d4d4; border-radius: 50%; margin: 0 auto 9px auto;}
.ind_AL > div > div.text {color: #f18944; margin-bottom: 14px;}
.ind_AL > div > div.text span {font-weight: 900;}
.ind_AL > div > div.text font {font-weight: 900;}
.ind_AL > div > h3 {color: #555555;}
.ind_AC {position: relative; z-index: 1; padding: 0 0 0 62px;}
.ind_AC > div.text {width: 589px; background-color: #fff; padding: 57px 40px 72px 55px; position: relative; z-index: 1; box-shadow: 0 0 76px rgba(15, 5, 10, 0.06);}
.ind_AC > div.text::before {content: ''; border: 1px solid #f1a244; position: absolute; top: 17px; left: 18px; right: 17px; bottom: 19px; z-index: 2;}
.ind_AC > div.text::after {content: ''; background: url("../images/ind_02.png") no-repeat center / cover; width: 271px; padding-bottom: 193px; position: absolute; bottom: -47px; right: -31px; z-index: 3;}
.ind_AC > div.text > h1 {color: #333333; font-weight: 700; text-align: center; padding: 0 0 36px 0; position: relative; z-index: 10;}
.ind_AC > div.text > h1 span {font-weight: 300;}
.ind_AC > div.text > .textC {font-family:'Microsoft JhengHei'; color: #333333; line-height: 1.867; letter-spacing: 0.1px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 11; line-clamp: 11; -webkit-box-orient: vertical; margin-bottom: 41px; position: relative; z-index: 10;}
.ind_AC > div.text > .btn_a {position: relative; z-index: 10;}
.ind_AC > div.photo {position: absolute; top: 12.6%; left: 620px; z-index: -20; line-height: 0; width: 51.72%;}

.ind_B {background-color: #efeeec; padding: 3.679% 0 2.7851% 0;}
.ind_B div.text {max-width: 865px; margin: auto; padding: 16px 0 37px 0; text-align: center; letter-spacing: 0.08px;}
.ind_B div.text > p {font-family:'Microsoft JhengHei'; line-height: 2;}
.ind_BL {padding: 0 29px;}
.ind_BLC {max-width: 600px; margin: auto; position: relative; z-index: 1;}
.ind_BLC > div.photo {height: 0; padding-bottom: 56.667%; position: relative; z-index: 1; margin-bottom: 16px;}
.ind_BLC > div.photo img {transform: scale(1.0, 1.0); transition: all 0.5s ease 0s;}
.ind_BLC:hover > div.photo img {transform: scale(0.95, 0.95); transition: all 0.5s ease 0s;}
.ind_BLC > div.photo::after {content: ''; border: 1px solid #f18944; position: absolute; top: 17%; left: 15%; bottom: 17%; right: 15%; z-index: 50; filter:alpha(opacity=0); Opacity:0; transition: all 0.5s ease 0s;}
.ind_BLC:hover > div.photo::after {top: 0; left: 0; bottom: 0; right: 0; filter:alpha(opacity=100); Opacity:1.0;}
.ind_BLC > h3 {color: #333333; font-weight: 500; letter-spacing: 0.7px; text-align: center; transition: all 0.5s ease 0s;}
.ind_BLC:hover > h3 {color: #f18944;}

.ind_C {padding: 3.942% 0 4.572% 0;}
.ind_CL {display: flex; flex-wrap: wrap; padding: 5% 0 22px 0;}
.ind_CL > div {width: calc(100% / 4); padding: 0px 1.563%; position: relative; z-index: 1; margin-bottom: 45px;}
.ind_CL > div > div.photo {height: 0; padding-bottom: 75%; overflow: hidden; line-height: 0; position: relative; z-index: 1; margin-bottom: 15px;}
.ind_CL > div > div.photo img {transform: scale(1.0, 1.0); transition: all 0.5s ease 0s;}
.ind_CL > div:hover > div.photo img {transform: scale(0.95, 0.95); transition: all 0.5s ease 0s;}
.ind_CL > div > div.photo::after {content: ''; border: 1px solid #f18944; position: absolute; top: 17%; left: 15%; bottom: 17%; right: 15%; z-index: 50; filter:alpha(opacity=0); Opacity:0; transition: all 0.5s ease 0s;}
.ind_CL > div:hover > div.photo::after {top: 0; left: 0; bottom: 0; right: 0; filter:alpha(opacity=100); Opacity:1.0;}
.ind_CL > div > div.text {font-family:'Microsoft JhengHei'; color: #888888; text-align: center; letter-spacing: 0.5px;}
.ind_CL > div > div.text > h3 {font-family:'Microsoft JhengHei'; color: #333333; font-weight: bold; margin-bottom: 9px; transition: all 0.5s ease 0s;}
.ind_CL > div:hover > div.text > h3 {color: #f18944;}

.ind_D {background: url("../images/bg_02.png") no-repeat center / cover; padding: 5.36% 0 4.309% 0; color: #fff;}
.ind_D div.text {line-height: 1.6; text-align: center; font-weight: 600; margin-bottom: 3.673%;}

.ind_E {padding: 3.626% 0 5.308% 0;}
.ind_EL {padding: 27px 0 0 0;}

/*News樣式*/
.ind_ELN {max-width: 640px; margin: auto; padding: 25px;}
.ind_ELNC {box-shadow: 0 0 25px rgba(15, 5, 10, 0.13); display: flex; flex-wrap: wrap; align-items: center; padding: 18px 14px 18px 31px; transition: all 0.5s ease 0s;}
.ind_ELNC:hover {box-shadow: 0 0 15px rgba(15, 5, 10, 0.5);}
.ind_ELNC > div.text {width: 51.926%; font-family:'Microsoft JhengHei'; padding: 0px 4.59% 0 0;}
.ind_ELNC > div.text > span {width: 71px; height: 71px; border-radius: 71px; background-color: #f18944; color: #fff; font-weight: 600; line-height: 2.3; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; position: relative; z-index: 1; margin-bottom: 20px;}
.ind_ELNC > div.text > span::before {content: ''; width: 31px; height: 2px; background-color: #fff; position: absolute; top: calc(50% - 1px); left: calc(50% - 15px);}
.ind_ELNC > div.text > h3 {color: #333333; letter-spacing: 0.3px; line-height: 1.44; margin: 0 0 30px 0; position: relative; z-index: 1; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; line-clamp: 3; -webkit-box-orient: vertical; transition: all 0.5s ease 0s;}
.ind_ELNC:hover > div.text > h3 {color: #f18944;}
.ind_ELNC > div.text > label {color: #afafaf; border: 1px solid #c8c8c8; line-height: 19px; padding: 0 7.5px;}
.ind_ELNC > div.photo {width: 48.074%;}
.ind_ELNC > div.photo > div.photoC {padding-bottom: 90.08%; height: 0; overflow: hidden; position: relative; z-index: 1;}
.ind_ELNC > div.photo > div.photoC img {transform: scale(1.0, 1.0); transition: all 0.5s ease 0s;}
.ind_ELNC:hover > div.photo > div.photoC img {transform: scale(0.95, 0.95); transition: all 0.5s ease 0s;}
.ind_ELNC > div.photo > div.photoC::after {content: ''; border: 1px solid #f18944; position: absolute; top: 17%; left: 15%; bottom: 17%; right: 15%; z-index: 50; filter:alpha(opacity=0); Opacity:0; transition: all 0.5s ease 0s;}
.ind_ELNC:hover > div.photo > div.photoC::after {top: 0; left: 0; bottom: 0; right: 0; filter:alpha(opacity=100); Opacity:1.0;}

/*Exhibitions樣式*/
.ind_ELE {max-width: 640px; margin: auto; padding: 25px;}
.ind_ELEC {box-shadow: 0 0 25px rgba(15, 5, 10, 0.13); display: flex; flex-wrap: wrap; align-items: center; padding: 18px 14px 18px 31px; transition: all 0.5s ease 0s;}
.ind_ELEC:hover {box-shadow: 0 0 15px rgba(15, 5, 10, 0.5);}
.ind_ELEC > div.text {width: 51.926%; font-family:'Microsoft JhengHei'; padding: 0px 4.59% 0 0;}
.ind_ELEC > div.text > span {width: 71px; height: 71px; border-radius: 71px; background-color: #f18944; color: #fff; font-weight: 600; line-height: 2.3; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; position: relative; z-index: 1; margin-bottom: 20px;}
.ind_ELEC > div.text > span::before {content: ''; width: 31px; height: 2px; background-color: #fff; position: absolute; top: calc(50% - 1px); left: calc(50% - 15px);}
.ind_ELEC > div.text > h3 {color: #333333; letter-spacing: 0.3px; line-height: 1.625; margin: 0 0 13px 0; position: relative; z-index: 1; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; transition: all 0.5s ease 0s;}
.ind_ELEC:hover > div.text > h3 {color: #f18944;}
.ind_ELEC > div.text > div {color: #333333; letter-spacing: 0.25px; line-height: 26px; overflow: hidden; height: 104px; margin: 14px 0 0 0;}
.ind_ELEC > div.photo {width: 48.074%;}
.ind_ELEC > div.photo > div.photoC {padding-bottom: 90.08%; height: 0; overflow: hidden; position: relative; z-index: 1;}
.ind_ELEC > div.photo > div.photoC img {transform: scale(1.0, 1.0); transition: all 0.5s ease 0s;}
.ind_ELEC:hover > div.photo > div.photoC img {transform: scale(0.95, 0.95); transition: all 0.5s ease 0s;}
.ind_ELEC > div.photo > div.photoC::after {content: ''; border: 1px solid #f18944; position: absolute; top: 17%; left: 15%; bottom: 17%; right: 15%; z-index: 50; filter:alpha(opacity=0); Opacity:0; transition: all 0.5s ease 0s;}
.ind_ELEC:hover > div.photo > div.photoC::after {top: 0; left: 0; bottom: 0; right: 0; filter:alpha(opacity=100); Opacity:1.0;}

