@charset "UTF-8";
/* CSS Document */

/* about */

.about p {
    margin-bottom: 30px;
}

.about h2 {
    font-size: 135%;
    font-weight: 500;
    margin-bottom: 20px;
}

.about ol {
	color: #333333;
	font-size: 120%;
	font-weight: 500;
	padding-left: 50px;
}

.about ol li {
	line-height: 1.2em;
	margin-bottom: 5px;
}



/* use */

.text dl {
    background: url("../images/bg_use.png") no-repeat 65px bottom;
    background-size: 16px;
    margin-bottom: 20px;
    padding-bottom: 30px;
}

.text dt {
    border-left: solid 1px #999999;
    border-right: solid 1px #999999;
    border-top: solid 1px #999999;
    font-size: 135%;
    font-weight: 500;
    line-height: 1.5em;
    padding: 10px;
}

.text dd {
    border-bottom: solid 1px #999999;
    border-left: solid 1px #999999;
    border-right: solid 1px #999999;
    padding-bottom: 10px;
    padding-left: 10px;
    padding-right: 10px;
}
    
.text div {
    border: solid 1px #999999;
    font-size: 135%;
    font-weight: 500;
    padding: 10px;
}

.images {
    font-size: 80%;
}

.images figure {
    margin-bottom: 30px;
}

.go-accession {
    text-align: center;
    list-style: none;
}

.go-accession a {
    color: #ffffff;
    display: block;
    font-size: 140%;
    font-weight: 600;
}


/* faq */

.faq dl dt {
    font-weight: 600;
    line-height: 1.5em;
    margin-bottom: 20px;
}

.faq dl dd {
    margin-bottom: 20px;
}

.faq dd p {
    padding-bottom: 20px;
}

/* disclaimer */

.disclaimer h2 {
    font-weight: 600;
    line-height: 1.5em;
    margin-bottom: 20px;
}

.signature {
    padding-top: 20px;
    text-align: right;
}

/* action */

.action p {
    margin-bottom: 30px;
}

.list {
    clear: both;
}

.list dl {
    border: solid 1px #41BED2;
    margin-bottom: 20px;
}

.list dl dt,
.list dl dd {
    padding: 10px;
}

.list dt {
    border-bottom: solid 1px #41BED2;
}


/* ---------- PC ---------- */
@media(min-width:1024px){
    
    /* about */

    .about h1 {
	padding-bottom: 40px;
	font-size: 230%;
    }

    .about {
        padding: 0 40px;
    }
    
    .about .text {
	width: 820px;
    }

    .about .images {
        width: 400px;
        float: right;
    }

    /* use */
    
    .use h1 {
        padding-bottom: 40px;
    }
    
    .text {
        float: left;
        width: 440px;
    }
 
    .images {
        float: right;
        width: 385px;
    }
    
    .go-accession {
        clear: both;
    }
    
    .go-accession li {
        margin: 0 auto;
        width: 315px;
    }
    
    .go-accession a {
        background: url("../images/bttn_go_accession.png") no-repeat center top;
        background-size: 315px;
        padding: 16px 0 21px 0;
    }
    
    /* faq */
    
    .faq section {
        margin: 0 auto;
        padding-top:40px;
        width: 700px;
    }

    .faq dl dt {
        font-size: 150%;
    }

    .faq dl dd {
        padding-left: 30px;
    }
    
    /* disclaimer */

    .disclaimer section {
        margin: 0 auto;
        padding-top:40px;
        width: 700px;
    }
    
    .disclaimer h2 {
        font-size: 150%;
    }
    
    /* action */

    .action p {
        margin: 0 auto 30px auto;
        width: 525px;
    }
    
    .list {
        margin: 0 auto;
        width: 460px;
    }
    
    .list dl {
        width: 220px;
    }

    .left {
        float: left;
    }

.right {
        float: right;
    }

}

/* ---------- iPhone / iPad ---------- */
@media(max-width:1023px) {

}

/* ---------- iPhone landscape / iPad ---------- */
@media(max-width:1023px) and (min-width: 569px){

    /* about */

    .about h1 {
        padding-bottom: 40px;
    }
    
    .about .text {
        float: left;
        margin-bottom: 30px;
        width: 360px;
    }

    .about .images {
        width: 340px;
        float: right;
    }
    
    .about .images img {
        max-width: 340px;
    }


    /* use */
    
    .use h1 {
        padding-bottom: 40px;
    }
    
    .text {
        float: left;
        width: 320px;
    }
 
    .images {
        float: right;
        width: 385px;
    }
    
    .go-accession {
        clear: both;
        padding-top: 30px;
    }
    
    .go-accession li {
        margin: 0 auto;
        width: 315px;
    }
    
    .go-accession a {
        background: url("../images/bttn_go_accession.png") no-repeat center top;
        background-size: 315px;
        padding: 16px 0 21px 0;
    }


    /* faq */
    
    .faq section {
        margin: 0 auto;
        padding-top:40px;
        width: 700px;
    }

    .faq dl dt {
        font-size: 150%;
    }
    
    /* disclaimer */
    
    .disclaimer section {
        margin: 0 auto;
        padding-top:40px;
        width: 700px;
    }
    
    .disclaimer h2 {
        font-size: 150%;
    }

    /* action */

    .action p {
        margin: 0 auto 30px auto;
        width: 525px;
    }
    
    .list {
        margin: 0 auto;
        width: 460px;
    }
    
    .list dl {
        width: 220px;
    }

    .left {
        float: left;
    }

    .right {
        float: right;
    }

}

/* ---------- iPhone ---------- */
@media(max-width:568px) {

    /* about */
    
    .about h1 {
        padding-bottom: 30px;
    }
    
    /* use */

    .text {
        margin-bottom: 30px;
    }
    
    .images img {
        width: 100%;
    }
    
    .go-accession a {
        background: url("../images/bttn_go_accession.png") no-repeat center top;
        background-size: 280px;
        padding: 12px 0 21px 0;
    }

    /* faq */

   .faq dl dt {
        font-size: 120%;
    }

    /* disclaimer */
    
    .disclaimer section {
        padding-bottom: 10px;
    }
    
    .disclaimer p {
        margin-bottom: 20px;
    }
    
    .disclaimer h2 {
        font-size: 120%;
    }

}