﻿body{
    margin:0;
    padding:0;
    font-family:"Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
    font-size:100%;
    cursor: auto;
    background-color:#f3ff9f;
}
a:link{
    color:#000;
    text-decoration:none;
}
a:visited {
    color:#000;
}
a:hover {
    color:#000;
    text-decoration:none;
}
a:active {
    color:#000;
}

#pc_contents{
    display:block;
    width:100%;
    margin: 0 auto;
    padding:0;
}
#sp_contents{
    display:none;
}
.br_pc { display:inline; }
.br_sp { display:none; }



/*============================================

COMMON - HEADER

============================================*/
header{
    margin: 0 auto;
    padding:0;
    text-align: center;
}
header h1{
    margin: 0 auto;
    padding:1em;
}
h1 img{
    width:300px;
}
.wrap{
    width:1000px;
    margin: 0 auto;
    padding:0;
    background-color: #FFF;
}

section{
    text-align: center;
}

p{
    margin:0em;
    padding:0em;
}


/*============================================

COMMON - HEADER

============================================*/
#introduction{
}
#introduction h2{
    margin:0 0 0.2em 0;
    padding:0;
    font-size:3.3em;
    font-weight:700;
    color:#009944;
    line-height:1.2em;
}
h2 span{
    font-size:0.8em;
}
#introduction img{
    width:80%;
}
#introduction p{
    font-size:1.5em;
}



/*============================================

COMMON - EX1

============================================*/
#ex1{
}
#ex1 h3{
    margin:2em 0 0.2em 0;
    padding:0;
}
#ex1 div{
    padding:1em;
    display:inline-block;
    border: 1px #000 solid;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
    border-bottom-left-radius: 20px;       
    font-size:1.2em; 
}
#ex1 img{
    margin:0 0 1em 0;
    padding:0;
    width:80%;
}

/*============================================

COMMON - EX2

============================================*/
#ex2{
    margin:5em 0 0 0;
}
#ex2 h3{
    margin:0 0 0.5em 0;
    padding:0;
    font-size:1.5em;
    color:#009944;
}
#ex2 h4{
    margin:0 0 1em 0;
    padding:0.1em 2em 0.1em 2em;
    color:#FFF;
    font-size:3em;
    display:inline-block;
    background-color:#abcd03;
    border-top-left-radius: 35px;
    border-top-right-radius: 35px;
    border-bottom-right-radius: 35px;
    border-bottom-left-radius: 35px;
}
#ex2 h5{
    margin:0 0 1em 0;
    padding:0em;
    font-size:2.4em;
    font-weight:500;
}
#ex2 img{
    width:80%;
}
#ex2 div{
    margin:5em auto 0 auto;
    width:80%;
    text-align:left;
}
#ex2 div p{
    font-size:1.2em;
}
#ex2 h6{
    margin:3em 0 0 0;
    padding:0em;
    font-size:1.7em;
    color:#009944;
}
#ex2 img{
    margin:2em 0 0 0;
    width:70%;
}

/*============================================

COMMON - EX3

============================================*/
#ex3{
}
#ex3 h3{
    margin:0 0 0.5em 0;
    padding:0;
    font-size:1.5em;
    color:#009944;
}
#ex3 h4{
    margin:0 0 1em 0;
    padding:0.1em 2em 0.1em 2em;
    color:#FFF;
    font-size:3em;
    display:inline-block;
    background-color:#abcd03;
    border-top-left-radius: 35px;
    border-top-right-radius: 35px;
    border-bottom-right-radius: 35px;
    border-bottom-left-radius: 35px;
}
#ex3 h5{
    margin:0 0 1em 0;
    padding:0em;
    font-size:2.4em;
    font-weight:500;
}
#ex3 img{
    width:30%;
}
#ex3 div{
    margin:5em auto 0 auto;
    width:80%;
    text-align:left;
}
#ex3 div p{
    font-size:1.2em;
}
#ex3 h6{
    margin:3em 0 0 0;
    padding:0em;
    font-size:1.7em;
    color:#009944;
}
#ex3 div img{
    margin:2em 0 0 0;
    width:70%;
}
.imgatt{
    margin:0 0 0 1em;
    padding:0;
    width:50%;
}
.imgatt img{
    margin:0;
    padding:0;
}

/*============================================

COMMON

============================================*/
.pagetop {
    position: fixed;
    top: 40px;
    right: 40px;
    margin:0 0 1em 0;
    padding:0.1em 1em 0.1em 1em;
    border: 1px solid #000;
    font-size:1em;
    display:inline-block;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
    background-color:#FFF;
}
.btn{
    margin:2em 0 3em 0;
    padding:0.2em 1em 0.2em 1em;
    font-size:1.5em;
    font-weight:bold;
    display:inline-block;
    border: 1px #000 solid;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;       
}
.att{
    margin:0 0 0 1em;
    font-size:0.9em !important;
    line-height:1.5em;
    text-align:left;
}








 /* ===========================================
	スマートフォン系 748 - 
=========================================== */
@media screen and (max-width: 750px) {
#pc_contents{
    display:none;
}
#sp_contents{
    display:block;
}
.br_pc { display:none; }
.br_sp { display:inline; }



/*============================================

COMMON - HEADER

============================================*/
header{
    margin: 0 auto;
    padding:0;
    text-align: center;
}
header h1{
    margin: 0 auto;
    padding:1em;
}
h1 img{
    width:300px;
}
.wrap{
    width:700px;
    margin: 0 auto;
    padding:0;
    background-color: #FFF;
}

section{
    text-align: center;
}

p{
    margin:0em;
    padding:0em;
}


/*============================================

COMMON - HEADER

============================================*/
#introduction{
}
#introduction h2{
    margin:0 0 0 0;
    padding:0;
    font-size:2.2em;
    font-weight:700;
    color:#009944;
    line-height:1.2em;
}
h2 span{
    font-size:0.8em;
}
#introduction img{
    width:90%;
}
#introduction p{
    padding:0.5em 0 1em 0;
    font-size:1.2em;
}



/*============================================

COMMON - EX1

============================================*/
#ex1{
}
#ex1 h3{
    margin:2em 0 0.2em 0;
    padding:0;
}
#ex1 div{
    display:inline-block;
    border: 1px #000 solid;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
    border-bottom-left-radius: 20px;       
    font-size:1.2em; 
    width:85%;
}
#ex1 img{
    margin:0 0 1em 0;
    padding:0;
    width:90%;
}

/*============================================

COMMON - EX2

============================================*/
#ex2{
    margin:5em 0 0 0;
}
#ex2 h3{
    margin:0 0 0.5em 0;
    padding:0;
    font-size:1.5em;
    color:#009944;
}
#ex2 h4{
    margin:0 0 1em 0;
    padding:0.1em 2em 0.1em 2em;
    color:#FFF;
    font-size:3em;
    display:inline-block;
    background-color:#abcd03;
    border-top-left-radius: 35px;
    border-top-right-radius: 35px;
    border-bottom-right-radius: 35px;
    border-bottom-left-radius: 35px;
}
#ex2 h5{
    margin:0 0 1em 0;
    padding:0em;
    font-size:2em;
    font-weight:500;
}
#ex2 img{
    width:90%;
}
#ex2 div{
    margin:5em auto 0 auto;
    width:90%;
    text-align:left;
}
#ex2 div p{
    font-size:1.2em;
}
#ex2 h6{
    margin:3em 0 0 0;
    padding:0em;
    font-size:1.7em;
    color:#009944;
}
#ex2 img{
    margin:2em 5% 0 5% !important;
}

/*============================================

COMMON - EX3

============================================*/
#ex3{
}
#ex3 h3{
    margin:0 0 0.5em 0;
    padding:0;
    font-size:1.5em;
    color:#009944;
}
#ex3 h4{
    margin:0 0 1em 0;
    padding:0.1em 2em 0.1em 2em;
    color:#FFF;
    font-size:3em;
    display:inline-block;
    background-color:#abcd03;
    border-top-left-radius: 35px;
    border-top-right-radius: 35px;
    border-bottom-right-radius: 35px;
    border-bottom-left-radius: 35px;
}
#ex3 h5{
    margin:0 0 1em 0;
    padding:0em;
    font-size:2em;
    font-weight:500;
}
#ex3 img{
    width:30%;
}
#ex3 div{
    margin:5em auto 0 auto;
    width:90%;
    text-align:left;
}
#ex3 div p{
    font-size:1.2em;
}
#ex3 h6{
    margin:3em 0 0 0;
    padding:0em;
    font-size:1.7em;
    color:#009944;
}
#ex3 div img{
    margin:2em 5% 0 5% !important;
    width:90%;
}
.imgatt{
    margin:0 0 0 1em;
    padding:0;
    width:80%;
}
.imgatt img{
    margin:0;
    padding:0;
}

/*============================================

COMMON

============================================*/
.pagetop {
    position: fixed;
    top: 40px;
    right: 40px;
    margin:0 0 1em 0;
    padding:0.1em 1em 0.1em 1em;
    border: 1px solid #000;
    font-size:1.2em;
    font-weight:bold;
    display:inline-block;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
    background-color:#FFF;
}
.btn{
    margin:2em 0 3em 0;
    padding:0.2em 1em 0.2em 1em;
    font-size:1.5em;
    font-weight:bold;
    display:inline-block;
    border: 1px #000 solid;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;       
}
.att{
    margin:0 auto;
    font-size:0.8em !important;
    line-height:1.5em;
    text-align:left;
    width:90%;
}























}






