﻿/* ========================================================
    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 */
}

/* 自分が作成した共通部分 ================================================= */
a {
    text-decoration: none;
    color: #000;

}
a:hover {
    color: #FF860D;
}
li {
    list-style: none;
}



.space20 {
  margin-top: 20px;
}
.kadomaru {
    border: 1px #aaa solid;
    border-radius: 5px;
}
.clear {
    clear: both;
}

/* 画像配置-----------------------------------------------------*/
/*画像を右に配置　標準で800×600pxを使用*/
img.right {
    float: right;
	width: 30%;
	margin-left: 10px;
	border-radius: 5px;
}
/* css で動くスムーズスクロール */
html{
  scroll-behavior: smooth;
}
/* ページ偏移時、フェードインを行う */
/* 参考　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}
}
/* totop　-------------------------------------------------------*/
/* pagetop スタイル標準化する、標準仕様　ボタンは〇色は青色 20200521 */
.totop {
    position:fixed;
    right:20px;
    bottom:20px;
    text-align: center;
}

.totop a {
    display:block;
    width: 50px;
    height: 50px;
    color:#fff;
    text-decoration:none;
    background: #3dadea;
    border-radius:25px;

}
.totop a:hover {
    background: #023793;
}

/* 1140グリッドシステム=============================================== */
/* 全画面表示 */
.row {
 width: 100%;
 margin: 0 auto;
 overflow: hidden;
}

.w1140{
 max-width:1140px;
}
.w1600{
 max-width:1600px;
}

/* 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%;
}




/*テーブル（ta1）
---------------------------------------------------------------------------*/
/*ta1設定*/
.ta1 {
    width: 100%;
    margin: 0 auto 30px;
    border: 2px #aaa solid;
    border-collapse: collapse;
}
.ta1 td, .ta1 th {
    padding: 10px 15px; /*ボックス内の余白*/
    font-weight: normal;
    word-break: break-all;
    border: 1px #aaa solid;
}
/*行の設定*/
.ta1 tr {
    background: url(../images/line1.png) repeat-x left bottom;  /*装飾用のライン画像の読み込み。*/
}
/*テーブル１行目に入った見出し部分*/
.ta1 th.tamidashi {
    width: auto;
    text-align: center; /*左よせ*/
    background: url(../images/line1.png) repeat-x left top,rgba(255,255,255,0.2);   /*装飾用のライン画像の読み込み。*/
}
/*ta1の左側ボックス*/
.ta1 th {
    width: 35%;   /*幅*/
    text-align: left;
}
/*左側ボックスに画像を入れた場合の設定*/
.ta1 th img {
    width: 100%;
}