header {
    position:relative;
    width:100%;
    height:90px;
    background:white;
}

header nav {
    display:flex;
    width:1400px;
    margin:0 auto;
    border-radius:100px;
}

main {
    position:relative;

}

main h2 {
    width:100%;
    font-size:2rem;
    margin-top:10px;
    letter-spacing:-1px;
}

main hr {
    width:100px;
    margin:2rem auto;
}

main h3 {
    width:100%;
    font-size:2rem;
    font-weight:400;
}

header nav#top {
    margin-top:30px;
    display:flex;
    align-items:center;
    justify-content:space-between;
}

header nav#top h1 {
    width:140px;
    height:80px;
    margin-right:200px;
    margin-left:50px;
}
header nav#top h1 img {
    width:170%;
}

header nav#top ul {
    width:170px;
    display:flex;
    justify-content:space-between;
    align-items:center;
}

header a {
    color:black;
}

header nav#top ul > li:nth-of-type(2) > a {
    display:block;
    padding:3px 12px;
    background:black;
    border-radius:30px;
    color:white;
    margin-top:-5px;
}

header nav#top ul > li:nth-of-type(2) > a:before {
    position:relative;
    content:url("../img/earth_icon.svg");
    top:4px;
    margin-right:7px;
}

header nav#top ul > li:nth-of-type(2) > a:after {
    position:relative;
    content:url("../img/arrow_icon.svg");
    top:4px;
    margin-left:5px;
}
header nav#top ul > li img {
    width:25px;
}

header nav#top ul > li {
    float:left;
}

header nav#top ol {
    display:none;
    position:absolute;
    border:1px solid black;
    z-index:100;
    width:120px;
    padding:15px 10px;
    border-radius:20px;
    top:70px;
    background:white;
    text-align:center;
}

header nav#top ol li {
    padding:3px 0;
}

#visual {
    position:relative;
    width:100%;
    height:900px;
    background:#afb3bd;
    overflow:hidden;
}

#visual video {
    position:absolute;
    width:100%;
    left:50%;
    top:50%;
    transform:translate(-50%, -50%);
}

#visual #hgroup {
    position:absolute;
    z-index:100;
    width:900px;    
    color:white;
    text-align:center;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
}

#visual #hgroup h2 {
    font-size:6rem;
}

#visual #hgroup h3 {
    font-size:2rem;
    font-weight:100;
}

#visual #hgroup h4 {
    font-size:3rem;
    margin-top:100px;
}
#visual ul {
    display:flex;
    width:450px;
    margin:100px auto 0;
    justify-content: space-between;
    font-size:1.5rem;
}


#visual ul li a {
    border:1px solid white;
    border-radius:20px;
    color:white;
    padding:25px 40px;
}
#visual ul li span {
    position:relative;
    top:2px;
    right:12px;
}
#visual ul li img {
    width:22px;
}

main.alarm section{
    display:flex;
    width:1000px;
    margin:200px auto;
}

main.alarm section#voice img {
    width:70%;
}

main.alarm section#message img {
    width:90%;
}

main.alarm section#message{
    text-align:right;
}

main.alarm section article:nth-of-type(1) {
    width:45%;
}

main.alarm section article:nth-of-type(1) {
    width:45%;
}

main#about #slideMask {
    width:1330px;
    margin:200px auto 0;
    overflow:hidden;
}

main#about #aboutSlider {
    position:relative;
    width:2000px;
    height:700px;
    margin-left:50px;

}

main#about #aboutSlider article {
    width:400px;
    height:400px;
    border-radius:20px;
    color:white;
    float:left;
    box-shadow:0px 0px 10px 7px rgba(0,0,0,0.1);
    margin-right:30px;    
}

main#about #aboutSlider article#p01 {
    background:url(../img/p01.jpg);
    background-size:cover;    
}
main#about #aboutSlider article#p02 {
    background:url(../img/p02.jpg);
    background-size:cover;    
}
main#about #aboutSlider article#p03 {
    background:url(../img/p03.jpg);
    background-size:cover;    
}
main#about #aboutSlider article#p04 {
    background:url(../img/p04.jpg);
    background-size:cover;    
}


main#about section article img {
    width:45%;
    height:70%;
    background:purple;
}

main#about article {
    width:50%;
    padding-top:250px;
    
}

main#about article  h2, main#about article  h3{
    margin:0 auto;
    width:70%;
    text-align:right;
}

main#message {
    height:340px;
    background:url('../img/bg01.jpg');
    background-size:cover;
    display:flex;
    flex-direction:column;
    text-align:center;
    justify-content: center;
    color:white;
}

main#message02 {
    height:700px;
    background:url('../img/bg02-02.png') center, url('../img/bg02.jpg');
    display:flex;
    flex-direction:column;
    text-align:center;
    justify-content: center;
    color:white;
}

main#message02 h2 {
    margin-bottom:20px;
    margin-top:0;
}


main#message h2 {
    margin-bottom:20px;
    margin-top:0;
}
main#priceForm {
    background:rgba(0,0,0,0.05);
    height:700px;
    display:flex;
    align-items: center;
}

main#priceForm h2 {
    line-height:3rem;
}

main#priceForm section{
    width:1100px;
    margin:0 auto;
    display:flex;
    justify-content: space-between;
}
main#priceForm  #info ol {
    margin:100px 0 50px;
    font-size:1.7rem;
    overflow:hidden;
}

main#priceForm  #info ol > li {
    float:left;
}

main#priceForm  #info ol > li > img {
    width:120%;
    margin-top:-10px;
    
}

main#priceForm  #info ul {
    display:flex;
    width:400px;
    justify-content: space-between;
    font-size:1.2rem;
}


main#priceForm #info ul li a {
    border:2px solid black;
    border-radius:20px;
    color:black;
    padding:25px 40px;
}
main#priceForm  #info ul li span {
    position:relative;
    top:5px;
    right:7px;
}
main#priceForm  #info ul li img {
    width:22px;
}


main#priceForm #info {
    width:670px;
    margin-top:80px;
}

main#priceForm ul li label {
    display:block;
    margin:20px 0 5px;
}

main#priceForm ul li input {
    width:280px;
    padding:15px;
    border-radius:100px;
    border:none;
    box-shadow:0px 0px 3px 5px rgba(0,0,0,0.03);
}

main#priceForm ul li textarea {
    width:280px;
    height:120px;
    border-radius:20px;
    border:none;
    padding:15px 10px;
    color:gray;
    box-shadow:0px 0px 3px 5px rgba(0,0,0,0.03);    
}

main#priceForm ul li input[type="submit"] {
    background:black;
    color:white;
    margin-top:30px;
}


footer {
    display:flex;
    background:white;
    text-align:left;
    align-items:center;
    padding:70px 0;
}
footer section {
    display:flex;
    width:1400px;
    margin:0 auto;
    color:gray;
    justify-content: space-between;
}

footer section ul {
    width:500px;
}

footer section li {
    margin-bottom:10px;
}

footer section li strong {
    color:black;
}

footer section article {
    display:flex;
    height:130px;
    justify-content: space-between;
    flex-direction:column;
}
footer section article li {
    float:right;
}
footer section article li:nth-of-type(2)::after {
    content:"";
    margin-left:20px;
}
footer section article ul li img {
    width:30px;
}

footer section ul li span {
    position:relative;
    top:6px;
    margin-right:5px;
}

footer section ul li span img {
    width:7%;
}

button#upBtn {
    position:fixed;
    width:100px;
    height:100px;
    right:50px;
    bottom:100px;
    z-index:200;
    border:none;
    background:transparent;
    cursor:pointer;
}

button#upBtn img {
    width:70%;
}