.active{
    animation: rint 1s forwards ;
}
@keyframes rint{
    from{
        opacity: 0;
        transform: translateY(-100px);
    }
    to{
        opacity: 1;
        transform: translateY(0);
    }
}
.active1{
    animation: rint 1s 0.2s forwards ;
}
.active2{
    animation: rint 1s 0.4s forwards ;
}
.active3{
    animation: rint2 1s 0.4s forwards ;
}
@keyframes rint2{
    from{
        transform: scale(3);
    }
    to{
        transform: scale(1);
    }
}
*{
    box-sizing: border-box;
}
body{            
    font-size: 20px;
    font-family: 'Roboto', sans-serif;
    color: black;
}
.a01{
    margin: 0;
    padding: 0;
    width: 100%;
    height: 400px;
    background: url(/images/a1.jpg) no-repeat bottom center /cover;
    color: black;
}
.a01>img{
    display: block;
    width: 400px;
    height: 80px;
    margin: auto;
    box-sizing: border-box;
    animation: rint 0.5s forwards;
    opacity: 0;
}
.a01 p{
    color: #f7d9a3;
    text-align: center;
    font-size: 1.2em;
    margin-top: -20px;
    animation: rint 0.5s 0.2s forwards;
    opacity: 0;
}
.a01aa{
    animation: rint 0.5s 0.5s forwards;
}
.alret {
    display: none;
}
h2, h3{            
    font-family: 'Roboto', sans-serif !important;
}
h3{
    color: white !important;
}
.a01aa{
    border: 2px solid #93673b ;
    border-radius: 30px;
    background: white;
    width: 150px;
    margin: auto;
    padding: 8px 30px 0;
    opacity: 0;           
}
.stt{
    margin-top: 50px;
    display: block;
    font-size: 1em;
    text-align: center;
    color: #868a01;
}
.mtt{
    font-size: 2.3em;
    text-align: center;
    margin: 0;
    font-family: 'Roboto', sans-serif !important;
    font-weight: bolder;
}
.ttt{
    color: #9b9b9b
}
.a02{
    max-width: 1100px;
    margin:20px auto;
    
}
.a02 .aa1{
    padding: 10px;
    opacity: 0;
}
.a02a{
    opacity: 0;
    position: relative;
    max-width: 1100px;
    margin: auto;
    margin-top: 30px;
}
.a02a .sub_box{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}
.a02a .sub_box>div{
    flex-basis: 300px;
    flex-grow: 1;
    flex-shrink: 1;
}
.a02a .title_box{
    width: 400px;
    top:-41px;
}
.a02a .stt{
    margin-top:0;
}
.a03{
    position: relative;
    max-width: 1100px;
    margin: auto;
    opacity: 0;
}
.title_box{
    width: 320px;
    height: 100px;
    margin: auto;
    background-color: rgb(255, 255, 255);
    border-right: 2px solid gray;
    border-bottom: 2px solid gray;
    position: absolute;
    top:5px;
    left: 50%;
    transform:translateX(-50%);
}
.r_box{
    margin: 20px;
    padding: 20px;
    box-sizing: border-box;
    background-color: #ebebeb;
    border-radius: 20px;
    text-align: center;
}
.a03 .stt{
    margin-top: 5px;
}
.a03 .m_box{
    display: flex;
    flex-direction: row;
}
.a03 .s_box{
    flex-basis: 100px;
    flex-grow: 1;
    flex-shrink: 1;
    text-align: center;
    padding: 1%;
}
.a03 .s_box h2{
    color:#868a01 ;
}

.container{
    max-width: 1100px;
    margin: auto;
    padding: 3% 5%;
}
.p01{
    background: url(/images/back02.png) no-repeat center center /cover;
}
.p01 h2{
    border-top: 4px solid #93673b;
    border-bottom: 4px solid #93673b;
    font-size: 1.23em;
    line-height: 40px;
}
.flex_m{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}
.flex_m>div{
    flex-basis: 400px;
    flex-grow: 2;
    flex-shrink: 2;
    padding: 1%;
}
.p01 .flex_m>div{
    flex-basis: 200px;
    flex-grow: 1;
    flex-shrink: 1;
}
.p02{
    background:#93673b url(/images/back03.png) no-repeat center center /cover;
    color: white;
}
li{list-style: none;}
.p02 h2{
    border-top: 4px solid white;
    border-bottom: 4px solid white;
    font-size: 1.23em;
    color: white;
    line-height: 40px;
}
.p02 li{
    padding-left: 25px;
    background: url(/images/icon01.png) no-repeat left 5px ;
}

.p03{
    background: url(/images/back04.png) no-repeat center center /cover;
}
.p03 h2{
    border-top: 4px solid #93673b;
    border-bottom: 4px solid #93673b;
    font-size: 1.23em;
    line-height: 40px;
}
.p03 .flex_m>div>div{
    border: 1px solid;
}
.iii{
    display: block;
    margin: auto;
}
.p03 .flex_m img{
    box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
}
.p04{
    background:#93673b url(/images/back05.png) no-repeat center center /cover;;
    color: white;
}
li{list-style: none;}
.p04 h2{
    border-top: 4px solid white;
    border-bottom: 4px solid white;
    font-size: 1.23em;
    color: white;
    line-height: 40px;
}
.p04 .flex_m img{
    box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
}

.p05{
    background: url(/images/back02.png) no-repeat center center /cover;
}
.p05 h2{
    border-top: 4px solid #93673b;
    border-bottom: 4px solid #93673b;
    font-size: 1.23em;
    line-height: 40px;
}
.p05 .flex_m>div>div{
    border: 1px solid;
}
.p05 .flex_m img{
    box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
}

.p06{
    background:#93673b url(/images/back03.png) no-repeat center center /cover;;
    color: white;
}
li{list-style: none;}
.p06 h2{
    border-top: 4px solid white;
    border-bottom: 4px solid white;
    font-size: 1.23em;
    color: white;
    line-height: 40px;
}
.p06 .flex_m img{
    box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
}
.p07{
    background: url(/images/back04.png) no-repeat center center /cover;
}
.p07 h2{
    border-top: 4px solid #93673b;
    border-bottom: 4px solid #93673b;
    font-size: 1.23em;
    line-height: 40px;
}
.p07 .flex_m>div>div{
    border: 1px solid;
}
.p07 .flex_m img{
    box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
}
.p07 p{
    text-align: center;
}
.p08{
    background:#93673b url(/images/back05.png) no-repeat center center /cover;;
    color: white;
}
.p08 h2{
    border-top: 4px solid white;
    border-bottom: 4px solid white;
    font-size: 1.23em;
    color: white;
    line-height: 40px;
}
.p08 .flex_m img{
    box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
}
.p08 p{
    text-align: center;
}

.p09{
    background: url(/images/back02.png) no-repeat center center /cover;
}
.p09 h2{
    border-top: 4px solid #93673b;
    border-bottom: 4px solid #93673b;
    font-size: 1.23em;
    line-height: 40px;
}
.p09 .flex_m>div>div{
    border: 1px solid;
}
.p09 .flex_m img{
    box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
}  

.p10{
    background:#93673b url(/images/back03.png) no-repeat center center /cover;;
    color: white;
}
.p10 h2{
    border-top: 4px solid white;
    border-bottom: 4px solid white;
    font-size: 1.23em;
    color: white;
    line-height: 40px;
}
.p10 .flex_m img{
    box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
}        

.p11{
    background: url(/images/back04.png) no-repeat center center /cover;
}
.p11 h2{
    border-top: 4px solid #93673b;
    border-bottom: 4px solid #93673b;
    font-size: 1.23em;
    line-height: 40px;
}
.p11 .flex_m>div>div{
    border: 1px solid;
}
.p11 .flex_m img{
    box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
}  
.p12{
    background:#93673b url(/images/back05.png) no-repeat center center /cover;;
    color: white;
}
.p12 h2{
    border-top: 4px solid white;
    border-bottom: 4px solid white;
    font-size: 1.23em;
    color: white;
    line-height: 40px;
}
.p12 .flex_m img{
    box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
}  

.p13{
    background: url(/images/back02.png) no-repeat center center /cover;
}
.p13 h2{
    border-top: 4px solid #93673b;
    border-bottom: 4px solid #93673b;
    font-size: 1.23em;
    line-height: 40px;
}
.p13 .flex_m>div>div{
    border: 1px solid;
}
.p13 .flex_m img{
    box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
}       

.p14{
    background:#93673b url(/images/back03.png) no-repeat center center /cover;;
    color: white;
}
.p14 h2{
    border-top: 4px solid white;
    border-bottom: 4px solid white;
    font-size: 1.23em;
    color: white;
    line-height: 40px;
}
.p14 .flex_m img{
    box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
} 
.p14 li{
    text-align: center;
    margin: 2% 0;
}  
.p15{
    background: url(/images/back04.png) no-repeat center center /cover;
}
.p15 h2{
    border-top: 4px solid #93673b;
    border-bottom: 4px solid #93673b;
    font-size: 1.23em;
    line-height: 40px;
}
.p16{
    background:#93673b url(/images/back05.png) no-repeat center center /cover;;
    color: white;
}
.p16 h2{
    border-top: 4px solid white;
    border-bottom: 4px solid white;
    font-size: 1.23em;
    color: white;
    line-height: 40px;
}
.p16 .flex_m img{
    box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
}       
.p16 .flex_m div{
    margin: 0;
    padding: 0;
} 
.a04{
    max-width: 1100px;
    margin: auto;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;  
    background-color: white; 
}
.a04>div{
    flex-basis: 450px;
    flex-grow: 1;
    flex-shrink: 1;
}
.mli {
    margin: 20px auto;
    margin-left: 10%;
    overflow: hidden;
    font-size: 0.8em;
}
.mli:nth-of-type(3) div:nth-of-type(2){
    margin-top: -20px;
}
.mli h3{
    margin: 0;
    color:#868a01 !important;
}
.mli div{
    float: left;
}
.mli div:nth-of-type(2){
    width: 60%;
    padding: 20px;
}

.a04 .r_box{
    font-size: 1.5em;
    line-height: 70px;
}   
.a05 .container{
    max-width: 1100px;
    margin: auto;
    position: relative;
    padding: 30px;
    padding-top: 130px;
}
.a05{
    background: url(/images/a05_03.jpg) no-repeat center center /cover fixed;
    opacity: 0;
}
.a05 .stt{
    margin-top: 5px;
}
.nb{
    background-color: white;
    width: 40px;
    height: 40px;
    line-height: 40px;
    border-radius: 50%;
    color: rgb(154, 154, 154);
    text-align: center;
    font-size: 1.5em;
    font-weight: bolder;
    margin: auto;
}
.n_list{
    text-align: center;
    margin: 50px;
}
.n_list h2{
    color: white !important;
}
.n_list .ttt{
    font-size: 1.3em;
}
.s05 .title_box{
    opacity: 0;
}
.a06{
    max-width: 1100px;
    margin: auto;
}
.l_list{
    width: fit-content;
    margin: 50px;
    display: flex;
    flex-direction: row;            
}
.l_list>div:nth-of-type(1){
    flex-basis: 50px;
    flex-shrink: 1;
}
.l_list>div:nth-of-type(2){
    padding: 10px;
    flex-basis: 550px;
    flex-shrink: 2;
}