html {
    background-color: rgb(250, 250, 250);
}

body {
    margin: 10vh 0 0 0;
    padding: 0;
    display: flex;
    justify-content: center; /* 横方向の中央揃え */
    height: 140vh;
}

.header{
    position: absolute;/*fixedで固定*/
    top: 0;
    width: 100%;
    margin: 0;
}

#container {
    max-width: 640px; /* コンテナの最大幅 */
    width: 100%; /* 画面幅に対する100% */
    padding: 0; /* 余白を追加するためのパディング */
    box-sizing: border-box; /* パディングを含めた幅を調整 */
}

.title1 {
    margin: 0 0 5% 0;
    block-size: 100px;
    font-weight: bold;
    font-size: min(12vw, 100px);
    text-align: center;
    color: black;
    font-family: Roboto, Arial;
}

#main {
    width: 100%;
}

.tamap_poster {
    margin: 0 auto;
    width: 100%;
}

.body1 {
    margin: 0 7%;
    font-family: Noto Sans JP, -apple-system, BlinkMacSystemFont, Helvetica Neue, Hiragino Sans, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Yu Gothic, YuGothic, Verdana, Meiryo, "M+ 1p", sans-serif;
    font-weight: 300;
}

.title2 {
    font-size: min(6vw, 60px);
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    font-weight: 100;
}

.title3 {
    font-size: min(6vw, 250%);
    color: rgb(30, 30, 30);
    font-weight: bold;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    font-weight: 600;
    font-family: Arial, Helvetica, sans-serif;
}

p{
    font-size: min(4vw, 18px);
    font-weight: 300;
}

.li1 {
    font-size: min(4vw, 18px);
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    font-weight: 300;
}

.safari{
    width: 5.5%;
    margin-bottom: -1.2%;
    margin-right: 1%;
}

.share1{
    width: 4%;
    margin: 1% 1% 0 1%;
}

.chrome{
    width: 5%;
    margin-bottom: -1%;
}

.share2{
    width: 4%;
    margin: 1% 1% 0 1%;
}

button {
    padding: 5px 20px;
    margin-top: 7%;
    outline: none;
    font-weight: bold;
}
.custom-btn {
    background: rgba(0, 100, 249, 0.651);
    color: white;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(6px);
    border-radius: 50px;
    border: none;
    box-shadow: 0 2px 7px rgba(0,0,0,0.12);
    width: auto;
    height: auto;
    font-weight: 600 !important;
    padding: 10px 20px;
    font-weight: 800;
    font-size: 24px;
    backdrop-filter: blur(20px);
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
    display: inline-block;
    margin-bottom: 60px;
}

  /* 1 */
.btn-1 {
    transition: all 0.3s ease;
    position:fixed;
    right:20px;
    bottom:16px;
}
.btn-1:hover {
    box-shadow:
    -7px -7px 20px 0px #fff9,
    -4px -4px 5px 0px #fff9,
    7px 7px 20px 0px #0002,
    4px 4px 5px 0px #0001;
}

.mar {
    margin: 10vh 0;
}

.btn--orange,
a.btn--orange {
    color: #fff;
    background-color: #eb6100;
}