html,body,img,p,h1,h2,h3,ul,ol,li,hr,div,a{border:0; margin:0; padding:0; list-style-type:none; font-family: Microsoft JhengHei; text-decoration:none; color:inherit; color:#444;}*{ position:relative;}input,select,textarea{font-family: Microsoft JhengHei; font-size: 1em; margin: 0; padding: 0.5em; border: #BBB 1px solid; border-radius: 5px; width: calc(100% - 1em - 2px); resize: none; color:#444; background-color: #FFF; -webkit-appearance:none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);}select{ background-image: linear-gradient(45deg, transparent 50%, gray 50%), linear-gradient(315deg, transparent 50%, gray 50%); background-position: calc(100% - 20px) calc(1em + 2px), calc(100% - 15px) calc(1em + 2px); background-size: 5px 5px, 5px 5px;  background-repeat: no-repeat;}select:focus{background-image: linear-gradient(225deg, transparent 50%, gray 50%), linear-gradient(135deg, transparent 50%, gray 50%); background-position: calc(100% - 15px) 1em, calc(100% - 20px) 1em; background-size: 5px 5px, 5px 5px; background-repeat: no-repeat;}input[type="checkbox"],input[type="radio"]{ width:auto;}input[type="checkbox"]:checked{ background:url(../imgs/checked.svg) no-repeat; background-size:contain;}input:disabled { cursor: not-allowed;}select{ width:100%}hr{clear:both; border:0;}body{ background-color:#FFF;}p{ line-height:2em; text-align:justify; display:block;}a{ display:inline-block; cursor:pointer; transition:all 0.2s;}img{ width:100%; display: block; max-width: 100%;}#allMask{width: 100%; overflow: hidden; font-size:1.2vw; position:relative;}@media only screen and (max-width: 1100px){#allMask{font-size:1.55vw;}}@media only screen and (max-width: 850px){#allMask{font-size:1em;}}


/************************font************************/
@font-face{font-family:'bktype'; src:url('DFT_6.TTC') format("truetype");}
/************************btnsStyle************************/
.btnStyleA { display: inline-block; background-color: #14305b; color: #FFF; padding: 1em 0; transition: all 0.2s; width: 8em; font-weight: bold; letter-spacing: 0.2em; text-align: center; margin: 0.5em;}
.btnStyleB { background-color: #14305b; color: #FFF; padding: 0.2em 0.5em; transition: all 0.2s; font-weight: bold; margin: 0.3em;}
.btnStyleA:hover,
.btnStyleB:hover{ background-color:#7abbdb;}
.sbtnStyleA { color: #006AB4; display: inline-block;}
.sbtnStyleA:hover { text-decoration: underline;}
/************************tablefrom************************/
.form{width: 100%; border:0; margin-bottom: 1.2em;}
.inputTag{position: relative; margin: 1.2em 0.3em ; width: calc(100% - 0.6em); display:inline-block;}
.inputTag > span{position: absolute; top: -0.7em; background-color: #FFF; left: 0.5em; padding: 0 0.5em; font-size: 0.7em; color: #999;}
.form a{background-color: #7abbdb; border: 1px solid #7abbdb; color: #FFF; width: calc(100% - 0.6em); padding: 0.5em 0; border-radius: 5px; position: relative; margin: 1.2em 0.3em; display: inline-block;}
.form.type1 td{width: 25%;}
.form.type1 td[colspan="2"]{width: 50%;}
.form.type2 .inputTag{margin: auto;}
.form.type2 td{ padding:1em 0; border-bottom: 1px solid #DDD;}
.form.type2 tr:nth-child(1) td{ padding:0.5em; background-color:#DDD; text-align:center;}
.form.type2.setC img{ width:8em;}
.form.type3{ text-align:left;}
.form.type3 tr{}
.form.type3 td{width: 50%; padding-left: 1em;}
.form.type3 td:nth-child(2){border-left: 2px solid #BBB;}
.form.type3 .inputTag{margin: 0.5em 0.3em;}
.summary{width: 10em; font-size: 1.2em; font-weight: bold; text-align: right; margin-left: calc(100% - 10em);}
.summary span{float: left;}
.form.type4{text-align: left; border-top: 1px solid #BBB; border-right: 1px solid #BBB;}
.form.type4 tr{}
.form.type4 td{border-bottom: 1px solid #BBB; border-left: 1px solid #BBB;}
.form.type4 td:nth-child(1){ width:7em;}
.form.type4 .inputTag{margin: 0.5em 0.3em;}
@media only screen and (max-width: 600px){
.form.type1 td { width: 50%; display: block; float: left;}
.form.type1 td[colspan="2"],
.form.type1 td[colspan="4"]{width: 100%;}
.form.type2 tr{display: block; margin-bottom: 2em;}
.form.type2 tr:nth-child(1){ display:none;}
.form.type2 td{ display:block; padding: 0.5em 0; text-align: left;}
.form.type2.setA td:nth-child(1) .inputTag:before{ content:'';}
.form.type2.setA td:nth-child(2) .inputTag:before{ content:'';}
.form.type2.setA td:nth-child(3) .inputTag:before{ content:'';}
.form.type2.setA td:last-child { text-align:right;}
.form.type2.setB td:nth-child(1) .inputTag:before{ content:'';}
.form.type2.setB td:nth-child(2) .inputTag:before{ content:'';}
.form.type2.setB td:nth-child(3) .inputTag:before{ content:'';}
.form.type2.setB td:nth-child(4) .inputTag:before{ content:'';}
.form.type2.setB td:nth-child(5) .inputTag:before{ content:'';}
.form.type2.setB td:last-child { text-align:right;}
.form.type2.setC td:nth-child(2) .inputTag:before{ content:'';}
.form.type2.setC td:nth-child(3) .inputTag:before{ content:'';}
.form.type2.setC td:nth-child(4) .inputTag:before{ content:'';}
.form.type2.setC td:nth-child(5) .inputTag:before{ content:'';}
.form.type3 td{width: 100%; display:block; border-left: 2px solid #BBB;}
}
/************************popup************************/
.popup{ position: fixed; background-color: #0000006b; width: 100%; height: 100%; z-index: 99999;}
.popup .box{ background-color: #FFF; text-align: center; padding: 2em 3em; width: 36em; max-width: calc(94% - 8em); max-height: calc(100% - 8em); overflow-y: scroll;border: 0.7em solid #FFF; border-radius: 10px;}
.popup .box::-webkit-scrollbar { height: 5px; width: 5px;}
.popup .box::-webkit-scrollbar-thumb { background-color: #999; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px;}
.popup .closePopup{ background-color: #14305b; position: absolute; top: calc(50% - 15em); left: calc(50% + 16em); z-index: 1; color: #FFF; padding: 0.1em 0.8em; border-radius: 1em;}
.popup .closePopup:hover{background-color: #7abbdb;}
@media only screen and (max-width: 780px){
.popup .closePopup {left: calc(100% - 7em);}
}
@media only screen and (max-width: 600px){
.popup .box{ padding: 2em 1em; max-width: calc(94% - 4em); height: calc(100% - 12em);}
.popup .closePopup { top: 2.5em;}
}
/************************morePage************************/
.morePage { margin: 2em 0;}
.morePage .ctrl { display: inline-block; background-color: #14305b; width: 4em; font-size: 0.8em; font-weight: bold; color: #FFF; border-radius: 1em; margin: 0 0.5em;}
.morePage b a { margin: 0 0.5em; color: #968885; position: relative;}
.morePage b a.use { color: #FFF; z-index: 1;}
.morePage b a.use:after { content: ''; position: absolute; width: 1.55em; height: 1.5em; top: 50%; left: 50%; transform: translate(-50%,-50%); background-color: #7abbdb; border-radius: 100%; z-index: -1;}
.morePage b:after { content: '.';}
/************************alignSet************************/
.alignCenter{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);}
.alignX{ position:absolute; left:50%; transform: translateX(-50%);}
.alignY{ position:absolute; top:50%; transform: translateY(-50%);}
/************************Before After************************/
.backSupport:after{content: ''; display: block; width: 100%; padding-top: 100%;}
.roundBg:after { content: ''; position: absolute; width:100%; padding-top: 100%; background-color: #14305b; left: 50%; top: 50%; transform: translate(-50%,-50%); z-index: -1; border-radius: 100%;}
/*************************txtdiminish**********************************/
.txtdiminish{ overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4;}
/***********************************************************/

/*==========通用===========*/
h1{ font-size:2.3em;}
h6{font-size: 1.3em; padding: 2em 1em; border-bottom: 1px solid #666; border-top: 1px solid #666; line-height: 1.6em; color: #FF5722;}
p{ color:#333;}
.moreBtn{ padding:0.8em 1.6em; border:1px solid; border-radius:5em; color: #006DA8;}
.moreBtn:hover{color: #FFF; background-color:#006DA8;}
.focus{color: #FFF; margin: 0 0 2em; background-color: #00a0ae; padding: 1em; border-radius: 0.5em; font-weight: bold;}
.fromA{margin-bottom: 2em;}
.fromA td{padding-bottom: 0.6em;}
.fromA td:nth-child(1){ width:5em;}
.fromA td:nth-child(2){ width:calc(100% - 5em);}
.downloadlist{display: flex; display:-webkit-flex; flex-wrap: wrap; justify-content: flex-start;}
.downloadlist a{width: calc(33.33% - 2.5em); background-color: #00a0ae; background: linear-gradient( 0deg , #007680 calc(20%),#00A0AE 100%); color: #FFF; font-weight: bold; margin: 0 0.25em 0.5em; padding: 1em; 
border-radius: 0.2em; text-align: center;}
.downloadlist a:hover{background: linear-gradient(0deg,#025e66 calc(20%),#01848f 100%);}
@media only screen and (max-width: 600px){
.fromA td{display: block; width: 100% !important;}
.downloadlist a{width: calc(100% - 2.5em);}
}
/*============animetion=============*/
.lefttoright{position: relative; left: 5em; opacity: 0; transition:all 1s;}
.lefttoright.run{left: 0em; opacity: 1;}
.downtotop{position: relative; top: 5em; opacity: 0; transition:all 1s;}
.downtotop.run{top: 0em; opacity: 1;}
/*=========================*/


#mainMenu{position: fixed; top: 2em; right: 2em; z-index: 2;}
#mainMenu .menuswitch{ display:none; width: 3em; height: 3em; position: absolute; top: 2em; right: 1em; background-image: url(../pics/menuswitch.svg); background-size: 200% 100%; background-position: left; z-index: 1;}
#mainMenu ul{background-color: #00a0ae; padding: 0 1em; border-radius: 2em; box-shadow: 0px 3px 15px rgb(0 0 0 / 25%); background: linear-gradient(0deg, #007680 calc(20%),#00A0AE 100%); font-size: 0.9em;}
#mainMenu ul li{display: inline-block; background: linear-gradient(0deg,#007680 calc(20%),#00A0AE 100%); background-color: #00a0ae; padding: 0.3em 0.6em; border-left: 2px solid rgb(255 255 255 / 20%); transition:all 0.2s;}
#mainMenu ul li:hover{background: linear-gradient(0deg,#025e66 calc(20%),#01848f 100%);}
#mainMenu ul li:nth-child(1){ border-left: none;}
#mainMenu ul a{color: #FFF;}

#topbtn{width: 2em; position: fixed; z-index: 3; right: 1em; bottom: 1em; -webkit-filter: drop-shadow(0px 5px 2px rgb(0 0 0 / 25%));}
#OpBg{ position: fixed; top: 0; width: 100%; height: 100vh; z-index:-1; background: #5dc2f2; background: linear-gradient(135deg,  #94D7F6 0%,#ffffff 50%);}
#OpBg img{position: absolute; right: -35vh; bottom: -70vh; width: auto; height: 150vh; max-width: 150vw;}

#opView{position: relative; height: 90vh;}
#opView .text{position: absolute; top: 15%; left: 10%;}
#opView .text div{font-size: 1.2em; position: relative;}
#opView .text .mainImg{width: 20em; margin-bottom:2em;  -webkit-filter: drop-shadow(5px 5px 2px #FFF);}
#opView .text h3{ color:#006da8; display: inline-block; padding: 0 0.3em;}
#opView .text h2,
#opView .text p{ color:#00a0ae; display: inline-block; padding: 0 0.3em;}
#news{ position:relative; background:linear-gradient(0deg, rgb(255 255 255 / 85%) calc(100% - 30vh),rgb(255 255 255 / 0%) 100%);}
#news .newsImg1{left: 0; width: 30em; top: 50%;}
#news .newsImg2{width: 35em; max-width: 100%; left: 70%; top: 94%; z-index:1;}
#news .box{ position:relative; padding: 40vh 1em 30vh; max-width: 35em; margin: auto;}
#news .box > div{ padding:1em; border-radius:1em;}
#news h1{margin-bottom: 0.5em; color: #006DA8;}
#news .newsList{margin-bottom: 1em;}
#news .newsList li{color: #006DA8; padding: 0.5em 0; border-bottom: 1px dashed;}
#news .newsList span{font-size: 0.8em; background-color: #006DA8; color: #FFF; padding: 0 0.6em; border-radius: 1em;}
#news .newsList a{color: #006DA8; font-weight: bold; width: calc(100% - 8em); margin-left: 0.8em; background-color: rgb(255 255 255 / 70%); padding: 0.2em 0.5em; border-radius: 1em;}
#news .newsList a:hover{background-color: #006da8; color: #FFF;}

#results{background-color: rgb(255 255 255 / 85%); padding-top: 12em; }
#results > div{ position:relative; z-index:1; padding: 7em 2em;}
#results > div::after{ content:''; position:absolute; top:0; left:0; width:100%; height:calc(100% + 50vh); background:linear-gradient(0deg, #007680 calc(20%),#00A0AE 100%); z-index:-1;}
#results .title{top: 0; background: linear-gradient(0deg, #1383BF 0%,#A7DCF8 100%); padding: 2.5em 0; border-radius: 1em; box-shadow: 0 5px 10px rgb(0 0 0 / 20%); width: 17em; text-align: center;}
#results .title h1{color: #FFF;}
#results .copyresults{ display:none}
#results .slideMask{overflow: hidden;}
#results ul{}
#results li{ float:left; float: left; max-height: calc(52.65vw + 11em); overflow: hidden; margin-bottom: 2em;}
#results li a{ margin:1em; position:relative; width: calc(100% - 2em);}
#results li a > div{ background-color:#000; border: 1px solid #DDD; background-position:center; background-repeat:no-repeat; background-size:cover;}
#results li a > div::after{ content: ''; display: block; width: 100%; padding-top: 60%;}
#results li a > div::before{ content: ''; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width: 100%; height:100%; border: 0px solid #FFF; transition:all 0.2s;}
#results li a:hover > div::before{border: 5px solid #FFF;}
#results li img{}
#results li h3{color: #FFF; margin: 0.8em 0;}
#results li p{ color:#FFF; }
#results .switchBtn{width: 100%; height:0;}
#results .switchBtn .iconA{ background-color:rgb(50 50 50 / 60%); padding: 0.8em;}
#results .switchBtn .right{ float:right; transform: scaleX(-1);}
#results .switchBtn .left{ float:left;}
#link{ position:relative; z-index:1;}
#link .linkimg{position: relative; margin-bottom: 6em;}
#link .linkimg::after{content: ''; position: absolute; top: 10vw; left: 50%; border-radius: 100%; transform: translate(-50%,0); width: 200vw; padding-top: 200%; z-index: -1; background-color: #ffffff;}
#link .linkimg img:nth-child(1){width: 50em; max-width: 85%; margin: auto;}
#link .linkimg img:nth-child(2){ top: 100%; width: 60em; max-width: 90%;}
#link h1{margin-bottom: 0.5em; color: #006DA8; text-align: center;}
#link .btnbox{ max-width: 65em; padding: 2em 1em 4em; margin: auto; background-color: #FFF;}
#link .btnbox a{width: calc(25% - 1em); margin: 0.5em; float: left;}
#link .btnbox a > div::before { content: ''; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 100%; height: 100%; border: 0px solid #DDD; transition: all 0.2s;}
#link .btnbox a:hover > div::before{border: 6px solid #DDD; width:calc(100% - 3px); height:calc(100% - 3px);}
#link .btnbox .img{border: 1px solid #CCC; background-position: center; background-size: cover;}
#link .btnbox .img:after{ padding-top:50%;}
#link .btnbox p{text-align: center; height: 2.5em; line-height: 1.3em; padding: 0.3em 0;}
#map{ position:relative; z-index: 1; height:50vh; background-color:#333; border-top: 1px solid #999; border-bottom: 1px solid #999;}
#map iframe{width: 100%; height: 100%;}
#inbanner{ position:relative; height: calc(100vh - 10em); min-height: 26em; background-position: bottom center; background-size: cover;}
#inbanner > a{position: unset;}
#inbanner .treebg{ position:absolute; width:28em; top:12%; left:6%; max-width: 65%;}
#inbanner h2{top: 77%; font-size:1.6em; color: #FFF; text-shadow: 0 3px 20px rgb(0 0 0); width: 80%; text-align: center;}
#inbanner .people{min-width: 40em; max-width: 55em; top: 98%;}
#maincontents{ position: relative; text-align: center; padding: 5em 2em 42vw;}
#maincontents::after{ content:''; position:absolute; width:100%; height:40vw; bottom:0; left: 0; background: linear-gradient(0deg, #c2ebff 0%,#FFF 100%); z-index: -1;}
#maincontents::before{ content: ''; background-image: url(../pics/mainImg2.svg); background-size: 100% auto; background-position: center; background-repeat: no-repeat; position: absolute; left: 50%; top: 100%; width: 80vw; padding-top: 100%; transform: translate(-50%,-42%); z-index: 1;}
#maincontents .submenu{display: inline-block; width: 15em; margin-right: 1em; vertical-align: top;}
#maincontents .submenu .lv1{}
#maincontents .submenu .lv1 > li{}
#maincontents .submenu .lv1 > li > div{ position:relative; background: linear-gradient(0deg, rgb(0 118 128) calc(20%),rgb(0 160 174) 100%);-webkit-filter:sepia(1) grayscale(0.6); opacity:0.5; margin-bottom: 0.8em; border-radius: 0.8em; overflow: auto; transition:all 0.3s;}
#maincontents .submenu .lv1 > li > div:hover,
#maincontents .submenu .lv1 > li.use > div{-webkit-filter:sepia(0) grayscale(0); opacity: 1;}
#maincontents .submenu .lv1 > li.use > div > a:nth-child(2) { transform:scaleY(-1);}
#maincontents .submenu .lv1 > li > div > a.lv1List{ color: #FFF; padding: 0.5em; font-weight: bold; text-align: left; display: block;}
#maincontents .submenu .lv1 > li > div > a[menuswitch]{ height: 100%; position: absolute;top: 0; right: 0; width: 2em; background-color: rgb(94 94 94 / 50%); background-image: url(../pics/w_arrow2.svg); background-position: center; background-repeat: no-repeat; background-size: 60%; transition: none;}
#maincontents .submenu .lv2{ display:none;}
#maincontents .submenu .lv2 > li{ padding-left: 1.2em; position: relative; left: -0.7em; transition:all 0.3s;}
#maincontents .submenu .lv2 > li.use,
#maincontents .submenu .lv2 > li:hover{ left: 0;}
#maincontents .submenu .lv2 > li:last-child{ margin-bottom:0.8em;}
#maincontents .submenu .lv2 > li > a{ color:#6d675c; margin-bottom: 0.2em; font-weight: bold; display: block; text-align: left;}
#maincontents .submenu .lv2 > li:hover > a,
#maincontents .submenu .lv2 > li.use > a{ color: #009ba9;}
#maincontents .submenu .lv2 > li > a::after{ content:"▲"; position:absolute; left:-1em; transform: rotate(90deg); opacity:0; transition:all 0.3s;}
#maincontents .submenu .lv2 > li:hover > a::after,
#maincontents .submenu .lv2 > li.use > a::after{ opacity:1;}
#maincontents #nowtitle{ display:block; padding:0.8em 2.5em 0.8em 0.5em; border-radius:0.5em; color:#FFF; font-weight:bold; background: linear-gradient(0deg,#007680 calc(20%),#00A0AE 100%);}
#maincontents #nowtitle::after{ content:''; position:absolute; right:0.5em; top:50%; transform:translateY(-50%); width:1.5em; height:1.5em; background: url(../pics/submenuicon.svg) no-repeat; background-size:contain;}
#maincontents .submenumin{ display:none; background-color: #ececec; text-align: left; margin-bottom: 2em; border-radius: 0.5em; box-shadow: 0 6px 10px rgb(0 0 0 / 20%);}
#maincontents .submenumin .lv1{display: none;}
#maincontents .submenumin .lv1 > li{}
#maincontents .submenumin .lv1 > li > div{ }
#maincontents .submenumin .lv1 > li.use > div{ color:#FFF; background: linear-gradient(0deg,#007680 calc(20%),#00A0AE 100%);}
#maincontents .submenumin .lv1 > li.use > div > a:nth-child(2) { }
#maincontents .submenumin .lv1 > li > div > a.lv1List{display: block; padding: 0.5em; background-color: #dadada; font-weight: bold;}
#maincontents .submenumin .lv1 > li.use > div > a.lv1List,
#maincontents .submenumin .lv1 > li > div:hover a{background: linear-gradient(0deg,#007680 calc(20%),#00A0AE 100%); color:#FFF;}
#maincontents .submenumin .lv1 > li > div > a[menuswitch]{ }
#maincontents .submenumin .lv2{ }
#maincontents .submenumin .lv2 > li{ }
#maincontents .submenumin .lv2 > li.use,
#maincontents .submenumin .lv2 > li:hover{ }
#maincontents .submenumin .lv2 > li:last-child{ }
#maincontents .submenumin .lv2 > li > a{display: block; padding: 0.5em 0.5em 0.5em 1.5em; color: #6d675c;}
#maincontents .submenumin .lv2 > li:hover > a,
#maincontents .submenumin .lv2 > li.use > a{background-color: #0098a6; color: #FFF;}
#maincontents .submenumin .lv2 > li > a::after{content:"▲"; position:absolute; left:0.3em; transform: rotate(90deg); opacity:0; transition:all 0.3s;}
#maincontents .submenumin .lv2 > li:hover > a::after,
#maincontents .submenumin .lv2 > li.use > a::after{opacity:1;}
#maincontents .submenumin .close{ display: block; background-color: #dadada; border-bottom-left-radius: 0.5em; border-bottom-right-radius: 0.5em;}
#maincontents .submenumin .close img{ width: 1.5em; margin: auto;}

#maincontents .htmlupload,#maincontents .contentbox{ display: inline-block; width: 40em; max-width: 100%; vertical-align: top; text-align: left;}
#maincontents .htmlupload img{ display: inline-block !important;}
#maincontents .htmlupload a { color: #007e89; text-decoration: underline;}
#maincontents .htmlupload table{max-width:100% !important;}

#footer{position: relative; z-index: 1; background-color:#CCC;}
#footer > div{max-width: 60em; margin: auto; padding: 3em 1em 6em; text-align: center;}
#footer .mainimg{width: 20%; position: relative; display: inline-block; vertical-align: middle;}
#footer .mainimg img{ width:67%; margin: auto;}
#footer .mainimg:after{background-color: #ffffff;}
#footer .info{display: inline-block; width: calc(80% - 3em); margin-left: 2em; vertical-align: middle; text-align: left;}
#footer .info > div:nth-child(1){padding: 1em 0; border-bottom: 1px solid #999;}
#footer .info > div:nth-child(1) a{font-size: 1.1em; font-weight: bold; padding: 0 1.2em; border-left: 2px solid #999;}
#footer .info > div:nth-child(1) a:hover{ color:#FFF;}
#footer .info > div:nth-child(2){padding: 2em 0;}
#footer .info > div:nth-child(2) > div{width: calc(50% - 1em); float: left; margin-bottom: 1em; margin-right: 1em;}
#footer .info > div:nth-child(2) h3{}
#footer .info > div:nth-child(2) p{}
#footer .info > div:nth-child(3){}

@media only screen and (max-width: 1000px){
#mainMenu{top: 0; right: 0;}
#mainMenu .menuswitch{ display:block;}
#mainMenu ul{position: absolute; right: -70vw; transition: all 0.3s; padding-top: 5em; width: calc(70vw - 2em); height: calc(100vh - 5em); border-radius: 0; border-bottom-left-radius: 5em; background: linear-gradient(0deg, hsl(185deg 100% 25% / 90%) calc(20%),#00A0AE 100%);}
#mainMenu ul li{display: block; border-left: none; border-bottom: 2px solid rgb(255 255 255 / 20%); background: none; background-color: none;}
#mainMenu ul a{ padding: 0.6em;	display: block;}
#opView .text{font-size:0.8em; top: 10%; left: 8%;}
}
@media only screen and (max-width: 850px){
#maincontents .submenu{ display:none;}
#maincontents .submenumin{ display:block;}
}
@media only screen and (max-width: 600px){
#opView .text{font-size:0.6em; top: 8%;}
#news .newsList a{ width: calc(100% - 1em); margin-left:auto;}
#results .copyresults{ display:block;}
#results .slideMask{ display:none;}
#results .switchBtn{ display:none;}
#link .btnbox a{width: calc(50% - 1em);}
#news .newsImg1{left: -1em; width: 14em; top: 17%;}
#footer .mainimg{margin: 10vw 0 20vw; width: 70%; max-width: 18em;}
#footer .info{width: calc(100% - 2em); margin: auto;}
#footer .info > div:nth-child(1) a{display: block;}
#footer .info > div:nth-child(2) > div{width: 100%;}
}