@charset "utf-8";

/* CSS Document */
#pankz_sp {
    margin-top: -40px !important;
}

#main_middle {}

#lpwrap {
    font-size: 16px;
    line-height: 180%;
    background: url(background.jpg);
    background-repeat: repeat-y;
    background-size: contain;
    color: #fff;
}

#main {
    clear: both;
    margin: 46px 0 0 0;
}

#main img {
    width: 100%;
    height: auto;
}

/* concept */

#concept {
    width: 620px;
    margin: -36px auto 80px;
    text-align: center;
}

#concept_txt {
    text-align: left;
}

#concept_txt p {
    margin: 0 0 30px 0;
}

#concept p img {
    width: 180px;
}

#concept h2 {
    margin: 30px 0 60px 0;
    font-size: 28px;
    font-family: serif;
    line-height: 1.8em;
}

/* concept end */


/* coin_all */

#coin_all {
    width: 1100px;
    margin: 0 auto 100px;
    height: 470px;
}

#coin_all ul {
    position: relative;
    list-style: none;
    z-index: 1;
}

#coin_all ul li {
    transition: 0.2s;
}

#coin_all ul li:hover {
    transition: 0.2s;
    transform: translateY(-10px);
}

#c1 {
    position: absolute;
    top: 0;
    right: 120px;
    width: 460px;
    z-index: -18;
}

#c2 {
    position: absolute;
    top: 160px;
    right: 30px;
    width: 300px;
    z-index: -15;
}

#c3 {
    position: absolute;
    top: 184px;
    right: 302px;
    width: 230px;
    z-index: -14;
}

#c4 {
    position: absolute;
    top: 290px;
    right: 332px;
    width: 180px;
}

#c5 {
    position: absolute;
    top: 303px;
    right: 190px;
    width: 160px;
}

#c6 {
    position: absolute;
    top: 393px;
    right: 132px;
    width: 120px;
}

#c7 {
    position: absolute;
    top: 290px;
    right: 26px;
    width: 180px;
}

#c8 {
    position: absolute;
    top: 380px;
    right: 240px;
    width: 140px;
}

#c9 {
    position: absolute;
    top: 380px;
    right: 380px;
    width: 140px;
}

#c10 {
    position: absolute;
    top: 0;
    left: 120px;
    width: 460px;
    z-index: -19;
}

#c11 {
    position: absolute;
    top: 160px;
    left: 44px;
    width: 300px;
    z-index: -17;
}

#c12 {
    position: absolute;
    top: 160px;
    left: 293px;
    width: 300px;
    z-index: -16;
}

#c13 {
    position: absolute;
    top: 290px;
    left: 430px;
    width: 180px;
}

#c14 {
    position: absolute;
    top: 290px;
    left: 125px;
    width: 180px;
    z-index: -11;
}

#c15 {
    position: absolute;
    top: 290px;
    left: 274px;
    width: 180px;
    z-index: -10;
}

#c16 {
    position: absolute;
    top: 290px;
    left: 0px;
    width: 180px;
    z-index: -13;
}

#c17 {
    position: absolute;
    top: 380px;
    left: 440px;
    width: 140px;
    z-index: 0;
}

#c18 {
    position: absolute;
    top: 380px;
    left: 302px;
    width: 140px;
}

#c19 {
    position: absolute;
    top: 380px;
    left: 165px;
    width: 140px;
}

/* coin_all end*/

/* coin_lineup */

#coin_lineup {
    max-width: 920px;
    margin: 0 auto;
}

#coin_lineup ul {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    flex-direction: row;
    width: 100%;
    margin-bottom: 100px;
}

#coin_lineup ul li {
    width: 30%;
    text-align: center;
    margin: 40px 0;
}

#coin_lineup ul li p {
    text-align: justify;
}

#coin_lineup ul li a {
    color: #fff;
}

#coin_lineup ul li a:hover {
    text-decoration: underline;
}

#coin_lineup ul::after {
    content: "";
    display: block;
    width: 30%;
}

#coin_lineup ul li img {
    width: 160px;
    margin: 0 auto;
}

.tag_p {
    display: table;
    text-align: left;
    background: #422f52;
    padding: 0 12px;
    font-size: 12px;
}

.tag_s {
    display: table;
    text-align: left;
    background: #646060;
    padding: 0 12px;
    font-size: 12px;
}

.tag_g {
    display: table;
    text-align: left;
    background: #614f32;
    padding: 0 12px;
    font-size: 12px;
}

.coin_name {
    text-align: left;
}

#coin_lineup h4 {
    text-align: center;
    font-size: 1.8em;
    font-family: serif;
    font-weight: normal;
}

#coin_lineup h4::before {
    content: '';
    display: block;
    margin: 0 0 12px 0;
    width: 100%;
    height: 1px;
    background-color: #fff;
}

#coin_lineup h4::after {
    content: '';
    display: block;
    margin: 12px 0 0 0;
    width: 100%;
    height: 1px;
    background-color: #fff;
}

/* Behind the Design */

#behind_wrap {
    max-width: 920px;
    margin: 0 auto;
}

#behind_tit {
    position: relative;
    width: 100%;
}

#behind_tit h3 {
    width: 920px;
    margin: 0 auto;
    font-family: serif;
    font-weight: normal;
    font-size: 64px;
    color: #7a6645;
    background-color: #121012;
    line-height: 1.2;
    box-sizing: border-box;
    z-index: 1;
}

#behind_tit::before {
    content: '';
    display: block;
    width: 360px;
    height: 1px;
    background-color: #7a6645;
    transform: rotate(-18deg);
    position: absolute;
    top: 194px;
    left: 0;
    overflow: hidden;
}

#behind_tit::after {
    content: '';
    display: block;
    width: 960px;
    height: 1px;
    background-color: #7a6645;
    transform: rotate(-18deg);
    position: absolute;
    top: -130px;
    right: 0;
}

#behind_wrap h4 {
    margin: 0;
    font-size: 30px;
    font-family: serif;
    line-height: 1.6;
    letter-spacing: -1.1px;
}

#behind_wrap h4 span {
    font-size: 18px;
    color: #d6b377;
    letter-spacing: 0.2px;
}

.behind_flex {
    display: flex;
    justify-content: space-between;
    margin: 70px 0;
}

.behind_flex li {
    width: 45%;
}

.behind_flex li p {
    width: 100%;
    margin: 30px 0 0 0;
    text-align: justify;
}

.behind_flex li img {
    width: 100%;
}

#behind_t1 {
    padding: 80px 0 0 0;
}

#behind_p {
    margin: 160px 0;
    text-align: center;
}

#behind_p img {
    width: 600px;
}

#behind_p p {
    width: 600px;
    margin: 50px auto;
    text-align: justify;
}

#behind_t2 {
    padding: 60px 0 0 0;
}

/* lp_under */

#lp_under {
    position: relative;
    width: 100%;
    height: 860px;
    margin: 180px auto -80px;
    background: url(lp_under_bk.jpg) no-repeat;
    background-size: cover;
}

#lp_under p {
    position: absolute;
    top: -160px;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    font-size: 120px;
    line-height: 1;
    font-family: serif;
    text-align: center;
}

#lp_under p span {
    font-size: 50px;
}

#lp_under #coin_all {
    padding: 200px 0 0 0;
}