
#CMain { padding: 0px 25px 25px; }
#CMain.MenuFixed {  }
.CMLeft { position: relative; overflow: hidden; float: left; width: 20%; height: 100%; border-right: solid 3px rgba( 11, 18, 35, 0.4 ); }
.CMLeft:after { float: none; clear: both; content: '.'; display: block; height: 0; overflow: hidden; }
.CMLeft .OpenPageMenu { display: none; float: right; padding: 5px 10px 5px 5px; cursor: pointer; }
.CMLeft .OpenPageMenu:after { float: none; clear: both; content: '.'; display: block; height: 0; overflow: hidden; }
.CMLeft .OpenPageMenu .ThisMenuTitle { float: left; padding-right: 5px; color: #FFFFFF; font-size: 15px; line-height: 24px; }
.CMLeft .OpenPageMenu span.material-icons { float: left; color: #FFFFFF; transition: .3s; }
.CMLeft svg { position: absolute; top: 0px; left: 0px; z-index: -1; width: calc( 100% + 100px ); padding: 50px 0px; fill: #0b1222; fill-opacity: 0.2; }
.CMLeft ul { float: none; clear: both; padding: 10px 0px; }
.CMLeft ul.Tag { border-top: solid 1px #142936; }
.CMLeft ul.Business { border-top: solid 1px #142936; }
.CMLeft ul li { margin: 0px 25px 8px 0px; }
.CMLeft ul li a { display: block; width: 100%; padding: 8px 15px 8px 15px; text-align: right; border-radius: 8px; }
.CMLeft ul li a.This { background-color: rgba( 13 ,31, 46, 0.5 ); box-shadow: 0px 4px 3px rgba( 0, 0, 0, 0.3 ); }
.CMLeft ul li a:hover { background-color: rgba( 255, 255, 255, 0.2 ); }
.CMLeft ul li a .Eng { display: block; font-size: 12px; color: #bbbbbb; }
.CMRight { float: left; width: 60%; padding: 0px 30px; }
.CMRight .CMRContent { margin-bottom: 20px; padding: 20px 40px; border-radius: 8px; background-color: rgba( 0, 35, 60, 0.4 ); box-shadow: 0px 5px 10px rgba(0,0,0,0.3); }
.CMRight .CMRContent .CMTitle { font-size: 33px; color: #FFFFFF; line-height: 70px; border-bottom: solid 1px #707070; }
.CMRight .CMRContent .CMTitle .Eng { font-size: 20px; color: #AAAAAA; }
.CMRight .CMRContent .CMContent { padding: 15px 0px; }
.CMRightOther { float: left; margin-bottom: 20px; width: 20%; padding: 0px 10px; }
.CMRightOther:after { float: none; clear: both; content: '.'; display: block; height: 0; overflow: hidden; }

#CMain.MenuFixed .CMLeft { position: fixed; top: 0px; width: calc( ( 100% - ( 25px * 2 ) ) * 0.2 - 3px ); }
#CMain.MenuFixed .CMRight { margin-left: 20%; }

form.ListSearch { margin-bottom: 10px; padding: 20px; border-radius: 5px; background-color: rgba( 0, 0, 0, 0.3 ); }
form.ListSearch::after { float: none; clear: both; content: '.'; display: block; height: 0; overflow: hidden; }
form.ListSearch input, form.ListSearch button, form.ListSearch select { float: left; }
form.ListSearch input[type="text"] { width: calc( 100% - 90px - 8px - 90px - 8px ); }
form.ListSearch button { margin-left: 8px; width: 90px; padding: 2px 10px; line-height: 20px; }
form.ListSearch button[type="submit"][name="Send"] { background-color: #6ca415; }
form.ListSearch button[type="submit"][name="Send"]:hover { background-color: #558c00 }
form.ListSearch button[type="submit"][name="Clear"] { background-color: #7b7b7b; }
form.ListSearch button[type="submit"][name="Clear"]:hover { background-color: #565656; }
form.ListSearch button[type="button"] { background-color: #7b7b7b; }
form.ListSearch button[type="button"]:hover { background-color: #565656; }


ul.PageLink { float: none; clear: both; margin: 20px auto; text-align: center; }
ul.PageLink li { display: inline; margin: 0px 5px; }
ul.PageLink li a { padding: 6px 8px 10px; border-radius: 5px; background-color: #002b36; }
ul.PageLink li a[t="page"] { padding: 6px 2px 10px; border-radius: 5px; background-color: transparent; }
ul.PageLink li a:hover { background-color: #004657; }
ul.PageLink li a[href="?"] { background-color: #2b3f45; }

ul.Sitemap { margin-left: 25px; }
ul.Sitemap li { list-style-type: disc; line-height: 33px; font-size: 18px; color: #FFFFFF; }
ul.Sitemap li span { color: #FFFFFF; }
ul.Sitemap li ol { margin-left: 25px; }
ul.Sitemap li ol li { list-style-type: decimal; }
ul.Sitemap li ul { margin-left: 25px; }
ul.Sitemap li ul li { list-style-type: circle; }


@media screen and ( max-width: 1700px ) {
.CMLeft { width: 15%; }
.CMLeft svg { width: calc( 100% + 80px ); padding: 50px 0px; }
.CMRight { width: 60%; }
.CMRightOther { width: 25%;  }

#CMain.MenuFixed .CMLeft { width: calc( ( 100% - ( 25px * 2 ) ) * 0.15 - 3px ); }
#CMain.MenuFixed .CMRight { margin-left: 15%; }
}


@media screen and ( max-width: 1440px ) {
.CMLeft { width: 230px; }
.CMLeft svg { width: calc( 100% + 50px ); padding: 50px 0px; }
.CMLeft ul li { margin: 0px 15px 8px 10px; }
.CMRight { width: calc( 100% - 230px - 300px ); padding: 0px 20px; }
.CMRightOther { width: 300px; }

#CMain.MenuFixed .CMLeft { width: 230px; }
#CMain.MenuFixed .CMRight { margin-left: 230px; }
}


@media screen and ( max-width: 1180px ) {
.CMLeft { width: 200px; }
.CMRight { width: calc( 100% - 200px ); padding: 0px 20px; }
.CMRightOther { float: right; width: calc( 100% - 200px ); }

#CMain.MenuFixed .CMLeft { width: 200px; }
#CMain.MenuFixed .CMRight { margin-left: 200px; }
}


@media screen and ( max-width: 1024px ) { 
#Main #CMain { padding: 0px 5px 0px; }
.CMLeft { width: 100%; padding: 0px 20px; border: none; }
.CMLeft .OpenPageMenu { display: block; }
.CMLeft ul { display: none; }
.CMLeft.Open ul { display: block; margin-bottom: 15px; }
.CMLeft.Open .OpenPageMenu span.material-icons { transform: rotate( 90deg ); }
.CMLeft svg { display: none; }
.CMLeft ul li { margin: 0px 0px 8px 0px; }
.CMLeft ul li a { padding: 8px 0px 8px 15px; text-align: left; }
.CMRight { width: 100%; padding: 0px 20px; }
.CMRight .CMRContent { padding: 20px 20px; }
.CMRightOther { width: 100%; }

#CMain.MenuFixed .CMLeft { position: relative; width: 100%; ); }
#CMain.MenuFixed .CMRight { margin-left: 0px; }
}


@media screen and ( max-width: 773px ) {
#CMain { padding: 0px 10px 0px; }
.CMRight { padding: 0px 10px; }
.CMRight .CMRContent { padding: 10px; }

.CMRight .CMRContent .CMTitle { font-size: 25px; }
.CMRight .CMRContent .CMTitle .Eng { font-size: 13px; }

}

@media screen and ( max-width: 414px ) {
#CMain { padding: 0px 5px 0px; }
.CMLeft { padding: 0px 10px; }
.CMRight { padding: 0px 5px; }
.CMRight .CMRContent { padding: 5px; }
.CMRight .CMRContent .CMTitle { line-height: 33px; }
.CMRight .CMRContent .CMTitle .Eng { display: block; font-size: 15px; }
.CMRightOther { padding: 0px 5px; }

form.ListSearch { padding: 10px; }
form.ListSearch input[type="text"] { width: calc( 100% - 80px - 8px - 80px - 8px ); }
form.ListSearch button { margin-left: 8px; width: 80px; padding: 2px 10px; font-size: 15px; }
}
