/*

Version 1
---------------

*/



/* Setting
------------------------------------------*/

/* Reset */

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    background:transparent;
    font-weight: normal;
}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section { display:block; }
nav ul { list-style:none; }
ul, ol, li { list-style-type: none; }
table { border-collapse:collapse; border-spacing:0; font-size:inherit; font:100%; }
input, select { vertical-align:middle; }
img { vertical-align: bottom; }
a img { border:none; max-width:100%; }
a:focus { outline:none; }
p { margin:0; padding:0; }



/* Basic
------------------------------------------*/

/* トップページ */

body#home {
  font: 16px/1.6 "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",
        "メイリオ", Meiryo, sans-serif;
  -webkit-text-size-adjust: none;
  color: #fff;
  padding: 0;
  margin: 0;

  background:
    linear-gradient(
      rgba(0,0,0,0.20),
      rgba(0,0,0,0.20)
    ),
    url(backgroundimg.jpg) center center no-repeat;
  background-size: cover;
  background-attachment: fixed;
  
  min-height:100vh;
  display:flex;
  flex-direction:column;
}

@media screen and (max-width:960px){

  body#home{
    background-attachment: scroll;
  }

}


/* 規約ページ */

body#page {
  font: 16px/1.6 "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",
        "メイリオ", Meiryo, sans-serif;
  -webkit-text-size-adjust: none;
	background: #fefefe;
  border-top: solid 10px #c00;
  padding: 0;
  margin: 0;
}

@media screen and (max-width:960px){

  body#page{
    
  }

}




/* Top Page
------------------------------------------*/

.homeBox {
  width:800px;
  margin:auto;
  text-align:center;
  box-sizing:border-box;
}

@media screen and (max-width:960px){

  .homeBox {
    width: 100%;
    padding: 40px 25px;
  }

}

/* タイトル */

.homeBox_msg_ttl {
  font-size: 58px;
  line-height: 1.4;
  font-weight: bold;
  color: #fff;
  text-shadow:
    0 0 12px rgba(255,255,255,.25),
    0 4px 12px rgba(0,0,0,.7);
  margin-bottom: 35px;
}

@media screen and (max-width:960px){

  .homeBox_msg_ttl{
    font-size: 36px;
    margin-bottom: 25px;
  }

}

/* 説明文 */

.homeBox_msg_txt {
  text-align: left;
  font-size: 18px;
  line-height: 2;
  color: #fff;
  text-shadow:
    0 2px 8px rgba(0,0,0,.8);
  margin-bottom: 50px;
}

@media screen and (max-width:960px){

  .homeBox_msg_txt{
    font-size: 15px;
    line-height: 1.8;
    margin-bottom: 40px;
  }

}

/* ボタンエリア（共通） */

.homeBox_goForm {
  display: flex;
  justify-content: center;
  gap: 50px;
}

.homeBox_goForm p {
  margin: 0;
}

.homeBox_goForm a {
  position: relative;
  display: block;
  width: 300px;
  padding: 1.4rem 2rem;
  color: #fff;
  text-decoration: none;
  font-weight: bold;
  font-size: 20px;
  letter-spacing: .05em;
  border-radius: 999px;
  background: linear-gradient(
    135deg,
    #00bcd4,
    #0079c2
  );
  box-shadow:
    0 10px 30px rgba(0,0,0,.35);
  transition:
    transform .3s ease,
    box-shadow .3s ease,
    opacity .2s ease;
  overflow: hidden;
}

/* ボタンエリア（PCアクション） */

@media screen and (min-width:961px){

  .homeBox_goForm a::before{
    content: "";
    position: absolute;
    top: 0;
    left: -120%;
    width: 60%;
    height: 100%;
    background: linear-gradient(
      90deg,
      transparent,
      rgba(255,255,255,.6),
      transparent
    );
  }

  .homeBox_goForm a:hover{
    transform: translateY(-4px);
    box-shadow:
      0 15px 35px rgba(0,0,0,.45);
  }

  .homeBox_goForm a:hover::before{
    left: 140%;
    transition: left .6s ease;
  }

}

/* ボタンエリア（SPアクション） */

@media screen and (max-width:960px){

  .homeBox_goForm {
    flex-direction: column;
    align-items: center;
    gap: 30px;
  }

  .homeBox_goForm a {
    box-sizing: border-box;
    font-size: 20px;
  }

  .homeBox_goForm a:active {
    transform: translateY(2px);
    opacity: .9;
  }

}

/* フッター */

.homeCopyright {
  width: 100%;
  text-align: center;
  font-size: 75%;
  color: rgba(255,255,255,.75);
  padding: 20px 0;
  margin-top: auto;
}


/* Terms
------------------------------------------*/

#contents { width: 800px; margin: 0 auto; padding: 30px 0; }
@media screen and (max-width:960px){
	#contents { width: 100%; box-sizing: border-box; padding: 20px; }
}

.terms_ttl { font-size: 30px; font-weight: bold; }
.terms_subttl { font-size: 24px; font-weight: bold; padding-top: 2rem; }

.terms_txt { font-size: 15px; line-height: 2; }
.terms_txt p { margin-bottom: 1rem; }
.terms_txt ol { margin-left: 2rem; }
.terms_txt ol li { list-style: decimal; }
.terms_txt ol ol li { list-style: lower-latin; }
.terms_txt ol ol ol li { list-style: lower-roman; }

.terms_date { padding-top: 30px; }

.ftr_copyright { text-align: center; padding: 30px; font-size: 80%; color: #666; }


