body{
    font-size: 10px ;
}

img {
    width: 100% ;
}

br.pcNone{
    display: block ;
}
br.spNone{
    display: none ;
}
.all    {
    width: 100% ;
}

.body   {
    width: 100%;
}

.introduction   {
    width: 90% ;
    margin: 0 auto 150px ;
    font-size: 11px;
    line-height: 1.8 ;
    text-align: center;
}

.text_title {
    font-size: 17px;
    
}

.text_title  span {
    font-size: 28px;
    margin:0px;
}


.top    {
    width: 100% ;
    margin:0px auto 100px ;
}

.topimg    {
    width: 100% ;   
}

.pants_img {
    width: 90% ;
    margin-bottom: 30px ;
    margin: 0 auto;
}

.pants_text    {
    line-height: 3.5 ;
    align-items: center;
    justify-content: center; 
    font-size: 16px;
    text-align: center;
}

.block  {
    width: 100% ;
    display: block ;
    justify-content:space-between ;  
    font-size: 10px ;
    margin: 0 auto 50px ;
}

.buy    {
    width: 100% ;
    margin: 15px 0;
    display: flex;
    justify-content: space-around   ;
}

.buy span    {
    background: #000 ;
    color: #fff ;
    padding: 8px 16px ;
    font-size: 14px ;
    text-align: center;  
   
}

.imgbuy {
    width: 100%;
    text-align: center;
    margin: 10px 0 ;
    
}

.buy  {
    display: inline-flex;
    justify-content: space-around  ;    
}

.block a{
    text-decoration: none ;
    color: white ;
    text-align: left ;
}

.footerimg  {
    width: 33%;
}

.footer1  {
    width: 90%;
    display: flex;
    flex-wrap: wrap;
    margin: 200px auto 0 ;
    justify-content: center
}  



.copy   {
    text-align: center;
    font-size: 10px;
    margin-bottom: 30px;
}

.ciaopanic  {
    width: 30%;
    margin: 0 auto 50px;
}

.sakula {
    margin: 100px auto ;
}
/* pc用 */

@media screen and (min-width: 768px) {  
    body{
        
    }
    
    br.pcNone{
        display: none ;
    }
    br.spNone{
        display: block ;
    }
    .all    {
        width: 1280px  ;
        margin: 0 auto ;
    }
    
    .top    {
        width: 1280px  ;
        margin: 0px  auto 150px ;
        display: flex  ;  
    }
    .topimg {
        width: 1060px ;
        margin: 0 auto;
    }

    .topimg_sp{
        display: none ;
        }

  

    .introduction   {
        width: 90% ;
        margin: 0 auto 150px ;
        font-size: 14px;
        line-height: 1.8 ;
        text-align: center;
    }
    
    .text_title {
        font-size: 20px;
        
    }
    
    .text_title  span {
        font-size: 45px;
        margin:0 20px;
    }
    

    .text   {
        display: block ;
 
    }

    .block  {
        width: 800px ;
        display: flex ;
        justify-content:space-between ;
        margin-bottom:150px ;
        flex-wrap: wrap;
    }
    
    div.block01,div.block02,div.block03,div.block04,
    div.block05,div.block06,div.block07,div.block08,
    div.block09,div.block10,div.block11,div.block12,
    div.block13,div.block14,div.block15,div.block16,
    div.block17,div.block18,div.block19,div.block20,
    div.block21,div.block22,div.block23,div.block24,
    div.block25,div.block26,div.block27,div.block28 {
        width: 45%;
    }

    .pants_img{
        width: 380px;
    }

    .pants_text    {
        height: 466px;
        line-height: 3.5 ;
        display: flex;
        align-items: center;
        justify-content: center; 
        font-size: 16px;
        text-align: center;
        margin-bottom: 20px;
    }


    .ciaopanic  {
        width: 180px;
        margin: 0 auto 100px;
    }

    .footer1    {
        width: 1280px ;
        display: flex;
        flex-wrap: wrap;
        margin-top: 200px;
        
        
    }

    .footerimg  {
        width: 200px;
            }

    .sakula {
        
    width: 500px;
   
    }
    div.footer1 div.footerimg:nth-child(1){
        order: 1;
    }
    div.footer1 div.footerimg:nth-child(2){
        order: 2;
    }
    div.footer1 div.footerimg:nth-child(3){
        order: 4;
    }
    div.footer1 div.footerimg:nth-child(4){
        order: 5;
    }
    div.footer1 div.footerimg:nth-child(5){
        order: 3;
    }
    div.footer1 div.footerimg:nth-child(6){
        order: 6;
    }
    div.footer1 div.footerimg:nth-child(7){
        order: 7;
    }
    div.footer1 div.footerimg:nth-child(8){
        order: 9;
    }
    div.footer1 div.footerimg:nth-child(9){
        order: 8;
    }
    div.footer1 div.footerimg:nth-child(10){
        order: 11;
    }
    div.footer1 div.footerimg:nth-child(11){
        order: 10;
    }
    div.footer1 div.footerimg:nth-child(12){
        order: 12;
    }

    .block01{
        order: 2;
    }
    .block02{
        order: 1;
    }
    .block03{
        order: 3;
    }
    .block04{
        order: 4;
    }
    .block05{
        order: 4;
    }
    .block06{
        order: 1;
    }
    .block07{
        order: 2;
    }
    .block08{
        order: 3;
    }
    .block09{
        order: 2;
    }
    .block10{
        order: 1;
    }
    .block11{
        order: 3;
    }
    .block12{
        order: 4;
    }
    .block13{
        order: 3;
    }
    .block14{
        order: 1;
    }
    .block15{
        order: 2;
    }
    .block16{
        order: 4;
    }
    .block17{
        order: 4;
    }
    .block18{
        order: 1;
    }
    .block19{
        order: 2;
    }
    .block020{
        order: 3;
    }
    .block21{
        order: 3;
    }
    .block22{
        order: 1;
    }
    .block23{
        order: 2;
    }
    .block24{
        order: 4;
    }
    .block25{
        order: 2;
    }
    .block26{
        order: 1;
    }
    .block27{
        order: 3;
    }
    .block28{
        order: 4;
    }
}

    @media screen and (max-width: 768px) {
        
        .pants_text {
            margin-top: 150px;
            margin-bottom: 50px;
        }

        .topimg {
            display: none ;
            }



}