@charset "UTF-8";

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/*============================
ナビゲーション
==============================*/

/*ナビゲーションメニュー固定*/

    #header {
        position:fixed;
        top:0;
        left:0;
        width:100%;
        height:60px;
        background:white;
        z-index:99;
    }
/*ナビゲーション幅*/
nav {
    position:fixed;
    top:0;
    right:0;
    width:60%;
    height:62px;
}

/*ナビゲーション文字*/
nav ul{
	 display: flex;
    align-items: center;
    height: 80px;
    justify-content: space-around;
    list-style: none;
	white-space: nowrap;             /* メニュー文字を改行しない */
}	
	


/*アイティコーポレーション文字*/
h1{
    color: black;
    text-align:center;
    top: 30%;
    padding: 10px;
    display: flex;
    align-items: center;
	font-size: 20px;
}
.menu2 {
	display: flex;


}

a {
    text-decoration:none; 
}

a:hover {
  text-decoration: underline;
}



h2{
    border-radius: 20px;
    width: 100%;
    padding: 20px;
}

h2 p{
    text-align: center;    
}

h3{
    color: blue
	background-color: aquamarine;
    width: 100%;
    text-align: center;
	font-size: 40px;  
	margin: 100px 0;
	border-bottom: 2px solid #0bd;　 　/* 下に線を引く */

}

h3 p{
    text-align: left; 
}

h4{
    font-size: 25px; 	
    width: 100%;
    padding: 20px;

}



p{
	text-align: left;　　 　/* 左揃え */
    margin-bottom: 2em; /* 段落間の余白 */


}
/*========================
  main横幅
==========================*/
main{		
    max-width: 1100px;
    top: 800px;
    margin: 0 auto;
}

/*============================
TOPページに戻る
==============================*/
#page_top{
    position:fixed;
    bottom: 80px;
    right:20px;
}

#page_top a{

    text-align: center;
    text-decoration: none;
    padding: 20px;
    background-color: aquamarine;
    border-radius: 50%; /*枠線の角の丸*/
}

/*マウスをポインタに乗せたときに色が変わる*/
#page_top a:hover{ 
    background-color: rgb(70, 212, 165);
}

/*============================
お知らせ
==============================*/
.osirase {
	display: flex;
	flex-wrap: wrap;
	justify-content: center; /* 左右中央 */
    width: 900px;
    margin: 0 auto ;

	margin-bottom: 40px; /* 要素の下に40pxの余白を追加 */
}

.item{
	margin-left: 50px;
}
.wrapper {                  /* 背景色を横いっぱいにする */

   /*　margin: 0 auto;          上下の余白を0にして左右中央に配置*/
  width:100%               /*追加*/
  margin:0;                 /*追加*/
}

ul,li{
	margin-left: 30px;
    padding:0;
    list-style: none;/*箇条書きリストの先頭についている「黒い点」や、「番号」の見た目に関する指定ができるプロパティ*/
}

/*=================
フッター
===================*/

footer{
    background-color: yellowgreen;
    text-align: center;
    margin-top: 50px;
    font-size: 20px;
}
/* パソコン画面では三本線を非表示 */
.menu-button {
    display: none;
}
	
/* =========================
スマホ用ハンバーガーメニュー
========================= */

.menu-button {
    display:none;
}


@media screen and (max-width:1000px){

    #header {
        position:fixed;
        top:0;
        left:0;
        width:100%;
        height:60px;
        background:white;
        z-index:99;
    }


    nav {
        position:fixed;
        top:0;
        right:0;
        width:auto;
        height:60px;
    }


    .menu-button {
        display:block;
        position:absolute;
        right:20px;
        top:15px;
        font-size:30px;
        background:white;
        border:none;
        cursor:pointer;
        z-index:100;
    }


    nav ul {
        display:none;
        flex-direction:column;
        height:auto;
        width:100%;
        padding-top:70px;
    }


    .menu.open ul {
        display:flex;
    }


    h1 {
        font-size:16px;
        padding:5px;
    }


    h1 img {
        width:50px;
    }

}

/* ===========================
パソコン画面 ロゴ位置
==============================*/
.site-logo {
    position:fixed;
    left:20px;
    top:10px;
    font-size:20px;
    padding:0;
    margin:0;
    display:flex;

    z-index:100;
}

.site-logo img {
    width:50px;
    margin-right:10px;
}


/* ================
スマホ画面
===================*/

@media screen and (max-width:768px){

    .site-logo {
        position:absolute;
        left:10px;
        top:5px;
        font-size:16px;
    }


    .site-logo img {
        width:40px;
        margin-right:5px;
    }

}


/*============================
スマホ表示 スライダー文字調整 
==============================*/

@media screen and (max-width:768px){

    .page-title {
        font-size:22px;
        margin-top:25%;
        line-height:1.5;
        padding:10px;
    }

}

/*============================
スマホ表示 お知らせ画像調整
==============================*/

@media screen and (max-width:768px){

  .osirase {
    width:100%;
    height:auto;
    padding:10px;
  }


  .item {
    margin-left:0;
    width:33.3%;
    padding:5px;
  }


  .item img {
    width:100%;
    height:auto;
  }


}