@charset "UTF-8";

@import url(https://fonts.googleapis.com/earlyaccess/cwtexfangsong.css);

body {
    font-family: ‘cwTeXFangSong’,'Segoe UI',SegoeUI,'Microsoft JhengHei',微軟正黑體,"Helvetica Neue",Helvetica,Arial serif;
}

#header h1 {
    margin: 17% auto 19.5%;
    margin: 18.5% auto 24.8%;
}

#topMovie .topMovieTitle {
    width: 53%;
    max-width: 440px;
}
.kv-badge-1st .badge1stBgimg {
    left: 50%;
}

/* footer */
.pc .ftApptxtInner .ftApptxtdetail li {
    margin-bottom: 0%;
}
.ftApptxtdetail ul {
    margin-bottom:1%;
}
li.ftApptxtDLbt {
    margin-top: 1%;
}
li.ftApptxtDLbt a.ftApptxtdetailAnd {
    margin-right: 2%;
}
li.ftApptxtDLbt span.ftApptxtdetailclass {
    width: 11%;
    display: inline-block;
}
.ftApptxtdetail .kome {
    font-size: 55%;
}

@media screen and (max-width: 414px) {
.ftApptxtInner .ftApptxtdetail {
    font-size: 2.4rem;
}
}

/* pre */
.topPreStepText {
    font-size: 24px;
    padding: 0 3.8% 2%;
    text-align: left;
    background: url(../image/top_prereg_step_inner.png)top center repeat-y;
    background-size: 100%;
}
.topPreStepbox .fbBtn {
    padding: 2%;
}

.topPreStepbox{
    position:relative;
    width:77%;
    max-width:754px;
    margin:6% auto;
}

.topPreStepbox::before {
    position: absolute;
    content: "";
    display: block;
    top: 0;
    right: 0;
    left: 0;
    padding: 2% 0;
    margin-top: -4%;
    width: 100%;
    background: url(../image/top_prereg_step_top.png) bottom center no-repeat;
    background-size: 100%;
    z-index: 1;
}

.topPreStepbox::after {
    position: absolute;
    content: "";
    display: block;
    bottom: 0;
    right: 0;
    left: 0;
    padding: 2% 0;
    margin-bottom: -4%;
    width: 100%;
    height: auto;
    background: url(../image/top_prereg_step_bottom.png) top center no-repeat;
    background-size: 100%;
    z-index: 1;
}

@media screen and (max-width:980px) {
#topSns ul.snslist {
    width:8%;
    margin-left: 1%;
    text-align:center;
    max-width: 54px;
}
#topSns ul.snslist li {
    width:90%;
}
    .topPreStepbox {
        width:77%;

    }
    .topPreStepText{
        font-size: 2.4rem;  
    }
}

@media screen and (max-width:640px) {
    .topPreStepbox {
        width:100%;

    }
    .topPreStepText{
        font-size: 3rem;
    }
    .topPreStepbox .fbBtn {
        padding: 3%;
    }

}

@media screen and (max-width:320px) {
    .topPreStepText{
        font-size: 3rem;
    }
    .topPreStepbox .fbBtn {
        padding: 1%;
    }
}

.ulTopPreLink,
.ulTopPreLink.ulTopPreLinkft  {
    width:80%;
    margin: 0;
    margin: 0 auto;
}

.ulTopPreLink li,
.sp .ulTopPreLink li,
.sp .ulTopPreLink.ulTopPreLinkft li {
    width:75%;
}
.sp .ulTopPreLink li img {max-width:326px;height:auto;}

#topPreLink .preAttlink {
    width: 42%;
    max-width: 410px;
}
/*
.ulTopPreLink li:first-child {
    margin-right:2%;
}*/


    #topGsystem01.topGsystemDetailbox .topSystemTitle {
        bottom: 22%;
        width: 87%;
        max-width: 786px;
    }
    #topGsystem02.topGsystemDetailbox .topSystemTitle {
        bottom: 19%;
        width: 89%;
        max-width: 808px;
    }
    #topGsystem03.topGsystemDetailbox .topSystemTitle {
        bottom: 22%;
        width: 83%;
        max-width: 808px;
    }
    #topGsystem04.topGsystemDetailbox .topSystemTitle {
        bottom: 26%;
        width: 82%;
        max-width: 808px;
    }

    @media screen and (max-width:980px) {
    #topGsystem01.topGsystemDetailbox .topSystemTitle {
        top: 58%;
        right: -7%;
    }
    #topGsystem02.topGsystemDetailbox .topSystemTitle {
        top: 64%;
        right: -8.5%;
        width: 95%;
    }
    #topGsystem03.topGsystemDetailbox .topSystemTitle {
        top: 64%;
        right: -09.0%;
        width: 92%;
    }
    #topGsystem04.topGsystemDetailbox .topSystemTitle {
        top: 51%;
        right: -9.0%;
        width: 91%;
    }
    }

.fb-page {
    text-align:center;
    width:100vw;
}

/*.fb_iframe_widget,
.fb_iframe_widget span,
.fb_iframe_widget iframe[style]{
    width: 100% !important;
}*/
	.fb-container {
		max-width: 390px;
        margin: 0 auto;
	}
	.sp .fb-container {
		max-width: 500px;
	}

.fb-like,.fb-like span,.fb-like iframe{
 width:100% !important;
}
/* cbtReport ------------------------------------------ */
#secPage.cbtrpPage #header h1 {
    max-width: 660px;
}
.cbtrpPage .valueBox.valueBox03 dt {
    margin-bottom:2%;
}

/* special ------------------------------------------ */

#secPage.specialPage #contBox01 p {
    padding-top: 3%;
}

#secPage.specialPage #contBox01 {
    margin-top: 0;
}