body { margin: 0px; padding: 0px; background-color: #ffffff; font-family: 'Source Sans Pro', sans-serif; } #header { background-color: #3f8dbf; float: left; width: 100%; height: 50px; color: rgba(255, 255, 255, 1); line-height: 50px; position: fixed; left: 0px; top: 0px; z-index: 1; } #header a { color: rgba(255, 255, 255, 1); text-decoration: none; display: block; font-size: 15px; } #header-left { float: left; height: 50px; } #header-left:hover #header-left-icon { background-color: #3F8DBF; } #header-left:hover #header-left-text { background-color: #599BC8; } #header-left-icon { float: left; height: 50px; width: 50px; text-align: center; background-color: #35759F; -webkit-transition: background 0.5s; -moz-transition: background 0.5s; -o-transition: background 0.5s; transition: background 0.5s; } #header-left-icon a { font-size: 25px; } #header-left-text { float: left; height: 50px; -webkit-transition: background 0.5s; -moz-transition: background 0.5s; -o-transition: background 0.5s; transition: background 0.5s; } #header-left-text a { padding-left: 20px; padding-right: 20px; } #header-right { float: right; height: 50px; } #header-right:hover #header-right-icon { background-color: #3F8DBF; } #header-right:hover #header-right-text { background-color: #599BC8; } #header-right-icon { float: right; height: 50px; width: 50px; text-align: center; background-color: #35759F; -webkit-transition: background 0.5s; -moz-transition: background 0.5s; -o-transition: background 0.5s; transition: background 0.5s; } #header-right-text { float: right; height: 50px; -webkit-transition: background 0.5s; -moz-transition: background 0.5s; -o-transition: background 0.5s; transition: background 0.5s; } #header-right-text a { padding-right: 20px; padding-left: 20px; } .wrapper { width: 100%; float: left; margin-top: 50px; margin-bottom: 150px; } .wrapper-inner { width: 1100px; margin-right: auto; margin-left: auto; -webkit-touch-callout: none; /* iOS Safari */ -webkit-user-select: none; /* Chrome/Safari/Opera */ -khtml-user-select: none; /* Konqueror */ -moz-user-select: none; /* Firefox */ -ms-user-select: none; /* IE/Edge */ user-select: none; /* non-prefixed version, currently not supported by any browser */ } .wrapper-inner-buttons { width: 100%; float: left; margin-top: 50px; text-align: center; } .wrapper-inner-buttons a { background-color: #3f8dbf; line-height: 35px; padding-right: 15px; padding-left: 15px; margin: 10px; display: inline-block; text-align: center; text-decoration: none; color: #FFFFFF; -webkit-transition: background 0.5s; -moz-transition: background 0.5s; -o-transition: background 0.5s; transition: background 0.5s; border-radius: calc(35px / 2); } .wrapper-inner-buttons a.current { background-color: #f5d76e; color: #d35400; } .wrapper-inner-buttons a:hover { background-color: #35759F; color: #fff; } .mobile { width: 100%; float: left; display: none; /* margin-top: 100px; */ } .mobile-inner { width: 100%; height: 50px; margin-right: auto; margin-left: auto; background-color: #fafafa; position: relative; } .logo_box { position: absolute; display: flex; height: 50px; margin-left: 3%; align-items: center; z-index: 1; } .mobile-inner img { width: 250px; /* margin-bottom: 30px; */ } .mobile-inner p { color: #676767; line-height: 25px; font-size: 16px; padding-bottom: 30px; padding-right: 30px; padding-left: 30px; margin: 0px; } .mobile-inner-header { /* background-color: rgba(250, 246, 246, 0.7); */ width: 100%; height: 50px; position: absolute; top: 0px; left: 0px; } .mobile-inner-header-icon { color: #000; height: 50px; font-size: 25px; text-align: center; float: right; width: 50px; position: relative; -webkit-transition: background 0.5s; -moz-transition: background 0.5s; -o-transition: background 0.5s; transition: background 0.5s; } .mobile-inner-header-icon:hover { background-color: rgba(90, 90, 90, 0.7); cursor: pointer; } .mobile-inner-header-icon span { position: absolute; left: calc((100% - 25px) / 2); top: calc((100% - 1px) / 2); width: 25px; height: 1px; background-color: rgb(5, 5, 5); } .mobile-inner-header-icon span:nth-child(1) { transform: translateY(4px) rotate(0deg); } .mobile-inner-header-icon span:nth-child(2) { transform: translateY(-4px) rotate(0deg); } .mobile-inner-header-icon-click span:nth-child(1) { animation-duration: 0.5s; animation-fill-mode: both; animation-name: clickfirst; } .mobile-inner-header-icon-click span:nth-child(2) { animation-duration: 0.5s; animation-fill-mode: both; animation-name: clicksecond; } @keyframes clickfirst { 0% { transform: translateY(4px) rotate(0deg); } 100% { transform: translateY(0) rotate(45deg); } } @keyframes clicksecond { 0% { transform: translateY(-4px) rotate(0deg); } 100% { transform: translateY(0) rotate(-45deg); } } .mobile-inner-header-icon-out span:nth-child(1) { animation-duration: 0.5s; animation-fill-mode: both; animation-name: outfirst; } .mobile-inner-header-icon-out span:nth-child(2) { animation-duration: 0.5s; animation-fill-mode: both; animation-name: outsecond; } @keyframes outfirst { 0% { transform: translateY(0) rotate(-45deg); } 100% { transform: translateY(-4px) rotate(0deg); } } @keyframes outsecond { 0% { transform: translateY(0) rotate(45deg); } 100% { transform: translateY(4px) rotate(0deg); } } .mobile-inner-nav { background-color: rgba(231, 231, 231, 0.9); width: 100%; position: absolute; top: 50px; left: 0px; padding-top: 30px; padding-bottom: 80px; display: none; } .mobile-inner-nav a { display: inline-block; line-height: 50px; text-decoration: none; width: 80%; margin-left: 10%; color: #000; border-bottom: solid 1px rgba(37, 36, 36, 0.493); -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; font-weight: 300; } .mobile-inner-nav a:hover { color: rgba(255, 255, 255, 0.4); border-bottom: solid 1px rgba(214, 152, 66, 1); } .mobile-inner-nav .m_van_1 { display: inline-block; line-height: 50px; text-decoration: none; width: 80%; margin-left: 10%; color: #000; border-bottom: solid 1px rgba(37, 36, 36, 0.493); -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; font-weight: 300; overflow: hidden; } .mobile-inner-nav .m_van_1:hover { color: rgba(214, 152, 66, 1); border-bottom: solid 1px rgba(214, 152, 66, 1); } .mobile-inner-nav .m_van_1 { -webkit-animation-duration: 0.8s; animation-duration: 0.8s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-name: ReturnToNormal; animation-name: ReturnToNormal; } .m_van_2_cont { height: 0; overflow: hidden; } .m_van_2_cont li { height: 50px; margin-bottom: 5px; } .m_van_2_cont li:last-child a { border-bottom: none; } .m_arr { color: rgba(214, 152, 66, 1); border-bottom: solid 1px rgba(214, 152, 66, 1); } .m_arr .m_van_2_cont { height: auto; } .pm-viewMore ul li a { line-height: 35px; }