.responsive-layout {
     max-width: 100%;
     margin: 0 auto 
}
 @media all and (min-width:520px) {
     .responsive-layout {
         max-width: 520px 
    }
}
 @media all and (min-width:760px) {
     .responsive-layout {
         max-width: 100% 
    }
}
 @media all and (min-width:960px) {
     .responsive-layout {
         max-width: 960px 
    }
}
 .back {
     background-image: url("images/launch.png");
     background-repeat: no-repeat;
     background-size: cover;
     background-attachment: fixed;
     color: black;
     background-position: center;
     height: 100%;
}
 .shape{
     border-radius: 2em;
     padding: 2em 3.5em 4em 3.5em;
     width: 50%;
}
 .logo{
     display: flex;
     justify-content: space-between;
     align-items:center ;
}
 .line{
     width: 85%;
     height: 0.05em;
     background-color: black;
}
 .main{
     display: flex;
     align-items: center;
     padding-top: 2em;
}
 .logo img:nth-child(1){
     width: 310px;
     height: 51px;
}
 .main img{
     height: 439px;
     width: 545px;
}
 .language {
     position: relative;
     align-items: center;
}
 .language:focus{
     border: 1px solid rgb(193, 39, 45);
}

 @media only screen and (max-width: 1500px) {
     .main img {
         height: 419px;
         width: 535px;
    }
     .arrow img{
         height: 10px;
         width: 15px;
         position: absolute;
         top: 17px;
         right: 10px;
    }
     .dropdown{
         margin-left: 5em;
    }
}
 @media only screen and (max-width: 1024px) {
     .main img {
         height: 359px;
         width: 354px;
    }
}
 .logo img:nth-child(1) {
     width: 290px;
     height: 41px;
}
 .logo img:nth-child(1) {
     width: 127px;
     height: 101px;
}
 @media only screen and (max-width: 1200px) {
     .main img {
         height: 338px;
         width: 334px;
    }
}
 @media only screen and (max-width: 768px) {
     .main img {
         height: 289px;
         width: 284px;
    }
}
 .logo img:nth-child(1) {
     width: 280px;
     height: 41px;
}
 @media only screen and (max-width: 700px) {
     .back{
         display: block;
    }
     .shape {
         padding: 1em 0 4em 0;
         width: 50%;
    }
     .logo {
         padding: 0 1em;
    }
     .logo img:nth-child(1) {
         width: 190px;
         height: 41px;
    }
     .line {
         width: 75%;
         margin: 0 auto;
         height: 0.55px;
    }
     .main {
         flex-direction: column;
         margin-left: 0;
    }
     .main img {
         margin-bottom: 3em;
    }
     .language {
         margin-left:0px;
    }
}
 .dropdown option:hover {
     background-color: yellow !important;
}
 @font-face {
     font-family: 'NotoSansJP-Regular';
     src: url('fonts/NotoSansJP-Regular.otf') format('opentype');
     src: url('fonts/NotoSansJP-Regular.woff') format('woff'), url('fonts/NotoSansJP-Regular.ttf') format('truetype'), url('fonts/NotoSansJP-Regular.svg') format('svg');
     font-weight: normal;
     font-style: normal 
}
 @font-face {
     font-family: 'NotoSansJP-Medium';
     src: url('fonts/NotoSansJP-Medium.otf') format('opentype');
     src: url('fonts/NotoSansJP-Medium.woff') format('woff'), url('fonts/NotoSansJP-Medium.ttf') format('truetype'), url('fonts/NotoSansJP-Medium.svg') format('svg');
     font-weight: normal;
     font-style: normal 
}
 @font-face {
     font-family: 'NotoSansCJKsc-Regular';
     src: url('fonts/NotoSansCJKsc-Regular.otf') format('opentype');
     src: url('fonts/NotoSansCJKsc-Regular.woff') format('woff'), url('fonts/NotoSansCJKsc-Regular.ttf') format('truetype'), url('fonts/NotoSansCJKsc-Regular.svg') format('svg');
     font-weight: normal;
     font-style: normal 
}
 @font-face {
     font-family: 'NotoSansCJKsc-Medium';
     src: url('fonts/NotoSansCJKsc-Medium.otf') format('opentype');
     src: url('fonts/NotoSansCJKsc-Medium.woff') format('woff'), url('fonts/NotoSansCJKsc-Medium.ttf') format('truetype'), url('fonts/NotoSansCJKsc-Medium.svg') format('svg');
     font-weight: normal;
     font-style: normal 
}
 @font-face {
     font-family: "NotoSansJP-Regular";
     src: url('fonts/NotoSansJP-Regular.otf') 
}
 @font-face {
     font-family: "NotoSansJP-Medium";
     src: url('fonts/NotoSansJP-Medium.otf') 
}
 @font-face {
     font-family: "NotoSansCJKsc-Regular";
     src: url('fonts/NotoSansCJKsc-Regular.otf') 
}
 @font-face {
     font-family: "NotoSansCJKsc-Medium";
     src: url('fonts/NotoSansCJKsc-Medium.otf') 
}
 body {
     color: black;
     font-family: 'NotoSansJP-Regular';
     font-size: 18px;
     font-weight: 400;
     line-height: 140%;
     -webkit-font-smoothing: antialiased 
}
 a{
     text-decoration: none;
     color: black;
}
 .button{
     margin: 0px 10px 15px 0px;
     width: 250px;
     float: left;
     border-radius: 10px;
     height: 35px;
     padding-top: 10px;
     background-color: transparent;
     border: 1px solid black;
     font-size: 14px;
     text-align: center;
     background-color: #009cde;
     color: white;
}

 .button:hover{
     background-color: #fff;
     color: #009cde;
}
 .intro{
     padding-bottom: 1em;
}