*{ margin: 0; padding: 0; } body{ position:relative; } .videobox{ width: 100%; } .videobox video{ /*margin-left:13%;*/ width: 100%; } @media (min-width: 2000px){ .center{ margin-top: 90px; min-width:800px; margin-left: 30%; } .footerbox{ width:800px; height:88px; left: 30%; } .button1{ margin: 15px 50px 5% 50px; } .button2{ margin: 15px 50px 5% 50px; } .tit{ font-size: 22px; } } @media only screen and (min-width: 1200px) and (max-width: 2000px) { .center{ margin-top: 90px; width:1024px; margin-left: 20%; } .footerbox{ width:60%; height:88px; left: 20%; } .tit{ font-size: 22px; } .button1{ margin: 15px 50px 5% 50px; } .button2{ margin: 15px 50px 5% 50px; } } @media (max-width: 768px) { .footerbox{ width:100%; height:88px; left: 0; } .tit{ font-size: 16px; } .button1{ margin: 15px 20px 5% 20px; } .button2{ margin: 15px 20px 5% 20px; } } @media only screen and (min-width: 768px) and (max-width: 1200px) { .center{ margin-top: 90px; width:800px; margin-left: 5%; } .footerbox{ width:800px; height:88px; left: 5%; } .button1{ margin: 15px 50px 5% 50px; } .button2{ margin: 15px 50px 5% 50px; } } .tit{ color:#DD5725; margin: 15px 0; text-align: center; line-height: 20px; } .center img{ height: auto; } .footerbox{ position: fixed; bottom:0; z-index:5; left: 50%; transform: translateX(-50%) } .button1{ width: 35%; height: 58px; background-color: #FEC73F; border: 0; color: #FFFFFF; } .button2{ width: 35%; height: 58px; float: right; background-color: #FE6D39; border: 0; color: #FFFFFF; }