@charset "utf-8";


.Header{ position: relative; height: 60px; background-color: #1a2a99; top: 0; animation-delay:0s !important; }
.Header .wCon{ width: auto; padding: 0 10px; height: 100%; }
.Header .Logo img{ max-width: 40vw; }
.Bbqh li{ width: auto; height: auto; border-radius: 5px; }
.Bbqh li a{ font-size: calc(100vw / (414 / 12)); padding: 7px 15px; white-space: nowrap; box-sizing: border-box;}
.Bbqh li.CN{ background-color: #8f8f8f;}
.Bbqh li.EN{ margin-left: 0.5em; }

.Main{ height: auto; display: block; padding: 10px; }
.Card{ width: auto; height: 50vh; box-shadow: 0px 2px 8px -3px rgba(0, 0, 0, 0.6); }
.Card + .Card{ margin-top: 10px; }

.Card .photo{ width: 100%; left: auto !important; right: auto !important; transform: none !important; }

.Card .Con .Text{ left: 15px; right: 15px; top: auto; bottom: 40px; }
.Card .Con .tit>h1{ font-size: calc(100vw / (414 / 24));}
.Card .Con .tit>h2{ font-size: calc(100vw / (414 / 22)); margin-top:0;}
.Card:not(.close) .Con .tit>h2 font::after{ width: calc(100vw / (414 / 54)); left: calc(0px - 100vw / (414 / 44)); height: calc(100vw / (414 / 63)); background-size: contain !important; }
.Card:not(.close) .Con .tit>h1,
.Card:not(.close) .Con .tit>h2{ text-indent: calc(100vw / (414 / 44)); }
.Card .Con .tit>h3{ font-size: calc(100vw / (414 / 14)); margin-top: calc(100vw / (414 / 5));}

.Card .Con .desc{ display: block; margin: 10px 0 0; font-size: calc(100vw / (414 / 14)); line-height: 1.3; padding: 10px; max-height: 12vh; overflow-y: auto; }






.Card .Con .ico{ display: none; }
.Card .Con .num{ left: auto; right: 15px; bottom: 10px; font-size: calc(100vw / (414 / 14));}









.Footer{ height: auto; padding: 15px 10px; }