@charset "utf-8";
/* ========================================================
    Hotaka P-Suppo 標準スタイルシート        2020/05/21渡辺 作成
        CSSリセット
      とっておきのcss
        ・スムーズスクロール
        ・ページ偏移時、フェードイン
        pagetop スタイル
        グリッドシステム1140
    ======================================================= */
/* CSS Resets */
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,address,cite,code,del,dfn,em,img,ins,q,small,strong,sub,sup,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{border:0;margin:0;padding:0}article,aside,figure,figure img,figcaption,hgroup,footer,header,nav,section,video,object{display:block}a img{border:0}figure{position:relative}figure img{width:100%}

body {
 background:#fff;  /* Default #aaa */
}


/* css で動くスムーズスクロール 	21/02/02
	参考：https://www.to-r.net/media/smooth_scrolling_2019/
==========================================================================*/
html{
  scroll-behavior: smooth;
}


/* ページ偏移時、フェードインを行う 	21/02/02
	参考　https://q-az.net/fadein-open-only-css/ 
	=======================================================================*/
body {
    animation: fadeIn 2s ease 0s 1 normal;
    -webkit-animation: fadeIn 2s ease 0s 1 normal;
}

@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}




   .row {
    width: 100%;
    margin: 0 auto;
    overflow: hidden;
   }
   .per100 {
       width: 100%;
   }
   .per90 {
       width: 90%;
       margin: 0 auto;
   }
   .per80 {
    width: 80%;
    margin: 0 auto;
   }
   .per70 {
    width: 70%;
    margin: 0 auto;
   }
   .per60 {
    width: 60%;
    margin: 0 auto;
   }
   .per50 {
    width: 50%;
    margin: 0 auto;
   }   
   

/* 1140グリッドシステム ------------------------------------------------------

	参考：http://cssgrid.net ? http://www.twitter.com/andytlr
-------------------------------------------------------------------------*/


/* The 1140px Grid by Andy Taylor ? http://cssgrid.net ? http://www.twitter.com/andytlr ? http://www.catchingzebra.com */
.col1, .col2, .col3, .col4, .col5, .col6, .col7, .col8, .col9, .col10, .col11 {
margin-right: 3.8%;
float: left;
}

.col1 {
width: 4.85%;
}

.col2 {
width: 13.5%;
}

.col3 {
width: 22.15%;
}

.col4 {
width: 30.8%;
}

.col5 {
width: 39.45%;
}

.col6 {
width: 48.1%;
}

.col7 {
width: 56.75%;
}

.col8 {
width: 65.4%;
}

.col9 {
width: 74.05%;
}

.col10 {
width: 82.7%;
}

.col11 {
width: 91.35%;
}

.col12 {
width: 100%;
float: left;
}

.last {
margin-right: 0px;
}

img, object, embed {
max-width: 100%;
}