@import url(https://fonts.googleapis.com/earlyaccess/notosansjp.css);
@import url(https://fonts.googleapis.com/css?family=Modern+Antiqua);
/* reset */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td {
    margin: 0;
    padding: 0;
}
address, caption, cite, code, dfn, em, strong, th, var {
    font-style: normal;
}
ul {
    list-style: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
caption, th {
    text-align: left;
}
q:before, q:after {
    content: '';
}
object, embed {
    vertical-align: top;
}
legend {
    display: none;
}
h1, h2, h3, h4, h5, h6 {
    font-size: 100%;
}
img, abbr, acronym, fieldset {
    border: 0;
}
body {
    font: 14px/1.9 -apple-system, BlinkMacSystemFont, Verdana, "ヒラギノ丸ゴ Pro W4", "ヒラギノ丸ゴ Pro", "Hiragino Maru Gothic Pro", "游ゴシック Medium", Yu Gothic Medium, "游ゴシック体", YuGothic, "ヒラギノ角ゴ ProN", Hiragino Kaku Gothic ProN, "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", sans-serif;
    font-weight: 300;
    -webkit-text-size-adjust: 100%;
    overflow-x: hidden;
    color: #565656;
    background: #FD74B2;
}
a {
    color: #0066ff;
    text-decoration: none;
}
a:hover, .active {
    text-decoration: underline;
}
a:active, a:focus, input:active, input:focus {
    outline: 0;
}
/* ヘッダー
------------------------------------------------------------*/
#mainnav a {
    color: #000;
}
/* フッター
------------------------------------------------------------*/
#footer {
    clear: both;
    padding: 20px 10px;
    text-align: center;
    font-size: 12px;
    background: #fff;
}
#top #footer {
    padding: 20px 10px 150px;
}
/* 共通
------------------------------------------------------------*/
h1, h2 {
    font-family: 'Comic Sans MS', 'Noto Sans JP', serif;
}
img {
    max-width: 100%;
    height: auto;
     vertical-align: bottom;
}

section {
    clear: both;
}
section h2 {
    width: 80%;
    margin: 70px auto;
    font-size: 20px;
    font-weight: normal;
    text-align: center;
}
section h2 span {
    padding-bottom: 20px;
    border-bottom: 3px solid #000;
}
#sec02 .inner, #tokusho .inner, #rule .inner, #privacypolicy .inner {
    border-bottom: 1px solid #a0a0a0;
}

#content {
    background-color: #fff;
}
/* 共通
------------------------------------------------------------*/
.inner p {
    /* [disabled]width: 80%; */
    margin: 0 auto;
    /* [disabled]padding-bottom: 80px;
*/
}
.inner {
    width: 80%;
    margin-top: 20px;
    margin-right: auto;
    margin-left: auto;
    padding-bottom: 50px;
}
.inner dt {
    padding: 3px 10px;
    margin-bottom: 10px;
    background-color: #eee;
    /* [disabled]color: #B4B4B4;
*/
}
.inner dl {
    /* [disabled]margin: 0 20px;
*/
}
.inner dd {
    padding: 0 20px;
    margin-bottom: 15px;
}
.lpagree{
  margin-top: 3px;
  line-height: 1.2;
  color: #fff;
}
#tokusho img {
  max-width: 300px;
}

/* agecheckBox */
#agecheck dd em {
  margin-left: -0.5em;
  font-weight: bold;
  font-style: normal;
}
#agecheck aside {
  background-color: #eee;
  padding: 1.5em;
  font-size: 0.8em;
  text-align: left;
}
.certificate {
  padding-left: 1.5em;
  margin-bottom: 2em;
}
.certificate li {
  margin: 0.3em 0;
  list-style: none;
  text-indent: -1.7em;
  line-height: 1.1;
}
.certificate:nth-of-type(2) li { text-indent: -1.2em; }

.certificate i {
  font-style: normal;
}

.samplelist {
  padding: 0 !important;
  margin: 1em 0;
  text-align: center;
  list-style: none;
}
.samplelist li {
  list-style: none;
  padding: 0.5em 0;
  margin: 0.5em 0;
  line-height: 1.1;
}
.samplelist li p {
  padding: 0.5em 0;
  margin: 0;
  text-align: center;
  font-size: 0.8em;
  color: #fff;
  background-color: #999;
  border-radius: 0.4em;
}
.samplelist li img {
  width: 96%;
  max-width: 400px;
  margin: 0.5em 0.1em;
}
.samplelist .ex {
  background-color: #eee;
  padding: 1.5em;
}
.samplelist .ex span {
  display: inline-block;
  font-size: 0.9em;
  text-align: left;
}


/* LINEBNR
------------------------------------------------------------*/
.area_linebnr_top {
    background: #dcdedc;
    width: 100%;
    padding: 0.5em;
    display: flex;
    align-items: center;
}
.area_linebnr_top .icon {
    width: 10%;
    max-width: 100px;
    padding-left: 15%;
}
.area_linebnr_top .text {
    width: 52%;
    padding: 0 2%;
}
.area_linebnr_top .text span {
    display: block;
    color: #6e6b6b;
    font-size: 0.8em;
    line-height: 1.3;
}
.area_linebnr_top .text span.star em {
    color: #ffba00;
}
.area_linebnr_top .text span.name {
    font-weight: bold;
    font-size: 1em;
}
.btn {
  display: flex;
    padding-right: 15%;
}
.area_linebnr_btn img {
  margin-bottom: 3px;
}
.area_linebnr_btn a {
  display: inline-block;
}
.area_linebnr_top a:hover, .area_linebnr_btn a:hover, .area_linebnr_top a:focus, .area_linebnr_btn a:focus {
    filter: alpha(opacity=80);
    -moz-opacity: 0.80;
    opacity: 0.80;
}
/* =Table
----------------------------------------------- */
.tableStyle {
  width: 100%;
  margin-bottom: 1em;
  border-collapse: collapse;
}
.tableStyle thead th {
  background: #aaa;
  color: #fff;
  border: 1px solid #999;
}
.tableStyle td,
.tableStyle th {
  display: table-cell;
  width: auto;
  padding: 0.5em;
  border: 1px solid #ddd;
}

/* =List
----------------------------------------------- */
.list_marker {
  padding-left: 1.5em;
  list-style-type: disc;
}
.list_number {
  padding-left: 1.5em;
  list-style-type: decimal;
}
.list_marker > li { list-style: disc; }
.list_number > li { list-style: decimal; }

.parenthesized-decimal {
  counter-reset: cnt;
  list-style-type: none !important;
}

.parenthesized-decimal li:before {
  margin-left: -1.5em;
  counter-increment: cnt;
  content: "("counter(cnt) ") ";
}
ul.none, ul.none li,
ol.none, ol.none li {
  list-style-type: none;
}
.none li {
  padding-left: 1.5em;
  text-indent: -1.5em;
}

/* SEC01
------------------------------------------------------------*/
/* SEC02 
------------------------------------------------------------*/
#sec02 {
    padding-top: 20px;
    background-color: #FD53A2;
}
/* tokusho 
------------------------------------------------------------*/
/* rule PROJECT
------------------------------------------------------------*/
#rule {
    padding-bottom: 0 !important;
}
/* privacypolicy COMPANY
------------------------------------------------------------*/
#privacypolicy p {
    margin-bottom: 5px;
}

/* loginBtn
------------------------------------------------------------*/
.loginBtn { font-size: 10px; }
@media (min-width: 320px) {
  /* 文字の最小値+((1vw-最小値を適用したい横幅の1%)*(文字サイズの最大値と最小値の差/(最大値を適用したい横幅の1% - 最小値を適用したい横幅の1%))) */
  .loginBtn { font-size: calc(10px + ((1vw - 3.2px)*(20/(10 - 3.2)))); }
}
@media (min-width: 1000px) {
  .loginBtn { font-size: 30px; }
}

.loginBtn {
  padding-bottom: 3vw;
  text-align: center;
  background-color: #ff53a3;
}
.loginBtn a {
  display: block;
  width: 100%;
  width: 90%;
  height: 100%;
  margin: 0 auto;
  color: #fff;
  background-color: #ff53a3;
  border: 1px solid #fff;
  border-radius: 10em;
  text-decoration: none;
}
.loginBtn a:hover {
  color: #ff53a3;
  background-color: #fff;
  border: 1px solid #ff53a3;
}

/* RESPONSIVE 設定
------------------------------------------------------------*/
@media only screen and (min-width: 800px) {
    body {
        font-size: 14px;
    }
    #wrapper {
        width: 100%;
        min-height: 100vh;
        position: relative;
    }
    #content {
        /*width: 80%;*/
        margin: 0 auto;
        background-color: #fff;
        max-width: 990px;
    }
    #sidebar {
        width: 100%;
        position: fixed;
        bottom: 0;
        background: rgba(255, 255, 255, 0.8);
    }
    .area_linebnr_btn {
        text-align: center;
        padding: 10px;
        background-color: rgba(0, 0, 0, 0.5);
    }
    a#menu {
        display: none;
    }
    .panel {
        display: block !important;
    }
    #sidebar h1 {
        padding: 30px 0;
    }
    #mainnav ul {
        width: 100%;
        max-width: 990px;
        margin: 0 auto;
        display: block;
        padding: 0 10px;
    }
    #mainnav li {
        float: left;
        width: 20%;
        font-size: 14px;
        text-align: center;
        padding: 10px;
        box-sizing: border-box; 
    }
    #top #footer {
        padding: 20px 10px 180px 0;
    }
}
@media only screen and (min-width: 641px) {}
@media only screen and (max-width: 640px) {
    #gallery li {
        float: none;
        width: 100%;
    }
}
@media only screen and (max-width: 799px) {
    #content {
        padding-top: 13%;
    }
    .area_linebnr_btn {
        text-align: center;
        padding: 10px;
        background-color: rgba(0, 0, 0, 0.5);
        position: fixed;
        bottom: 0;
        z-index: 100;
    }
    .area_linebnr_top {
        position: fixed;
        background: none;
        z-index: 100;
        background: #fff;
    }
    .area_linebnr_top .icon {
    padding-left: 3%;
    }
    .area_linebnr_top a {
        padding: 0;
    }
    .area_linebnr_top .btn {
        display: none;
    }
    .area_linebnr_btn img {
        width: 95%;
    }
    #sidebar {
        position: fixed;
        width: 100%;
        top: 0;
        z-index: 1000;
    }
    #sidebarWrap {
        position: relative;
        width: 100%;
        height: 60px;
    }
    #sidebar h1 {
        text-align: center;
        padding-top: 15px;
    }
    #sidebar h1 img {
        width: auto !important;
        max-height: 25px;
    }
    a#menu {
        display: inline-block;
        position: relative;
        width: 40px;
        height: 40px;
        margin: 10px;
    }
    #menuBtn {
        display: block;
        position: absolute;
        top: 50%;
        left: 50%;
        width: 18px;
        height: 2px;
        margin: -1px 0 0 -7px;
        background: #000;
        transition: .2s;
    }
    #menuBtn:before, #menuBtn:after {
        display: block;
        content: "";
        position: absolute;
        top: 50%;
        left: 0;
        width: 18px;
        height: 2px;
        background: #000;
        transition: .3s;
    }
    #menuBtn:before {
        margin-top: -7px;
    }
    #menuBtn:after {
        margin-top: 5px;
    }
    a#menu .close {
        background: transparent;
    }
    a#menu .close:before, a#menu .close:after {
        margin-top: 0;
    }
    a#menu .close:before {
        transform: rotate(-45deg);
        -webkit-transform: rotate(-45deg);
    }
    a#menu .close:after {
        transform: rotate(-135deg);
        -webkit-transform: rotate(-135deg);
    }
    .panel {
        width: 100%;
        display: none;
        overflow: hidden;
        position: relative;
        left: 0;
        top: -10px;
        z-index: 100;
    }
    #mainnav {
        position: absolute;
        top: 0;
        width: 100%;
        text-align: right;
    }
    #mainnav ul {
        border-bottom: 1px solid #ccc;
        background: #fff;
        text-align: left;
    }
    #mainnav li a {
        position: relative;
        display: block;
        padding: 15px 25px;
        border-bottom: 1px solid #ccc;
        color: #000;
        font-weight: 400;
    }
    #mainnav li a:before {
        display: block;
        content: "";
        position: absolute;
        top: 50%;
        left: 5px;
        width: 6px;
        height: 6px;
        margin: -4px 0 0 0;
        border-top: solid 2px #000;
        border-right: solid 2px #000;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
    }
    section h2 {
        margin: 55px auto;
    }
    #sec02 .inner {
        width: 98%;
    }
}
@media only screen and (max-width: 500px) {
    #content {
        padding-top: 66px;
    }
  }



/* =form Style
----------------------------------------------- */
.regist form {
  margin: 1em 0;
  text-align: center;
}
.regist input,
.regist select,
.regist textarea {
  font-size: 100%;
  line-height: 2;
}
.regist input[type=text],
.regist input[type=password] {
  width: 100%;
  padding: 0 0.5em;
  border: 1px solid #ccc;
  box-sizing: border-box;
}
.regist .btn,
.regist button,
.regist input[type="button"],
.regist input[type="reset"],
.regist input[type="submit"] {
  display: block;
  width: 65%;
  padding: 20px 0;
  margin: 0 auto;
  text-align: center;
  font-size: 0.9em;
  line-height: 1;
  border: none;
  color: #fff;
  background: #454545;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius: 8px;
  cursor: pointer;
}
.regist .prev,
.regist input[type="reset"] {
  display: block;
  width: 25%;
  padding: 15px 0;
  font-size: 0.8em;
  background: #999;
  border: none;
}
.regist button:hover,
.regist input[type="button"]:hover,
.regist input[type="reset"]:hover,
.regist input[type="submit"]:hover {
  filter: alpha(opacity=70);
  -moz-opacity:0.70;
  opacity:0.70;
}

.regist .rowBtn {
  display: flex;
  justify-content: center;
  align-items: flex-end; 
}

@media screen and (min-width: 1001px) {
  .regist form ul {
    display: table;
    border-collapse: separate;
    border-spacing: 10px;
    width: 100%;
  }
  .regist form li {
    display: table-row;
  }
  .regist form li label {
    display: table-cell;
    width: 30%;
  }
  .regist form li p {
    display: table-cell;
    width: 70%;
  }
  .regist .rowBtn {
    width: 80%;
    margin: 0 auto;
  }
}


/* =regist Style
----------------------------------------------- */
.noTop #content {
  padding-top: 0;
}
#container .regist .inner {
  margin-top: 8vw;
  margin-bottom: 10vw;
}
.regist h1 {
  padding: 0.2em 0;
  margin: 1.5em;
  text-align: center;
  font-size: 1.2em;
  color: #fff;
  background-color: #fd53a2;
}
.regist ul {
  text-align: center;
}
.regist li p {
  margin-bottom: 1em;
}
.regist li p span {
  display: block;
  padding: 0.4em;
  background-color: #eee;
}
.regist .lead {
  margin: 1em 0;
}
.regist .lead b {
  display: block;
  font-weight: bold;
  text-align: center;
  color: #fd53a2;
}
.regist .msg {
  margin: 2em 3vw;
  text-align: center;
  color: #ff2294;
}
.regist .note {
  margin: 0.5em 0;
  text-align: center;
  font-size: 0.9em;
  line-height: 1.1;
}
.regist .note span {
  color: #ff2294;
}

@media screen and (min-width: 1001px) {
  .regist p.lead {
    text-align: center;
  }
}


/* boxArea */
.boxArea {
  padding: 1.5em 1em;
  margin: 2em 0 1em;
  text-align: center;
  background-color: #eee;
}
.boxArea .lead {
  line-height: 1.4;
}
.boxArea img {
  margin: 5px auto;
}
.boxArea span {
  display: block;
  font-size: 0.9em;
}
.boxArea a:hover {
  filter: alpha(opacity=70);
  -moz-opacity:0.70;
  opacity:0.70;
}


/* linkBtn */
.linkBtn {
  display: block;
  width: 95%;
  padding: 0.5em 0;
  margin: 0 auto;
  font-size: 1.3em;
  text-align: center;
  color: #fff;
  background-color: #25dd29;
  -webkit-border-radius: 10em;
  -moz-border-radius: 10em;
  border-radius: 10em;
  text-decoration: none;
  /*
  -webkit-box-shadow: 0 -0.1em 0 0 #41783b inset;
  -moz-box-shadow: 0 -0.1em 0 0 #41783b inset;
  box-shadow: 0 -0.1em 0 0 #41783b inset;
  text-shadow: 1px 1px 1px rgba(0,0,0,0.3);
  */
}
.linkBtn:hover {
  text-decoration: none;
  filter: alpha(opacity=70);
  -moz-opacity:0.70;
  opacity:0.70;
}