@charset "utf-8";

@media screen and (max-width:940px) {
    
    #content {
        width: 100%;
    }
    #content > .inner {
        padding: 10px;
    }

    .section {
        max-width: 100%;
        margin-bottom: 20px;
        border-width: 2px;
        padding-top: 10px;
        padding-bottom: 10px;
    }
    .section h3 {
        text-indent: 10px;
        font-size: 18px;
        font-weight: normal;
    }
    .section .content {
        padding: 5px 10px;
        line-height: 160%;
    }

    #timeline-news {
        margin-right: 260px;
        width: auto;
        float: none;
    }

    #timeline-twitter {
        float: none;
        position: absolute;
        right: 0;
        top: 35px;
    }

    #access #map {
        position: relative;
        right: auto;
        top: auto;
        text-align: left;
    }
    #access #map .print-btn {
        float: none;
        margin-bottom: 20px;
    }

    #banners ul {
        width: 100%;
        overflow: hidden;
        margin: 0 auto;
    }
    #banners ul li {
        width: 32%;
        height: auto;
        padding: 0;
        margin-left: 1%;
        margin-bottom: 3px;
    }
    #banners ul li:nth-child(4n+1) {
        margin-left: 1%;
    }

}


@media screen and (max-width:860px) {

    #point p.lead {
        font-size: 20px;
    }

    #point .points .p-box p {
        font-weight: bold;
        font-size: 14px;
    }

}


/* ~480px */
@media screen and (max-width:700px) {
    
    .sponly {
        display: block;
    }
    img {
         max-width: 100%;
         height: auto;
    }

    #header .inner {
        max-width: 100%;
    }
    #header h1.brand {
        width: 50%;
    }
    #header .twitter-follow-button {
        display: none;
    }


    #breadcrumbs p {
        font-size: 12px;
        line-height: 250%;
        text-indent: 10px;
    }

    #top {
        padding-bottom: 15px;
        border-bottom: 3px solid #ec552a;
        background: none;
        padding-top: 0;
    }
    #top .inner {
        width: 100%;
    }
    #top .signup {
        margin: 0 10px;
    }
    #top .lineup,
    #top .notice {
        display: none;
    }

    #point.section {
        border: 0;
        margin-bottom: 0;
        padding-bottom: 0;
    }
    #point h3 {
        width: 70%;
        margin: 0 auto;
    }
    #point p.lead {
        font-size: 16px;
        margin-bottom: 15px;
    }
    #point p.lead span {
        display: block;
        text-align: center;
        line-height: 160%;
    }
    #point p.lead .price {
        padding-left: 0;
    }
    #point .points .p-box {
        width: 100%;
        float: none;
        border: 1px solid #ec552a;
        margin-bottom: 10px;
    }
    #point .points .p-box:last-child {
      border-right: 1px solid #ec552a;
    }
    #point .points .p-box .inner {
        padding: 0;
    }
    #point .points .p-box:first-child .inner {
      padding-left: 0;
    }
    #point .points .p-box:last-child .inner {
      padding-right: 0;
    }
    #point .points .p-box h4 {
        background: #ec552a url(../img/check.png) 8px center no-repeat;
        padding-left: 38px;
        text-indent: 0;
        width: auto;
        height: auto;
        color: #fff;
        font-size: 16px;
        line-height: 240%;
    }
    #point .points .p-box p {
        padding-top: 110px;
        padding-bottom: 15px;
        height: auto;
        text-align: center;
        background: no-repeat center 10px;
        font-weight: normal;
    }
    #point .points .p-box1 p {
      background-image: url(../img/point_1_sp.png);
    }
    #point .points .p-box2 p {
      background-image: url(../img/point_2_sp.png);
    }
    #point .points .p-box3 p {
      background-image: url(../img/point_3_sp.png);
    }

    #timelines {
        display: none;
    }
    
    #more-menu .device,
    #more-menu .twitter-link {
        display: block;
    }

    .backtop p {
        text-align: right;
        padding: 10px;
        padding-bottom: 0;
    }

    #banners ul {
        width: 100%;
        overflow: hidden;
        margin: 0 auto;
    }
    #banners ul li {
        width: 47%;
        height: auto;
        padding: 0;
        margin-left: 0;
        margin-bottom: 3px;
    }
    #banners ul li:nth-child(even) {
        float: left;
        margin-left: 2%;
    }
    #banners ul li:nth-child(odd) {
        float: right;
        margin-right: 2%;
    }

    #summary table {
        width: 100%;
        height: auto;
        border-spacing: 0 7px;
    }
    #summary th,
    #summary td {
        font-size: 12px;
    }
    #summary th {
        width: 80px;
        height: auto;
    }
    #summary td {
        padding-left: 10px;
    }

    #access p {
        font-size: 12px;
    }
    #access #map .print-btn {
        display: none;
    }

    #footer {
        height: auto;
    }
    #footer .footer-inner {
        padding: 10px;
    }
    #footer .footer-inner a {
        width: 30%;
        height: 30%;
        margin-bottom: 10px;
    }
    #footer .footer-inner address {
        float: none;
        clear: both;
        width: 100%;
        text-align: center;
        line-height: 100%;
        font-size: 11px;
    }

}