/* A Modern CSS Reset */
*,*::before,*::after{box-sizing:border-box}ul[class],ol[class]{padding:0}body,h1,h2,h3,h4,p,ul[class],ol[class],figure,blockquote,dl,dd{margin:0}html{scroll-behavior:smooth}body{min-height:100vh;text-rendering:optimizeSpeed;line-height:1.5}ul[class],ol[class]{list-style:none}a:not([class]){text-decoration-skip-ink:auto}img,picture{max-width:100%;display:block}article>*+*{margin-top:1em}input,button,textarea,select{font:inherit}img:not([alt]){filter:blur(10px)}@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}}

body {
    font-family: "Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;
    font-size:16px;
    line-height: 1.6;
    letter-spacing: 0.5px;
    font-feature-settings: "palt" 1;
    color: #3E3E3E;
    background: url(/img/backgroundimg.jpg) top center no-repeat;
    background-size:cover;
    -moz-background-size:cover;
    -webkit-background-size:cover;
    -o-background-size:cover;
    -ms-background-size:cover;
}
main {
    width:572px;
    padding: 56px 80px 40px 80px;
    background-color: #fff;
    border-radius: 4px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
    -webkit- transform: translateY(-50%) translateX(-50%);
}
h1,h2 {
    text-align: center;
}
h1 svg {
    width: 200px;
    height: 46px;
    margin-bottom: 32px;
}
h2 {
    font-size: 24px;
    margin-bottom: 24px;
}
.contents p {
   margin-bottom: 24px; 
}
.contents p:last-child {
    margin-bottom: 32px; 
}
p.link {
    text-align: center;
}
p.link a {
    text-decoration: none;
    text-align: center;
    margin: 0 auto 24px;
}
a:link, a:visited {
    color: #2CA9E1;
}
a.serviceLink {
    width: 299px;
    display: block;
    padding: 10px 0;
    letter-spacing: 2px;
    font-weight: bold;
    background: #FFFFFF;
    border: 2px solid #2CA9E1;
    box-sizing: border-box;
    border-radius: 4px;

    -webkit-transition: background-color .4s, color .4s;
    transition: background-color .4s, color .4s;
}
a.serviceLink:hover {
    color: #FFFFFF;
    background: #2ca9e1;
}
a.serviceLink {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
@media screen and (max-width: 610px) {
    body {
        font-size: 12px;
    }
    main {
        width:80%;
        min-width: 272px;
        margin: 32px auto 0;
        padding: 32px 24px 24px 24px;
        position: relative;
        top:auto;
        left: auto;
        transform: none;
    }
    h1 svg {
        width: 104px;
        height: 24px;
        margin-bottom: 24px;
    }
    h2 {
    font-size: 16px;
    }
    .contents p {
        margin-bottom: 16px; 
    }
    .contents p:last-child {
        margin-bottom: 24px; 
    }
    a.serviceLink {
        width: 80%;
        padding: 10px;
    }
}
