* { padding: 0; margin: 0; }

ul, li { list-style: none; }

img { vertical-align: middle; border: none; }

a { text-decoration: none; }

.floatLeft { float: left; }

.floatRight { float: right; }

.clearfix:after { content: ""; display: block; width: 0; height: 0; clear: both; }

/* @media  (min-width: 1920px) {
  .bodys{
    width: 90%;
    margin: 0 auto;
    border: $border;
  }
} */
.bodys { width: 100%; }

.bodys > header { width: 100%; }

.bodys > header > div { width: 60%; margin: 0 auto; padding: 25px 0; text-align-last: justify; text-align: justify; }

@media (min-width: 768px) { .bodys > header > div { width: 100%; } }

@media (min-width: 992px) { .bodys > header > div { width: 970px; } }

@media (min-width: 1200px) { .bodys > header > div { width: 1160px; } }

.bodys > header > div div { display: inline-block; vertical-align: middle; }

.bodys > header > div div span { display: inline-block; vertical-align: middle; }

.bodys > header > div div span + img { margin-left: 30px; }

.bodys > header > div div img { width: 8%; }

.bodys > header > div div > div { vertical-align: middle; width: 163px; }

.bodys > header > div div > div img { width: 15%; }

.bodys > header > div > img { width: 18%; }

.bodys > main { display: block; margin: 0 auto; text-align: right; overflow: hidden; }

@media (min-width: 768px) { .bodys > main { width: 100%; } }

@media (min-width: 992px) { .bodys > main { width: 970px; } }

@media (min-width: 1200px) { .bodys > main { width: 1160px; } }

.bodys > main nav { padding: 25px 0; margin-bottom: 20px; }

.bodys > main nav img { width: 16px; margin-bottom: 3px; }

.bodys > main nav a { color: #666; text-decoration: none; }

.bodys > main nav a, .bodys > main nav span { padding-left: 5px; }

.bodys > main article { font-size: 14px; line-height: 22px; text-align: center; }

.bodys > main article h2 { color: #205684; text-align: left; margin-bottom: 40px; }

.bodys > main article > img { width: 100%; height: 400px; }

.bodys > main article div { text-align: left; }

.bodys > main article img { margin: 10px 0; }

.bodys > main article main { margin-top: 40px; }

.bodys > main ul { margin: 30px 0; }

.bodys > main ul li { margin: 20px 0; border: 1px solid #d2d2d2; height: 130px; }

.bodys > main ul li .floatLeft { width: 11.5%; height: 100%; text-align: center; }

.bodys > main ul li .floatLeft:last-child { border-left: 1px solid #d2d2d2; background: #EEEEEE; }

.bodys > main ul li .floatLeft:first-child { box-sizing: border-box; width: calc(100% - 11.5% - 1px); text-align: left; padding: 20px 0 30px 22px; font-size: 14px; }

.bodys > main ul li .floatLeft:first-child P { height: 35px; }

.bodys > main ul li h3 { margin-top: 41%; color: #205684; text-align: center; }

.bodys > main ul li:hover .floatLeft:first-child, .bodys > main ul li:hover .floatLeft:last-child { background: #205684; color: #ffffff; }

.bodys > main ul li:hover .floatLeft h3 { color: #ffffff; }

.bodys > main .imgHref { height: 100px; line-height: 100px; }

.bodys > main .imgHref a { width: calc(100% / 4); text-align: center; display: inline-block; }

.bodys > main .imgHref a img { position: relative; height: 50px; transition: height 300ms; }

.bodys > main .imgHref a:hover img { height: 60px; }

.bodys > main .imgHref a.dtdsgp { width: calc(100% / 8); }

.bodys > main .imgHref a + a { margin-left: 30px; }

.bodys > footer { width: 100%; margin-top: 26px; text-align: center; padding: 45px 0; }

.bodys > footer p { font-size: 12px; margin-right: 50px; display: inline-block; vertical-align: middle; }