:root{
    --000000:#000000;
    --151b74:#151b74;
    --ffffff:#ffffff;
    --f59c50: #f59c50;
    --FF9046:#FF9046;
    --282828:#282828;
    --ffd733:#22243F;
    --040101:#040101;
    --3975c7: #3975c7;
    --a9a9a9:#a9a9a9;
}
body{
    line-height: 1.4;
    color: var(--282828);
    background-color: var(--a9a9a9);
}
#app{
    background-color: var(--151b74);
    width: 100%;
    max-width: 860px;
    min-height: 100vh;
    margin: 0 auto;
    font-size: .2rem;
}
.page{
    width: 100%;
    position: relative;
    z-index: 2;
}
header{
    z-index: 2;
    overflow: hidden;
}
.banner img{
    width: 100%;
    height: auto;
}
/*  */
.content{
    padding-bottom: .5rem;
    background-color: var(--ffffff);
}
.list_btn{
    display: flex;
    align-items: flex-end;
    justify-content: space-around;
    font-size: 1.2em;
    background-color: var(--151b74);
}
.lt_btn{
    width: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    cursor: pointer;
    filter: brightness(100) contrast(1000);
    position: relative;
}
.lt_btn:nth-child(1){
    padding: 1.5em 0 1.5em 8%;
    margin-right: 3%;
}
.lt_btn:nth-child(2){
    padding: 1.5em 8% 1.5em 0;
    margin-left: 3%;
}
.lt_btn span{
    font-size: 1.2em;
    color: var(--3975c7);
    position: relative;
    padding: 0 .2em;
    text-align: center;
    font-weight: bold;
}
.lt_btn p{
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0 1em;
}
.lt_btn p::before{
    content: '';
    width: 1.6em;
    height: 1.6em;
    background: url(../images/left.png) no-repeat center;
    background-size: contain;
    position: absolute;
    top: 50%;left: -.2em;
    transform: translateY(-40%);
}
.lt_btn p::after{
    content: '';
    width: 1.6em;
    height: 1.6em;
    background: url(../images/right.png) no-repeat center;
    background-size: contain;
    position: absolute;
    top: 50%;right: -.2em;
    transform: translateY(-40%);
}
.lt_btn .asfsd{
    width: 3em;
    height: 100%;
    opacity: 0;
    position: absolute;
    top: 0;
}
.lt_btn:nth-child(1) .asfsd{
    right: -2.9em;
}
.lt_btn:nth-child(2) .asfsd{
    transform: scaleX(-1);
    left: -2.9em;
}
.lt_btn.btn-active{
    filter: none;
    background-color: var(--ffffff);
}
.lt_btn.btn-active .asfsd{
    opacity: 1;
}
.sum{
    width: 100%;
    padding: .5rem 5% 0 5%;
    background-color: var(--ffffff);
}
.list{
    padding: 5% 0;
    font-size: .2rem;
    display: flex;
    justify-content: space-between;
    background-size: contain;
    border-bottom: 2px solid rgba(40, 40, 40, .4);
}
.list:last-child{
    border-color: transparent;
}
.lt_left{
    max-width: 74%;
    width: 78%;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
}
.ranking{
    width: 2em;
    height: 2em;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 0;left: 0;
}
.ranking0 span,
.ranking1 span,
.ranking2 span{
    opacity: 0;
}
.ranking span{
    width: 2em;
    height: 2em;
    color: rgba(40, 40, 40, .4);
    border: 1px solid rgba(40, 40, 40, .4);
    font-weight: 600;
    border-radius: 4px;
    font-size: 16px;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.tag{
    width: 24%;
    min-width: 24%;
    margin-top: 2em;
    height: auto;
    border-radius: 50%;
    position: relative;
}
.tag0,
.tag1,
.tag2{
    box-shadow: 6px -4px 0px var(--f59c50);
}
.ranking0,
.ranking1,
.ranking2{
    width: 2.5em;
    height: 2.5em;
    top: -.5em;
}
.ranking0{
    background: url(../images/01.png) no-repeat center;
    background-size: contain;
    z-index: 3;
}
.ranking1{
    background: url(../images/02.png) no-repeat center;
    background-size: contain;
}
.ranking2{
    background: url(../images/03.png) no-repeat center;
    background-size: contain;
}
.tag img{
    display: block;
    width: 100%;
    height: auto;
    border-radius: 50%;
}
.info{
    width: 76%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    font-size: 1em;
    padding-left: 1.5em;
}
.info .name{
    font-size: 1.3em;
    font-weight: 600;
    color: var(--151b74);
}
.io_des{
    margin: .5em 0 1em 0;
    height: auto;
}

.vote_sum{
    width: 20%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}
.vote_sum .votes p{
    color: rgba(40, 40, 40, .4);
} 
.vote_sum .votes{
    width: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    position: relative;
    flex-direction: column;
    padding-bottom: .5em;
    transition: all .2s linear;
    text-align: center;
}
.number{
    font-weight: 900;
    position: relative;
    transition: all .5s linear;
    font-size: 1.2em;
    position: relative;
}
.votes1 .number{
    color: var(--151b74);
    font-size: 1.4em;
}
.votes2 .number{
    color: var(--282828);
}
.votes2{
    border-top: 1px dashed rgba(40, 40, 40, .4);
    padding-top: .5em;
}
.btn{
    display: flex;
    justify-content: center;
    align-items: center;
    animation: throttle 1s step-end forwards;
	user-select: none;
    color: var(--151b74);
}
.btn img{
    width: 80%;
    height: auto;
    transition: all 0.3s ease; 
}
.btn:hover img{
    transform: rotateX(10deg) scale(0.98); 
    transition: all 0.3s ease; 
}
@keyframes throttle {
	from {
		cursor: default;
		pointer-events: none;
		filter: grayscale(100%);
	}
	to{
		cursor: pointer;
		pointer-events: all;
	}
}

.list0,
.list1,
.list2{
    width: 32%;
    display: flex;
    flex-direction: column;
    align-items: center;
    background: transparent;
}
.list0 .io_des,
.list1 .io_des,
.list2 .io_des{
    text-align: center;
}

.list0,
.list2{
    transform: translateY(10%);
}
.top{
    background: url(../images/line.png) repeat-x bottom;
    background-size: contain;
    display: flex;
    justify-content: center;
    padding-bottom: 5%;
}
.top .ranking{
    display: none;
}
.top .lt_left{
    max-width: 90%;
    width: 90%;
    padding-left: 0;
    flex-direction: column;
}
.top .vote_sum {
    width: 95%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.top .info{
    width: 90%;
    padding-left: 0;
    padding-top: 10%;
}
.top .info .name{
    text-align: center;
}
.top .tag{
    width: 50%;
}
.top .list .tag::before{
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    bottom: -20%;left: 0;
}
.top .list0 .tag::before{
    background: url(../images/02.png) no-repeat bottom center;
    background-size: contain;
    z-index: 3;
}
.top .list1 .tag::before{
    background: url(../images/01.png) no-repeat bottom center;
    background-size: contain;
}
.top .list2 .tag::before{
    background: url(../images/03.png) no-repeat bottom center;
    background-size: contain;
}

.more{
    display: flex;
    justify-content: center;
}
.me-btn{
    margin: 2em 0;
    font-size: 24px;
    padding: .3em 1.5em;
    color: var(--ffffff);
    border: 2px solid var(--ffffff);
    border-radius: 4em;
    cursor: pointer;
}
/*  */
footer{
    background-color: var(--151b74);
    padding: .8rem 0 2.5rem 0;
}
.sns{
    display: flex;
    align-items: center;
    justify-content: center;
}
.sns .sn_li{
    width: .8rem;
    min-width: .9rem;
    height: .9rem;
    border: 2px solid var(--ffffff);
    border-radius: 50%;
    padding: 1em;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    margin: 0 1em;
    cursor: pointer;
}
.sn_li.facebook{
    padding: 26px;
}
.sns .sn_li img{
    width: 100%;
    height: auto;
}
.ft_logo{
    width: 70%;
    height: auto;
    margin: 0 auto;
    padding: 40px 0 0 0;
}
.ft_logo img{
    width: 100%;
    height: auto;
}

@media (max-width: 860px) {
    #app {
        font-size: .3rem;
    }
    .bg img{
        height: 650px;
    }
    .logo {
        width: 80%;
    }
    .logo p {
        font-size: .4rem;
    }
    .hd_tx {
        background-size: 70% auto;
        font-size: .5rem;
        padding-top: 2.5em;
    }
    .top {
        padding-bottom: 8%;
    }
    .tl_p {
        font-size: .3rem;
    }
    .lt_btn:nth-child(1){
        padding: 1em 0 1em 5%;
        margin-right: 3%;
    }
    .lt_btn:nth-child(2){
        padding: 1em 5% 1em 0;
        margin-left: 2%;
    }
    .lt_btn .asfsd{
        width: 1em;
        height: 100%;
        opacity: 0;
        position: absolute;
        top: 0;
    }
    .lt_btn:nth-child(1) .asfsd{
        right: -.9em;
    }
    .lt_btn:nth-child(2) .asfsd{
        transform: scaleX(-1);
        left: -.9em;
    }
    .lt_btn span {
        font-size: .3rem;
    }
    .info {
        width: 70%;
        font-size: .3rem;
    }
    .tag {
        width: 30%;
        min-width: 30%;
    }
    .info .name {
        font-size: .3rem;
    }
    .lt_left {
        width: 70%;
    }
    .vote_sum {
        width: 28%;
    }
    .vote_sum .votes {
        font-size: .28rem;
    }
    .number {
        font-size: .4rem;
    }
    .ranking {
        width: .5rem;
        height: .5rem;
    }
    .ranking span {
        width: .4rem;
        height: .4rem;
        font-size: .3rem;
    }
    .btn{
        font-size: .4rem;
        padding: .1em .5em .1em 0;
    }
    .btn img{
        width: 100%;
        height: auto;
    }
    .me-btn {
        margin: 1.5em 0;
        font-size: .42rem;
    }
    .sns .sn_li {
        width: 1.2rem;
        min-width: 1.2rem;
        height: 1.2rem;
        padding: .3rem;
    }
    .sn_li.facebook {
        padding: .4rem;
    }
    .ft_logo {
        padding: .5rem 0 0 0;
    }
    .tag::before{
        content: '';
        width: 80%;
        height: 80%;
        position: absolute;
        top: -20%;
        left: -40%;
    }
}
/* fixed */
.footgar{
    position: fixed;
    width: 100%;
    max-width: 860px;
    bottom: 0;left: calc(50% - 430px);
    background-color: #151b74;
    z-index: 19;
}
.ftr{
    padding: 1em 5%;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: center;
}
.gar_btn{
    width: 70%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.gar_btn2{
    width: 100%;
}
.gar_btn_a{
    width: 100%;
    font-size: 1em;
    color: var(--ffffff);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .3s linear;
}
.gar_btn span{
    padding-bottom: .2em;
    border-bottom: 2px solid var(--ffffff);
    transition: all .35s linear;
}
.gar_btn_a img{
    width: 100%;
    height: auto;
    transition: all 0.3s ease; 
}
.gar_btn_a:hover span{
    border-color: var(--FF9046);
    color: var(--f59c50);
    transition: all .35s linear;
}
.gar_btn_a:hover img {
    transform: skewX(1deg) translateZ(-2px) scale(0.98); 
    transition: all 0.3s ease; 
}

@media (max-width: 860px){
    .gar_btn_a {
        font-size: 22px;
    }
    footer {
        padding: .8rem 0 3rem 0;
    }
    .gar_btn1{
        width: 80%;
    }
    .footgar{
        left: 0;
    }
}
@media (max-width: 760px){
    .gar_btn_a {
        font-size: 12px;
    }
}
/*  */
.nav{
    position: fixed;
    right: calc(50% - 400px);
    bottom: 20%;
    z-index: 5;
}
.nav_btn{
    width: 1.1rem;
    height: 1.1rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    cursor: pointer;
    padding: 8%;
    overflow: hidden;
    margin-bottom: .2rem;
}
.nav_btn2{
    background-color: var(--ffffff);
    border: 2px solid rgba(21, 27, 116, .4);
}
.nav_btn img{
    width: 45%;
    height: auto;
    margin-bottom: 5%;
}
.nav_btn1{
    padding: 0;
}
.nav_btn2{
    border-radius: 50%;
}
.nav_btn1 img{
    width: 100%;
    height: auto;
    margin: 0;
}
.nav_btn span{
    color: var(--151b74);
    text-align: center;
    font-size: 12px;
    line-height: 1;
    padding: 0 10%;
    display: flex;
}
@media (max-width: 860px){
    .nav{
        right: 5%;
        bottom: 15%;
    }
    .nav_btn {
        width: 60px;
        height: 60px;
        margin-bottom: 10px;
    }
    .nav_btn span {
        font-size: 10px;
    }
    .nav_btn img{
        width: 40%;
    }
    .nav_btn:nth-child(2) img{
        width: 50%;
    }
    .nav_btn1 img {
        width: 100%;
        height: auto;
        margin: 0;
    }
}
/*  */
.activies{
    width: 100%;
    height: 100%;
    max-width: 860px;
    margin: 0 auto;
    background-color: rgba(0, 0, 0, .9);
    position: fixed;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    z-index: 9;
    display: none;
}
.activies .page{
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.padwidth{
    padding: 0 5%;
}
.act_tt{
    max-height: 80%;
    padding: 5%;
    border: 1px solid var(--ffffff);
    background-color: var(--151b74);
    color: var(--ffffff);
    border-radius: 1em;
    position: relative;
    overflow: hidden;
    box-sizing: border-box;
}
.act_text{
    height: auto;
    max-height: 4rem;
    overflow: auto;
}
.act_top{
    width: 80%;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-bottom: 1em;
}
.act_top h3{
    font-size: 22px;
    text-align: center;
    color: var(--FF9046);
}
.act_top p{
    font-size: .25rem;
    padding-top: .5em;
}
.act_tag{
    padding: 1em 1em 1em 0;
    background: url(../images/line.png) repeat-x bottom;
    background-size: contain;
}
.act_tag h4{
    font-size: .25rem;
    color: var(--FF9046);
    padding-bottom: 1em;
    position: relative;
}
.act_tag h4::after{
    content: '';
    width: 5%;
    height: .2em;
    background-color: var(--FF9046);
    position: absolute;
    bottom: .5em;left: 0;
}
.act_tag p{
    font-size: .2rem;
    font-weight: 400;
    padding-bottom: .3em;
}
.act_tag2 p:nth-child(4),
.act_tag2 p:nth-child(5),
.act_tag2 p:nth-child(6){
    font-style: italic;
    color: var(--f59c50);
}
.act_tag2 p:nth-child(4){
    padding-top: .5em;
}
.act_tag2 p:nth-child(6){
    padding-bottom: .5em;
}
.act_tag4 p:nth-child(11),
.act_tag4 p:nth-child(12),
.act_tag4 p:nth-child(13){
    font-style: italic;
    color: var(--f59c50);
}
.act_tag4 p:nth-child(11){
    padding-top: .5em;
}
.act_tag4 p:nth-child(14){
    padding-bottom: .5em;
}
.close{
    position: absolute;
    top: 2%;right: 1%;
    width: 50px;
    height: 50px;
    background: url(../images/icon/close.png) no-repeat center;
    background-size: contain;
    cursor: pointer;
}
@media (max-width: 860px){
    .close {
        position: absolute;
        top: 1%;
        right: 1%;
        width: 40px;
        height: 40px;
    }
    .act_tt h3 {
        font-size: .45rem;
    }
    .act_tt p {
        font-size: .4rem;
    }
}
@media (max-width: 760px){
    .act_text {
        height: 80%;
        max-height: 10rem;
        overflow: auto;
        padding-bottom: 1em;
    }
    .act_tag h4 {
        font-size: .44rem;
    }
    .act_tt p {
        font-size: .32rem;
    }
    .act_tag h4::after{
        width: 10%;
    }
    .act_tt{
        height: 100%;
        max-height: 12rem;
    }
}
/* share */
.shares{
    width: 100%;
    height: 100%;
    max-width: 860px;
    position: fixed;
    top: 0;left: 50%;
    transform: translateX(-50%);
    background-color: rgba(0,0,0,.6);
    z-index: 99;
    display: none;
}
.shares .close{
    filter: grayscale(100%) brightness(0%);
}
.she-cont{
    width: 90%;
    height: auto;
    max-height: 80%;
    position: absolute;
    top: 50%;
    left: 5%;
    transform: translateY(-50%);
    padding: 5%;
    color: var(--282828);
    box-sizing: border-box;
    background-color: var(--ffffff);
    border-radius: 1em;
    overflow: auto;
    border: 1px solid var(--d4a46e);
}
.she-txt{
    padding: 0 1% 0 0;
    height: 100%;
    overflow: auto;
}
.she-title{
    display: flex;
    align-items: center;
    justify-content: center;
    padding-bottom: 2em;
    width: 80%;
    margin: 0 auto;
}
.she-title img{
    width: .4rem;
    height: auto;
    transform: scaleX(-1);
}
.she-title h4{
    font-size: .4rem;
    padding-left: .5em;
    text-align: center;
}
.she-text{
    padding-bottom: 1.5em;
    font-size: .2rem;
    display: flex;
    flex-direction: column;
    font-weight: 300;
    line-height: 1.6;
}
.she-text p:nth-child(1){
    padding-bottom: .4em;
}
.she-text p:nth-child(6){
    padding-top: .4em;
}
.she-text p:nth-child(2),
.she-text p:nth-child(3),
.she-text p:nth-child(4){
    color: var(--f59c50);
    font-style: italic;
}
.she-text1 span{
    display: block;
    color: #ffd733;
}
.she-text1{
    padding-bottom: 2em;
    border-bottom: 1px solid var(--white);
}
.she-icons{
    padding: .3rem .2rem .2rem;
    display: flex;
    align-items: center;
    justify-content: center;
}
.she-icons li{
    width: .6rem;
    height: .6rem;
    min-width: .6rem;
    margin-right: .2rem;
    cursor: pointer;
}
.she-icons li img{
    width: 100%;
    height: auto;
}
.she-icons li:last-child{
    margin-right: 0;
}
@media(max-width: 860px){
    .she-cont{
        width: 90%;
        left: 5%;
        max-height: 90%;
        border-radius: .3rem;
    }
    .she-title h4 {
        font-size: .5rem;
    }
    .she-title img {
        width: .5rem;
    }
    .she-title {
        padding-bottom: .5rem;
    }
    .she-text {
        padding-bottom: 1.2em;
        font-size: .4rem;
    }
    .she-text1 {
        padding-bottom: 2em;
    }
    .she-icons li {
        width: 1rem;
        height: 1rem;
        min-width: 1rem;
        margin-right: .3rem;
        cursor: pointer;
    }
    .she-icons {
        padding: .5rem .25rem .3rem;
    }

}
/* share */
.join{
    width: 100%;
    height: 100vh;
    max-width: 860px;
    position: fixed;
    top: 0;left: 50%;
    transform: translateX(-50%);
    background-color: rgba(0,0,0,.6);
    z-index: 99;
    overflow: hidden;
    display: none;
}
.join .close{
    border: 1px solid var(--a9a9a9);
    background-color: var(--a9a9a9);
    top: 0;
    right: 0;
    z-index: 3;
}
.join .close img{
    width: 100%;
    height: auto;
}
.jn-cont{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    color: var(--282828);
    box-sizing: border-box;
    background-color: var(--ffffff);
}
#joiniframe{
    width: 100%;
    height: 100%;
}
/*  */
.infomation{
    width: 100%;
    height: 100%;
    max-width: 860px;
    position: fixed;
    top: 0;left: 50%;
    transform: translateX(-50%);
    background-color: rgba(0,0,0,.6);
    z-index: 99;
    display: none;
}

.mation{
    width: 100%;
    height: auto;
    max-height: 80%;
    max-width: 700px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    padding: 5%;
    color: var(--ffffff);
    box-sizing: border-box;
    background-color: var(--151b74);
    border-radius: 1em;
    overflow: auto;
    border: 1px solid var(--ffffff);
    display: flex;
    flex-direction: column;
    align-items: center;
}
.mo_top{
    display: flex;
}
.mo_left{
    width: 30%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
.mo_votes{
    padding-top: 1em;
}
.mo_votes p{
    color: rgba(255, 255, 255, .4);
}
.mo_info{
    width: 70%;
    padding-left: .25rem;
}
.mo_tag img{
    width: 100%;
    height: auto;
    border-radius: 50%;
}
.mo_name{
    font-weight: 600;
    font-size: .22rem;
    padding-bottom: .5em;
}
.mo_des{
    font-size: .2rem;
    max-height: 4rem;
    overflow: auto;
}
.mo_des p{
    margin-right: .2em;
}
.mo_btn{
    margin-top: .2rem;
    display: flex;
}
.mo_btn{
    width: 50%;
}
.mo_btn img{
    width: 100%;
    height: auto;
    margin-right: .3em;
    cursor: pointer;
}
@media(max-width: 860px){
    .mation {
        width: 90%;
        left: 5%;
        transform: translate(0%, -50%);
    }
    .mo_name {
        font-size: .4rem;
        padding-bottom: .4em;
    }
    .mo_des {
        max-height: 6rem;
        font-size: .3rem;
    }
    .mo_votes{
        padding-top: .4rem;
    }
    .mo_btn{
        width: 60%;
    }
}
/*  */
.box{
    width: 100%;
    height: 100%;
    max-width: 860px;
    position: fixed;
    top: 0;left: 50%;
    transform: translateX(-50%);
    background-color: rgba(0,0,0,.8);
    color: var(--ffffff);
    z-index: 99;
    display: none;
}
.bx_dddd {
    transition: all 0.3s linear;
    opacity: 1;
    visibility: visible;
    user-select: none;
    cursor: pointer;
}

.bx_dddd.bx_hidden {
    opacity: 0;
    height: 0;
    visibility: hidden;
}
.bx_up{
    padding: 0 5%;
    transition: all .3s linear;
}
.up_tt{
    padding-top: 3%;
    font-size: 3rem;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    transition: all .3s linear;
}
.tt_p{
    padding: 0 5%;
    width: 50%;
    font-size: .2rem;
    display: flex;
    transition: opactity .3s linear;
}
.tt_1{
    opacity: 0;
}
.tt_1 p{
    color: var(--f59c50);
    font-weight: 600;
    text-align: center;
}
.bx_up h4{
    font-size: .3rem;
    color: var(--f59c50);
    padding: 1em 0;
}
.tt_1{
    display: flex;
    justify-content: center;
    align-items: center;
}
.tt_2{
    display: flex;
    justify-content: flex-end;
    align-items: center;
    filter: brightness(0.5);
}
.tt_p img{
    width: 40px;
    height: auto;
}
.tt_2 img{
    width: 24px;
    height: auto;
    padding-left: .5em;
}
.addclick{
    cursor: pointer;
    display: flex;
    align-items: center;
}
.down_list li{
    list-style: disc;
    font-size: .25rem;
    font-weight: 700;
    margin-bottom: 1em;
    margin-left: .8em;
}
.down_list li span{
    list-style: disc;
    font-size: .2rem;
    font-weight: 400;
    color: var(--a9a9a9);
}
.down_tt{
    position: relative;
    padding-bottom: .5rem;
}
.arrow_up{
    position: absolute;
    bottom: 0;left: 50%;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
}
.arrow_up img{
    width: 50px;
    height: auto;
}
.arrow_up span{
    font-size: .25rem;
    color: #F59C50;
    font-weight: 900;
}
.bx_down{
    padding-top: 1em;
    transition: all .3s linear;
}
.bx_down iframe{
    width: 100%;
    height: 100%;
}
@media(max-width: 860px){
    .tt_p {
        font-size: .3rem;
    }
    .tt_p img {
        width: .5rem;
        height: auto;
    }
    .bx_up h4 {
        font-size: .4rem;
    }
    .down_list li {
        font-size: .32rem;
        margin-bottom: .8em;
    }
    .down_list li span {
        font-size: .3rem;
    }
    .arrow_up img{
        width: .6rem;
        height: auto;
    }
    .arrow_up span{
        font-size: .3rem;
    }
    .tt_p {
        padding: 0;
    }
    .tt_2 {
        padding: .5em 0;
    }
}