@charset "utf-8";

/* common */
img {border: 0;}

/* layout */
#wrap {position: fixed; width: 100%; height: 100%; text-align: center;}
#container {position: relative; width: 960px; margin: 0 auto;}
    .container_inner {position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); padding: 40px;}
    .container_inner article img {display: block; margin: 0 auto;}
    .container_inner article h2 {margin-top: 50px; margin-bottom: 30px;}
    .container_inner article p {line-height: 2em;}

    .container_inner .button {width: 100%; padding: 5px 10px; display: inline-block; border-radius: 10px; box-sizing: border-box; background-color: #F6B67B;}
    .container_inner .button a {display: block; white-space: nowrap;}

@media screen and (min-width: 1024px){ /* PC */
    .container_inner .button {margin: 60px 0;}
}

@media screen and (min-width: 768px) and (max-width: 1023px){ /* tablet */    
    .container_inner .button {margin: 10px 0;}
}

@media screen and (min-width: 361px) and (max-width: 767px){ /* Mobile */
    .container_inner article h2 {font-size: 23px;}
    .container_inner article p {line-height: normal; font-size: 16px;}
    
    .container_inner .button {margin: 20px 0 10px 0;}
}

@media screen and (max-width: 360px){
    .container_inner article h2 {font-size: 21px;}
    .container_inner article p {line-height: normal; font-size: 14px;}
    
    .container_inner .button {margin: 20px 0 10px 0;}
}
